@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Jost:wght@400&family=Marcellus&family=Courgette&family=Noto+Serif+JP:wght@400;500;600&family=Noto+Sans+JP:wght@400;500;700&display=swap");
@keyframes wheel {
	0% {
		width: 0px;
		right: -27px;
		opacity: 0;
		transform: rotate(0deg);
	}
	10% {
		opacity: 1;
	}
	50% {
		width: 14px;
		right: -35px;
		opacity: 1;
	}
	90% {
		opacity: 1;
	}
	100% {
		width: 0px;
		right: -27px;
		opacity: 0;
		transform: rotate(360deg);
	}
}
@keyframes buttonwheel {
	0% {
		height: 0px;
		opacity: 0;
		transform: translateY(50%) rotate(-90deg);
	}
	10% {
		opacity: 1;
	}
	50% {
		height: 25px;
		opacity: 1;
	}
	90% {
		opacity: 1;
	}
	100% {
		height: 0px;
		opacity: 0;
		transform: translateY(50%) rotate(270deg);
	}
}
* {
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	text-size-adjust: 100%;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
}

html {
	font-size: 17px;
	overflow-y: scroll;
	scroll-behavior: smooth;
}
@media screen and (max-width: 767px) {
	html {
		font-size: 16px !important;
	}
}

:target {
	scroll-margin-top: 120px;
}
@media screen and (max-width: 959px) {
	:target {
		scroll-margin-top: 60px;
	}
}

body, th, td, input, select, textarea {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	font-family: "Noto Sans JP", sans-serif;
}
@media screen and (max-width: 959px) {
	body, th, td, input, select, textarea {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	body, th, td, input, select, textarea {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}

body {
	margin: 0px auto;
	color: #1A1311;
	background: #ffffff;
	overflow: clip;
}

main {
	position: relative;
	min-height: 50vh;
	z-index: 0;
}

img {
	display: block;
	max-width: 100%;
	height: auto;
	border: 0px;
}

a {
	text-decoration: none;
}

dl, ul, ol {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

p, dt, dd, h1, h2, h3, h4, h5, h6 {
	margin: 0px;
	padding: 0px;
}

.clear {
	clear: both;
}

@media screen and (max-width: 767px) {
	.view_pc {
		display: none !important;
	}
}

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

.block17 .list dd > p:not(.image):not(.caption) a.noicon:after, .contents .text p:not(.image):not(.caption) a.noicon:after, .contents > div > p:not(.image):not(.caption) a.noicon:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a.noicon:after, .contents .column > * > p:not(.image):not(.caption) a.noicon:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a.noicon:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a.noicon:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a.noicon:after, .contents .box > p:not(.image):not(.caption) a.noicon:after, .contents .form > dl > dd > p:not(.image):not(.caption) a.noicon:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a.noicon:after, .faqlist dl dd > p:not(.image):not(.caption) a.noicon:after, .textblock > p:not(.image):not(.caption) a.noicon:after, .block17 .list dd > ul > li a.noicon:after, .contents .text ul > li a.noicon:after, .contents > div > ul > li a.noicon:after, .contents .imagebox > *:not(.image) > ul > li a.noicon:after, .contents .column > * > ul > li a.noicon:after, .contents .table > table > tbody > tr > th > ul > li a.noicon:after, .contents .table > table > tr > td:not(.d) > ul > li a.noicon:after, .contents .table > table > tbody > tr > td > ul > li a.noicon:after, .contents .box > ul > li a.noicon:after, .contents .form > dl > dd > ul > li a.noicon:after, .headdingmenu > div > a > div > ul > li a.noicon:after, .faqlist dl dd > ul > li a.noicon:after, .textblock > ul > li a.noicon:after, .block17 .list dd > ol > li a.noicon:after, .contents .text ol > li a.noicon:after, .contents > div > ol > li a.noicon:after, .contents .imagebox > *:not(.image) > ol > li a.noicon:after, .contents .column > * > ol > li a.noicon:after, .contents .table > table > tbody > tr > th > ol > li a.noicon:after, .contents .table > table > tr > td:not(.d) > ol > li a.noicon:after, .contents .table > table > tbody > tr > td > ol > li a.noicon:after, .contents .box > ol > li a.noicon:after, .contents .form > dl > dd > ol > li a.noicon:after, .headdingmenu > div > a > div > ol > li a.noicon:after, .faqlist dl dd > ol > li a.noicon:after, .textblock > ol > li a.noicon:after, .block17 .list dd:not(.image) > a.noicon:after, .contents > div:not(.image) > a.noicon:after, .contents .imagebox > *:not(.image):not(.image) > a.noicon:after, .contents .column > *:not(.image) > a.noicon:after, .contents .table > table > tbody > tr > th:not(.image) > a.noicon:after, .contents .table > table > tr > td:not(.d):not(.image) > a.noicon:after, .contents .table > table > tbody > tr > td:not(.image) > a.noicon:after, .contents .box:not(.image) > a.noicon:after, .contents .form > dl > dd:not(.image) > a.noicon:after, .headdingmenu > div > a > div:not(.image) > a.noicon:after, .faqlist dl dd:not(.image) > a.noicon:after, .textblock:not(.image) > a.noicon:after {
	display: none;
}
.block17 .list dd > p:not(.image):not(.caption) a:after, .contents .text p:not(.image):not(.caption) a:after, .contents > div > p:not(.image):not(.caption) a:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a:after, .contents .column > * > p:not(.image):not(.caption) a:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a:after, .contents .box > p:not(.image):not(.caption) a:after, .contents .form > dl > dd > p:not(.image):not(.caption) a:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a:after, .faqlist dl dd > p:not(.image):not(.caption) a:after, .textblock > p:not(.image):not(.caption) a:after, .block17 .list dd > ul > li a:after, .contents .text ul > li a:after, .contents > div > ul > li a:after, .contents .imagebox > *:not(.image) > ul > li a:after, .contents .column > * > ul > li a:after, .contents .table > table > tbody > tr > th > ul > li a:after, .contents .table > table > tr > td:not(.d) > ul > li a:after, .contents .table > table > tbody > tr > td > ul > li a:after, .contents .box > ul > li a:after, .contents .form > dl > dd > ul > li a:after, .headdingmenu > div > a > div > ul > li a:after, .faqlist dl dd > ul > li a:after, .textblock > ul > li a:after, .block17 .list dd > ol > li a:after, .contents .text ol > li a:after, .contents > div > ol > li a:after, .contents .imagebox > *:not(.image) > ol > li a:after, .contents .column > * > ol > li a:after, .contents .table > table > tbody > tr > th > ol > li a:after, .contents .table > table > tr > td:not(.d) > ol > li a:after, .contents .table > table > tbody > tr > td > ol > li a:after, .contents .box > ol > li a:after, .contents .form > dl > dd > ol > li a:after, .headdingmenu > div > a > div > ol > li a:after, .faqlist dl dd > ol > li a:after, .textblock > ol > li a:after, .block17 .list dd:not(.image) > a:after, .contents > div:not(.image) > a:after, .contents .imagebox > *:not(.image):not(.image) > a:after, .contents .column > *:not(.image) > a:after, .contents .table > table > tbody > tr > th:not(.image) > a:after, .contents .table > table > tr > td:not(.d):not(.image) > a:after, .contents .table > table > tbody > tr > td:not(.image) > a:after, .contents .box:not(.image) > a:after, .contents .form > dl > dd:not(.image) > a:after, .headdingmenu > div > a > div:not(.image) > a:after, .faqlist dl dd:not(.image) > a:after, .textblock:not(.image) > a:after {
	display: inline-block;
	width: 25px;
	height: 20px;
	margin-left: 5px;
	margin-top: -4px;
	vertical-align: middle;
	background: none no-repeat center center;
	background-size: 16px auto;
}
.block17 .list dd > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .text p:not(.image):not(.caption) a[target="_blank"]:after, .contents > div > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .column > * > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .box > p:not(.image):not(.caption) a[target="_blank"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[target="_blank"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[target="_blank"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[target="_blank"]:after, .textblock > p:not(.image):not(.caption) a[target="_blank"]:after, .block17 .list dd > ul > li a[target="_blank"]:after, .contents .text ul > li a[target="_blank"]:after, .contents > div > ul > li a[target="_blank"]:after, .contents .imagebox > *:not(.image) > ul > li a[target="_blank"]:after, .contents .column > * > ul > li a[target="_blank"]:after, .contents .table > table > tbody > tr > th > ul > li a[target="_blank"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[target="_blank"]:after, .contents .table > table > tbody > tr > td > ul > li a[target="_blank"]:after, .contents .box > ul > li a[target="_blank"]:after, .contents .form > dl > dd > ul > li a[target="_blank"]:after, .headdingmenu > div > a > div > ul > li a[target="_blank"]:after, .faqlist dl dd > ul > li a[target="_blank"]:after, .textblock > ul > li a[target="_blank"]:after, .block17 .list dd > ol > li a[target="_blank"]:after, .contents .text ol > li a[target="_blank"]:after, .contents > div > ol > li a[target="_blank"]:after, .contents .imagebox > *:not(.image) > ol > li a[target="_blank"]:after, .contents .column > * > ol > li a[target="_blank"]:after, .contents .table > table > tbody > tr > th > ol > li a[target="_blank"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[target="_blank"]:after, .contents .table > table > tbody > tr > td > ol > li a[target="_blank"]:after, .contents .box > ol > li a[target="_blank"]:after, .contents .form > dl > dd > ol > li a[target="_blank"]:after, .headdingmenu > div > a > div > ol > li a[target="_blank"]:after, .faqlist dl dd > ol > li a[target="_blank"]:after, .textblock > ol > li a[target="_blank"]:after, .block17 .list dd:not(.image) > a[target="_blank"]:after, .contents > div:not(.image) > a[target="_blank"]:after, .contents .imagebox > *:not(.image):not(.image) > a[target="_blank"]:after, .contents .column > *:not(.image) > a[target="_blank"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[target="_blank"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[target="_blank"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[target="_blank"]:after, .contents .box:not(.image) > a[target="_blank"]:after, .contents .form > dl > dd:not(.image) > a[target="_blank"]:after, .headdingmenu > div > a > div:not(.image) > a[target="_blank"]:after, .faqlist dl dd:not(.image) > a[target="_blank"]:after, .textblock:not(.image) > a[target="_blank"]:after {
	content: "";
	background-image: url(../images/blank.svg);
}
.block17 .list dd > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .text p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".pdf"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".pdf"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".pdf"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".pdf"]:after, .textblock > p:not(.image):not(.caption) a[href$=".pdf"]:after, .block17 .list dd > ul > li a[href$=".pdf"]:after, .contents .text ul > li a[href$=".pdf"]:after, .contents > div > ul > li a[href$=".pdf"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".pdf"]:after, .contents .column > * > ul > li a[href$=".pdf"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".pdf"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".pdf"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".pdf"]:after, .contents .box > ul > li a[href$=".pdf"]:after, .contents .form > dl > dd > ul > li a[href$=".pdf"]:after, .headdingmenu > div > a > div > ul > li a[href$=".pdf"]:after, .faqlist dl dd > ul > li a[href$=".pdf"]:after, .textblock > ul > li a[href$=".pdf"]:after, .block17 .list dd > ol > li a[href$=".pdf"]:after, .contents .text ol > li a[href$=".pdf"]:after, .contents > div > ol > li a[href$=".pdf"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".pdf"]:after, .contents .column > * > ol > li a[href$=".pdf"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".pdf"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".pdf"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".pdf"]:after, .contents .box > ol > li a[href$=".pdf"]:after, .contents .form > dl > dd > ol > li a[href$=".pdf"]:after, .headdingmenu > div > a > div > ol > li a[href$=".pdf"]:after, .faqlist dl dd > ol > li a[href$=".pdf"]:after, .textblock > ol > li a[href$=".pdf"]:after, .block17 .list dd:not(.image) > a[href$=".pdf"]:after, .contents > div:not(.image) > a[href$=".pdf"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".pdf"]:after, .contents .column > *:not(.image) > a[href$=".pdf"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".pdf"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".pdf"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".pdf"]:after, .contents .box:not(.image) > a[href$=".pdf"]:after, .contents .form > dl > dd:not(.image) > a[href$=".pdf"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".pdf"]:after, .faqlist dl dd:not(.image) > a[href$=".pdf"]:after, .textblock:not(.image) > a[href$=".pdf"]:after {
	content: "";
	height: 19px;
	background-image: url(../images/pdf.svg);
	background-size: auto 100%;
}
.block17 .list dd > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .text p:not(.image):not(.caption) a[href$=".doc"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".doc"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".doc"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".doc"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".doc"]:after, .textblock > p:not(.image):not(.caption) a[href$=".doc"]:after, .block17 .list dd > ul > li a[href$=".doc"]:after, .contents .text ul > li a[href$=".doc"]:after, .contents > div > ul > li a[href$=".doc"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".doc"]:after, .contents .column > * > ul > li a[href$=".doc"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".doc"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".doc"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".doc"]:after, .contents .box > ul > li a[href$=".doc"]:after, .contents .form > dl > dd > ul > li a[href$=".doc"]:after, .headdingmenu > div > a > div > ul > li a[href$=".doc"]:after, .faqlist dl dd > ul > li a[href$=".doc"]:after, .textblock > ul > li a[href$=".doc"]:after, .block17 .list dd > ol > li a[href$=".doc"]:after, .contents .text ol > li a[href$=".doc"]:after, .contents > div > ol > li a[href$=".doc"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".doc"]:after, .contents .column > * > ol > li a[href$=".doc"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".doc"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".doc"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".doc"]:after, .contents .box > ol > li a[href$=".doc"]:after, .contents .form > dl > dd > ol > li a[href$=".doc"]:after, .headdingmenu > div > a > div > ol > li a[href$=".doc"]:after, .faqlist dl dd > ol > li a[href$=".doc"]:after, .textblock > ol > li a[href$=".doc"]:after, .block17 .list dd:not(.image) > a[href$=".doc"]:after, .contents > div:not(.image) > a[href$=".doc"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".doc"]:after, .contents .column > *:not(.image) > a[href$=".doc"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".doc"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".doc"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".doc"]:after, .contents .box:not(.image) > a[href$=".doc"]:after, .contents .form > dl > dd:not(.image) > a[href$=".doc"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".doc"]:after, .faqlist dl dd:not(.image) > a[href$=".doc"]:after, .textblock:not(.image) > a[href$=".doc"]:after, .block17 .list dd > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .text p:not(.image):not(.caption) a[href$=".docx"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".docx"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".docx"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".docx"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".docx"]:after, .textblock > p:not(.image):not(.caption) a[href$=".docx"]:after, .block17 .list dd > ul > li a[href$=".docx"]:after, .contents .text ul > li a[href$=".docx"]:after, .contents > div > ul > li a[href$=".docx"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".docx"]:after, .contents .column > * > ul > li a[href$=".docx"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".docx"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".docx"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".docx"]:after, .contents .box > ul > li a[href$=".docx"]:after, .contents .form > dl > dd > ul > li a[href$=".docx"]:after, .headdingmenu > div > a > div > ul > li a[href$=".docx"]:after, .faqlist dl dd > ul > li a[href$=".docx"]:after, .textblock > ul > li a[href$=".docx"]:after, .block17 .list dd > ol > li a[href$=".docx"]:after, .contents .text ol > li a[href$=".docx"]:after, .contents > div > ol > li a[href$=".docx"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".docx"]:after, .contents .column > * > ol > li a[href$=".docx"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".docx"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".docx"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".docx"]:after, .contents .box > ol > li a[href$=".docx"]:after, .contents .form > dl > dd > ol > li a[href$=".docx"]:after, .headdingmenu > div > a > div > ol > li a[href$=".docx"]:after, .faqlist dl dd > ol > li a[href$=".docx"]:after, .textblock > ol > li a[href$=".docx"]:after, .block17 .list dd:not(.image) > a[href$=".docx"]:after, .contents > div:not(.image) > a[href$=".docx"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".docx"]:after, .contents .column > *:not(.image) > a[href$=".docx"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".docx"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".docx"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".docx"]:after, .contents .box:not(.image) > a[href$=".docx"]:after, .contents .form > dl > dd:not(.image) > a[href$=".docx"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".docx"]:after, .faqlist dl dd:not(.image) > a[href$=".docx"]:after, .textblock:not(.image) > a[href$=".docx"]:after {
	content: "";
	height: 18px;
	background-image: url(../images/doc.svg);
	background-size: auto 100%;
}
.block17 .list dd > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .text p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".ppt"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".ppt"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".ppt"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".ppt"]:after, .textblock > p:not(.image):not(.caption) a[href$=".ppt"]:after, .block17 .list dd > ul > li a[href$=".ppt"]:after, .contents .text ul > li a[href$=".ppt"]:after, .contents > div > ul > li a[href$=".ppt"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".ppt"]:after, .contents .column > * > ul > li a[href$=".ppt"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".ppt"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".ppt"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".ppt"]:after, .contents .box > ul > li a[href$=".ppt"]:after, .contents .form > dl > dd > ul > li a[href$=".ppt"]:after, .headdingmenu > div > a > div > ul > li a[href$=".ppt"]:after, .faqlist dl dd > ul > li a[href$=".ppt"]:after, .textblock > ul > li a[href$=".ppt"]:after, .block17 .list dd > ol > li a[href$=".ppt"]:after, .contents .text ol > li a[href$=".ppt"]:after, .contents > div > ol > li a[href$=".ppt"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".ppt"]:after, .contents .column > * > ol > li a[href$=".ppt"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".ppt"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".ppt"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".ppt"]:after, .contents .box > ol > li a[href$=".ppt"]:after, .contents .form > dl > dd > ol > li a[href$=".ppt"]:after, .headdingmenu > div > a > div > ol > li a[href$=".ppt"]:after, .faqlist dl dd > ol > li a[href$=".ppt"]:after, .textblock > ol > li a[href$=".ppt"]:after, .block17 .list dd:not(.image) > a[href$=".ppt"]:after, .contents > div:not(.image) > a[href$=".ppt"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".ppt"]:after, .contents .column > *:not(.image) > a[href$=".ppt"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".ppt"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".ppt"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".ppt"]:after, .contents .box:not(.image) > a[href$=".ppt"]:after, .contents .form > dl > dd:not(.image) > a[href$=".ppt"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".ppt"]:after, .faqlist dl dd:not(.image) > a[href$=".ppt"]:after, .textblock:not(.image) > a[href$=".ppt"]:after, .block17 .list dd > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .text p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".pptx"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".pptx"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".pptx"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".pptx"]:after, .textblock > p:not(.image):not(.caption) a[href$=".pptx"]:after, .block17 .list dd > ul > li a[href$=".pptx"]:after, .contents .text ul > li a[href$=".pptx"]:after, .contents > div > ul > li a[href$=".pptx"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".pptx"]:after, .contents .column > * > ul > li a[href$=".pptx"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".pptx"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".pptx"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".pptx"]:after, .contents .box > ul > li a[href$=".pptx"]:after, .contents .form > dl > dd > ul > li a[href$=".pptx"]:after, .headdingmenu > div > a > div > ul > li a[href$=".pptx"]:after, .faqlist dl dd > ul > li a[href$=".pptx"]:after, .textblock > ul > li a[href$=".pptx"]:after, .block17 .list dd > ol > li a[href$=".pptx"]:after, .contents .text ol > li a[href$=".pptx"]:after, .contents > div > ol > li a[href$=".pptx"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".pptx"]:after, .contents .column > * > ol > li a[href$=".pptx"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".pptx"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".pptx"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".pptx"]:after, .contents .box > ol > li a[href$=".pptx"]:after, .contents .form > dl > dd > ol > li a[href$=".pptx"]:after, .headdingmenu > div > a > div > ol > li a[href$=".pptx"]:after, .faqlist dl dd > ol > li a[href$=".pptx"]:after, .textblock > ol > li a[href$=".pptx"]:after, .block17 .list dd:not(.image) > a[href$=".pptx"]:after, .contents > div:not(.image) > a[href$=".pptx"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".pptx"]:after, .contents .column > *:not(.image) > a[href$=".pptx"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".pptx"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".pptx"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".pptx"]:after, .contents .box:not(.image) > a[href$=".pptx"]:after, .contents .form > dl > dd:not(.image) > a[href$=".pptx"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".pptx"]:after, .faqlist dl dd:not(.image) > a[href$=".pptx"]:after, .textblock:not(.image) > a[href$=".pptx"]:after {
	content: "";
	height: 18px;
	background-image: url(../images/ppt.svg);
	background-size: auto 100%;
}
.block17 .list dd > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .text p:not(.image):not(.caption) a[href$=".xls"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".xls"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".xls"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".xls"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".xls"]:after, .textblock > p:not(.image):not(.caption) a[href$=".xls"]:after, .block17 .list dd > ul > li a[href$=".xls"]:after, .contents .text ul > li a[href$=".xls"]:after, .contents > div > ul > li a[href$=".xls"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".xls"]:after, .contents .column > * > ul > li a[href$=".xls"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".xls"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".xls"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".xls"]:after, .contents .box > ul > li a[href$=".xls"]:after, .contents .form > dl > dd > ul > li a[href$=".xls"]:after, .headdingmenu > div > a > div > ul > li a[href$=".xls"]:after, .faqlist dl dd > ul > li a[href$=".xls"]:after, .textblock > ul > li a[href$=".xls"]:after, .block17 .list dd > ol > li a[href$=".xls"]:after, .contents .text ol > li a[href$=".xls"]:after, .contents > div > ol > li a[href$=".xls"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".xls"]:after, .contents .column > * > ol > li a[href$=".xls"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".xls"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".xls"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".xls"]:after, .contents .box > ol > li a[href$=".xls"]:after, .contents .form > dl > dd > ol > li a[href$=".xls"]:after, .headdingmenu > div > a > div > ol > li a[href$=".xls"]:after, .faqlist dl dd > ol > li a[href$=".xls"]:after, .textblock > ol > li a[href$=".xls"]:after, .block17 .list dd:not(.image) > a[href$=".xls"]:after, .contents > div:not(.image) > a[href$=".xls"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".xls"]:after, .contents .column > *:not(.image) > a[href$=".xls"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".xls"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".xls"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".xls"]:after, .contents .box:not(.image) > a[href$=".xls"]:after, .contents .form > dl > dd:not(.image) > a[href$=".xls"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".xls"]:after, .faqlist dl dd:not(.image) > a[href$=".xls"]:after, .textblock:not(.image) > a[href$=".xls"]:after, .block17 .list dd > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .text p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents > div > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .column > * > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .box > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .contents .form > dl > dd > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .headdingmenu > div > a > div > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .faqlist dl dd > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .textblock > p:not(.image):not(.caption) a[href$=".xlsx"]:after, .block17 .list dd > ul > li a[href$=".xlsx"]:after, .contents .text ul > li a[href$=".xlsx"]:after, .contents > div > ul > li a[href$=".xlsx"]:after, .contents .imagebox > *:not(.image) > ul > li a[href$=".xlsx"]:after, .contents .column > * > ul > li a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > th > ul > li a[href$=".xlsx"]:after, .contents .table > table > tr > td:not(.d) > ul > li a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > td > ul > li a[href$=".xlsx"]:after, .contents .box > ul > li a[href$=".xlsx"]:after, .contents .form > dl > dd > ul > li a[href$=".xlsx"]:after, .headdingmenu > div > a > div > ul > li a[href$=".xlsx"]:after, .faqlist dl dd > ul > li a[href$=".xlsx"]:after, .textblock > ul > li a[href$=".xlsx"]:after, .block17 .list dd > ol > li a[href$=".xlsx"]:after, .contents .text ol > li a[href$=".xlsx"]:after, .contents > div > ol > li a[href$=".xlsx"]:after, .contents .imagebox > *:not(.image) > ol > li a[href$=".xlsx"]:after, .contents .column > * > ol > li a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > th > ol > li a[href$=".xlsx"]:after, .contents .table > table > tr > td:not(.d) > ol > li a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > td > ol > li a[href$=".xlsx"]:after, .contents .box > ol > li a[href$=".xlsx"]:after, .contents .form > dl > dd > ol > li a[href$=".xlsx"]:after, .headdingmenu > div > a > div > ol > li a[href$=".xlsx"]:after, .faqlist dl dd > ol > li a[href$=".xlsx"]:after, .textblock > ol > li a[href$=".xlsx"]:after, .block17 .list dd:not(.image) > a[href$=".xlsx"]:after, .contents > div:not(.image) > a[href$=".xlsx"]:after, .contents .imagebox > *:not(.image):not(.image) > a[href$=".xlsx"]:after, .contents .column > *:not(.image) > a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > th:not(.image) > a[href$=".xlsx"]:after, .contents .table > table > tr > td:not(.d):not(.image) > a[href$=".xlsx"]:after, .contents .table > table > tbody > tr > td:not(.image) > a[href$=".xlsx"]:after, .contents .box:not(.image) > a[href$=".xlsx"]:after, .contents .form > dl > dd:not(.image) > a[href$=".xlsx"]:after, .headdingmenu > div > a > div:not(.image) > a[href$=".xlsx"]:after, .faqlist dl dd:not(.image) > a[href$=".xlsx"]:after, .textblock:not(.image) > a[href$=".xlsx"]:after {
	content: "";
	height: 18px;
	background-image: url(../images/xls.svg);
	background-size: auto 100%;
}

.contents .button {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-start;
	justify-content: flex-start;
}
.contents .right.button {
	align-items: flex-end;
	justify-content: flex-end;
}
.contents .center.button {
	align-items: center;
	justify-content: center;
}
.contents .wrap.button {
	flex-direction: row;
	flex-wrap: wrap;
}
.contents .button > div {
	position: relative;
	padding: 1px;
	overflow: hidden;
	border-radius: 20px / 50%;
	z-index: 0;
}
.contents .button > div:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	top: 0;
	left: 0;
	border: 1px solid #0077B6;
	border-radius: 20px / 50%;
	z-index: -2;
}
.library.collection .contents .button > div:before, .contents .library.collection .button > div:before {
	border-color: #E4DC8A;
}
.contents .button > div:after {
	content: "";
	display: block;
	position: absolute;
	width: 51%;
	height: 0px;
	bottom: 50%;
	left: 50%;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: left center;
	transform: translateY(50%) rotate(-90deg);
	transition: 200ms;
	z-index: -1;
	opacity: 0;
}
.contents .button > div:hover:after {
	animation: buttonwheel cubic-bezier(1, 0.45, 0.01, 0.55) 1000ms;
}
.contents .button a {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 5px 40px 5px 15px !important;
	min-width: 160px;
	min-height: 38px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	background: #fff;
	border-radius: 20px / 50%;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.contents .button a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .button a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.library.collection .contents .button a, .contents .library.collection .button a {
	justify-content: center;
	padding-right: 15px !important;
	min-width: min(330px, 25.78125vw);
	background: #E4DC8A;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.library.collection .contents .button a:hover, .contents .library.collection .button a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.library.collection .contents .button a, .contents .library.collection .button a {
		min-width: 140px;
	}
}
@media screen and (max-width: 767px) {
	.contents .button a {
		min-width: 140px;
		min-height: 33px;
	}
}
.contents .button a[target="_blank"]:before {
	background-image: url(../images/blank.svg);
}
.contents .button a[href$=".pdf"]:before {
	background-image: url(../images/pdf.svg);
}
.contents .button a[href$=".doc"]:before, .contents .button a[href$=".docx"]:before {
	background-image: url(../images/doc.svg);
}
.contents .button a[href$=".ppt"]:before, .contents .button a[href$=".pptx"]:before {
	background-image: url(../images/ppt.svg);
}
.contents .button a[href$=".xls"]:before, .contents .button a[href$=".xlsx"]:before {
	background-image: url(../images/xls.svg);
}
.contents .button a:before {
	content: "";
	display: block;
	position: absolute;
	width: 35px;
	height: 100%;
	left: auto;
	right: 5px;
	top: 0px;
	bottom: auto;
	background: url(../images/arrow.svg) no-repeat center center;
}
.library.collection .contents .button a:before, .contents .library.collection .button a:before {
	display: none;
}

.block17 .list dd > p:not(.image):not(.caption), .contents .text p:not(.image):not(.caption), .contents > div > p:not(.image):not(.caption), .contents .imagebox > *:not(.image) > p:not(.image):not(.caption), .contents .column > * > p:not(.image):not(.caption), .contents .table > table > tbody > tr > th > p:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption), .contents .table > table > tbody > tr > td > p:not(.image):not(.caption), .contents .box > p:not(.image):not(.caption), .contents .form > dl > dd > p:not(.image):not(.caption), .contents .form > form > dl > dd > p:not(.image):not(.caption), .headdingmenu > div > a > div > p:not(.image):not(.caption), .faqlist dl dd > p:not(.image):not(.caption), .textblock > p:not(.image):not(.caption) {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.7;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block17 .list dd > p:not(.image):not(.caption), .contents .text p:not(.image):not(.caption), .contents > div > p:not(.image):not(.caption), .contents .imagebox > *:not(.image) > p:not(.image):not(.caption), .contents .column > * > p:not(.image):not(.caption), .contents .table > table > tbody > tr > th > p:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption), .contents .table > table > tbody > tr > td > p:not(.image):not(.caption), .contents .box > p:not(.image):not(.caption), .contents .form > dl > dd > p:not(.image):not(.caption), .contents .form > form > dl > dd > p:not(.image):not(.caption), .headdingmenu > div > a > div > p:not(.image):not(.caption), .faqlist dl dd > p:not(.image):not(.caption), .textblock > p:not(.image):not(.caption) {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dd > p:not(.image):not(.caption), .contents .text p:not(.image):not(.caption), .contents > div > p:not(.image):not(.caption), .contents .imagebox > *:not(.image) > p:not(.image):not(.caption), .contents .column > * > p:not(.image):not(.caption), .contents .table > table > tbody > tr > th > p:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption), .contents .table > table > tbody > tr > td > p:not(.image):not(.caption), .contents .box > p:not(.image):not(.caption), .contents .form > dl > dd > p:not(.image):not(.caption), .contents .form > form > dl > dd > p:not(.image):not(.caption), .headdingmenu > div > a > div > p:not(.image):not(.caption), .faqlist dl dd > p:not(.image):not(.caption), .textblock > p:not(.image):not(.caption) {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.block17 .list dd > p:not(.image):not(.caption) a, .contents .text p:not(.image):not(.caption) a, .contents > div > p:not(.image):not(.caption) a, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a, .contents .column > * > p:not(.image):not(.caption) a, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a, .contents .box > p:not(.image):not(.caption) a, .contents .form > dl > dd > p:not(.image):not(.caption) a, .headdingmenu > div > a > div > p:not(.image):not(.caption) a, .faqlist dl dd > p:not(.image):not(.caption) a, .textblock > p:not(.image):not(.caption) a {
	color: #0077B6;
	position: relative;
	display: inline-block;
}
.block17 .list dd > p:not(.image):not(.caption) a:before, .contents .text p:not(.image):not(.caption) a:before, .contents > div > p:not(.image):not(.caption) a:before, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a:before, .contents .column > * > p:not(.image):not(.caption) a:before, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a:before, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a:before, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a:before, .contents .box > p:not(.image):not(.caption) a:before, .contents .form > dl > dd > p:not(.image):not(.caption) a:before, .headdingmenu > div > a > div > p:not(.image):not(.caption) a:before, .faqlist dl dd > p:not(.image):not(.caption) a:before, .textblock > p:not(.image):not(.caption) a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.35em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #000000;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.block17 .list dd > p:not(.image):not(.caption) a:hover:before, .contents .text p:not(.image):not(.caption) a:hover:before, .contents > div > p:not(.image):not(.caption) a:hover:before, .contents .imagebox > *:not(.image) > p:not(.image):not(.caption) a:hover:before, .contents .column > * > p:not(.image):not(.caption) a:hover:before, .contents .table > table > tbody > tr > th > p:not(.image):not(.caption) a:hover:before, .contents .table > table > tr > td:not(.d) > p:not(.image):not(.caption) a:hover:before, .contents .table > table > tbody > tr > td > p:not(.image):not(.caption) a:hover:before, .contents .box > p:not(.image):not(.caption) a:hover:before, .contents .form > dl > dd > p:not(.image):not(.caption) a:hover:before, .headdingmenu > div > a > div > p:not(.image):not(.caption) a:hover:before, .faqlist dl dd > p:not(.image):not(.caption) a:hover:before, .textblock > p:not(.image):not(.caption) a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.35em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.block17 .list dd > p.error_mes:not(.image):not(.caption), .contents .text p.error_mes:not(.image):not(.caption), .contents > div > p.error_mes:not(.image):not(.caption), .contents .imagebox > *:not(.image) > p.error_mes:not(.image):not(.caption), .contents .column > * > p.error_mes:not(.image):not(.caption), .contents .table > table > tbody > tr > th > p.error_mes:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > p.error_mes:not(.image):not(.caption), .contents .table > table > tbody > tr > td > p.error_mes:not(.image):not(.caption), .contents .box > p.error_mes:not(.image):not(.caption), .contents .form > dl > dd > p.error_mes:not(.image):not(.caption), .headdingmenu > div > a > div > p.error_mes:not(.image):not(.caption), .faqlist dl dd > p.error_mes:not(.image):not(.caption), .textblock > p.error_mes:not(.image):not(.caption) {
	color: #ff0000;
}
.block17 .list dd > p.center:not(.image):not(.caption), .contents .text p.center:not(.image):not(.caption), .contents > div > p.center:not(.image):not(.caption), .contents .imagebox > *:not(.image) > p.center:not(.image):not(.caption), .contents .column > * > p.center:not(.image):not(.caption), .contents .table > table > tbody > tr > th > p.center:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > p.center:not(.image):not(.caption), .contents .table > table > tbody > tr > td > p.center:not(.image):not(.caption), .contents .box > p.center:not(.image):not(.caption), .contents .form > dl > dd > p.center:not(.image):not(.caption), .headdingmenu > div > a > div > p.center:not(.image):not(.caption), .faqlist dl dd > p.center:not(.image):not(.caption), .textblock > p.center:not(.image):not(.caption) {
	text-align: center;
}
.block17 .list dd > p.right:not(.image):not(.caption), .contents .text p.right:not(.image):not(.caption), .contents > div > p.right:not(.image):not(.caption), .contents .imagebox > *:not(.image) > p.right:not(.image):not(.caption), .contents .column > * > p.right:not(.image):not(.caption), .contents .table > table > tbody > tr > th > p.right:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > p.right:not(.image):not(.caption), .contents .table > table > tbody > tr > td > p.right:not(.image):not(.caption), .contents .box > p.right:not(.image):not(.caption), .contents .form > dl > dd > p.right:not(.image):not(.caption), .headdingmenu > div > a > div > p.right:not(.image):not(.caption), .faqlist dl dd > p.right:not(.image):not(.caption), .textblock > p.right:not(.image):not(.caption) {
	text-align: right;
}

.block17 .list dd > ul.col2, .block17 .list dd > ul > li > ul.col2, .block17 .list dd > ol > li > ul.col2, .contents .text ul.col2, .contents > div > ul.col2, .contents > div > ul > li > ul.col2, .contents > div > ol > li > ul.col2, .contents .imagebox > *:not(.image) > ul.col2, .contents .imagebox > *:not(.image) > ul > li > ul.col2, .contents .imagebox > *:not(.image) > ol > li > ul.col2, .contents .column > * > ul.col2, .contents .column > * > ul > li > ul.col2, .contents .column > * > ol > li > ul.col2, .contents .table > table > tbody > tr > th > ul.col2, .contents .table > table > tbody > tr > th > ul > li > ul.col2, .contents .table > table > tbody > tr > th > ol > li > ul.col2, .contents .table > table > tr > td:not(.d) > ul.col2, .contents .table > table > tr > td:not(.d) > ul > li > ul.col2, .contents .table > table > tr > td:not(.d) > ol > li > ul.col2, .contents .table > table > tbody > tr > td > ul.col2, .contents .table > table > tbody > tr > td > ul > li > ul.col2, .contents .table > table > tbody > tr > td > ol > li > ul.col2, .contents .box > ul.col2, .contents .box > ul > li > ul.col2, .contents .box > ol > li > ul.col2, .contents .form > dl > dd > ul.col2, .contents .form > dl > dd > ul > li > ul.col2, .contents .form > dl > dd > ol > li > ul.col2, .headdingmenu > div > a > div > ul.col2, .headdingmenu > div > a > div > ul > li > ul.col2, .headdingmenu > div > a > div > ol > li > ul.col2, .faqlist dl dd > ul.col2, .faqlist dl dd > ul > li > ul.col2, .faqlist dl dd > ol > li > ul.col2, .textblock > ul.col2, .textblock > ul > li > ul.col2, .textblock > ol > li > ul.col2 {
	columns: 2;
	gap: min(40px, 3.125vw);
}
.block17 .list dd > ul.note > li:before, .block17 .list dd > ul > li > ul.note > li:before, .block17 .list dd > ol > li > ul.note > li:before, .contents .text ul.note > li:before, .contents > div > ul.note > li:before, .contents > div > ul > li > ul.note > li:before, .contents > div > ol > li > ul.note > li:before, .contents .imagebox > *:not(.image) > ul.note > li:before, .contents .imagebox > *:not(.image) > ul > li > ul.note > li:before, .contents .imagebox > *:not(.image) > ol > li > ul.note > li:before, .contents .column > * > ul.note > li:before, .contents .column > * > ul > li > ul.note > li:before, .contents .column > * > ol > li > ul.note > li:before, .contents .table > table > tbody > tr > th > ul.note > li:before, .contents .table > table > tbody > tr > th > ul > li > ul.note > li:before, .contents .table > table > tbody > tr > th > ol > li > ul.note > li:before, .contents .table > table > tr > td:not(.d) > ul.note > li:before, .contents .table > table > tr > td:not(.d) > ul > li > ul.note > li:before, .contents .table > table > tr > td:not(.d) > ol > li > ul.note > li:before, .contents .table > table > tbody > tr > td > ul.note > li:before, .contents .table > table > tbody > tr > td > ul > li > ul.note > li:before, .contents .table > table > tbody > tr > td > ol > li > ul.note > li:before, .contents .box > ul.note > li:before, .contents .box > ul > li > ul.note > li:before, .contents .box > ol > li > ul.note > li:before, .contents .form > dl > dd > ul.note > li:before, .contents .form > dl > dd > ul > li > ul.note > li:before, .contents .form > dl > dd > ol > li > ul.note > li:before, .headdingmenu > div > a > div > ul.note > li:before, .headdingmenu > div > a > div > ul > li > ul.note > li:before, .headdingmenu > div > a > div > ol > li > ul.note > li:before, .faqlist dl dd > ul.note > li:before, .faqlist dl dd > ul > li > ul.note > li:before, .faqlist dl dd > ol > li > ul.note > li:before, .textblock > ul.note > li:before, .textblock > ul > li > ul.note > li:before, .textblock > ol > li > ul.note > li:before {
	content: "※";
	width: 1em;
	height: 1em;
	top: 0;
	left: -0.5em;
	margin-top: 0;
	background: transparent;
}
.block17 .list dd > ul > li, .block17 .list dd > ul > li > ul > li, .block17 .list dd > ol > li > ul > li, .contents .text ul > li, .contents > div > ul > li, .contents > div > ul > li > ul > li, .contents > div > ol > li > ul > li, .contents .imagebox > *:not(.image) > ul > li, .contents .imagebox > *:not(.image) > ul > li > ul > li, .contents .imagebox > *:not(.image) > ol > li > ul > li, .contents .column > * > ul > li, .contents .column > * > ul > li > ul > li, .contents .column > * > ol > li > ul > li, .contents .table > table > tbody > tr > th > ul > li, .contents .table > table > tbody > tr > th > ul > li > ul > li, .contents .table > table > tbody > tr > th > ol > li > ul > li, .contents .table > table > tr > td:not(.d) > ul > li, .contents .table > table > tr > td:not(.d) > ul > li > ul > li, .contents .table > table > tr > td:not(.d) > ol > li > ul > li, .contents .table > table > tbody > tr > td > ul > li, .contents .table > table > tbody > tr > td > ul > li > ul > li, .contents .table > table > tbody > tr > td > ol > li > ul > li, .contents .box > ul > li, .contents .box > ul > li > ul > li, .contents .box > ol > li > ul > li, .contents .form > dl > dd > ul > li, .contents .form > dl > dd > ul > li > ul > li, .contents .form > dl > dd > ol > li > ul > li, .headdingmenu > div > a > div > ul > li, .headdingmenu > div > a > div > ul > li > ul > li, .headdingmenu > div > a > div > ol > li > ul > li, .faqlist dl dd > ul > li, .faqlist dl dd > ul > li > ul > li, .faqlist dl dd > ol > li > ul > li, .textblock > ul > li, .textblock > ul > li > ul > li, .textblock > ol > li > ul > li {
	position: relative;
	padding-left: 1em;
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block17 .list dd > ul > li, .block17 .list dd > ul > li > ul > li, .block17 .list dd > ol > li > ul > li, .contents .text ul > li, .contents > div > ul > li, .contents > div > ul > li > ul > li, .contents > div > ol > li > ul > li, .contents .imagebox > *:not(.image) > ul > li, .contents .imagebox > *:not(.image) > ul > li > ul > li, .contents .imagebox > *:not(.image) > ol > li > ul > li, .contents .column > * > ul > li, .contents .column > * > ul > li > ul > li, .contents .column > * > ol > li > ul > li, .contents .table > table > tbody > tr > th > ul > li, .contents .table > table > tbody > tr > th > ul > li > ul > li, .contents .table > table > tbody > tr > th > ol > li > ul > li, .contents .table > table > tr > td:not(.d) > ul > li, .contents .table > table > tr > td:not(.d) > ul > li > ul > li, .contents .table > table > tr > td:not(.d) > ol > li > ul > li, .contents .table > table > tbody > tr > td > ul > li, .contents .table > table > tbody > tr > td > ul > li > ul > li, .contents .table > table > tbody > tr > td > ol > li > ul > li, .contents .box > ul > li, .contents .box > ul > li > ul > li, .contents .box > ol > li > ul > li, .contents .form > dl > dd > ul > li, .contents .form > dl > dd > ul > li > ul > li, .contents .form > dl > dd > ol > li > ul > li, .headdingmenu > div > a > div > ul > li, .headdingmenu > div > a > div > ul > li > ul > li, .headdingmenu > div > a > div > ol > li > ul > li, .faqlist dl dd > ul > li, .faqlist dl dd > ul > li > ul > li, .faqlist dl dd > ol > li > ul > li, .textblock > ul > li, .textblock > ul > li > ul > li, .textblock > ol > li > ul > li {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dd > ul > li, .block17 .list dd > ul > li > ul > li, .block17 .list dd > ol > li > ul > li, .contents .text ul > li, .contents > div > ul > li, .contents > div > ul > li > ul > li, .contents > div > ol > li > ul > li, .contents .imagebox > *:not(.image) > ul > li, .contents .imagebox > *:not(.image) > ul > li > ul > li, .contents .imagebox > *:not(.image) > ol > li > ul > li, .contents .column > * > ul > li, .contents .column > * > ul > li > ul > li, .contents .column > * > ol > li > ul > li, .contents .table > table > tbody > tr > th > ul > li, .contents .table > table > tbody > tr > th > ul > li > ul > li, .contents .table > table > tbody > tr > th > ol > li > ul > li, .contents .table > table > tr > td:not(.d) > ul > li, .contents .table > table > tr > td:not(.d) > ul > li > ul > li, .contents .table > table > tr > td:not(.d) > ol > li > ul > li, .contents .table > table > tbody > tr > td > ul > li, .contents .table > table > tbody > tr > td > ul > li > ul > li, .contents .table > table > tbody > tr > td > ol > li > ul > li, .contents .box > ul > li, .contents .box > ul > li > ul > li, .contents .box > ol > li > ul > li, .contents .form > dl > dd > ul > li, .contents .form > dl > dd > ul > li > ul > li, .contents .form > dl > dd > ol > li > ul > li, .headdingmenu > div > a > div > ul > li, .headdingmenu > div > a > div > ul > li > ul > li, .headdingmenu > div > a > div > ol > li > ul > li, .faqlist dl dd > ul > li, .faqlist dl dd > ul > li > ul > li, .faqlist dl dd > ol > li > ul > li, .textblock > ul > li, .textblock > ul > li > ul > li, .textblock > ol > li > ul > li {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.block17 .list dd > ul > li:before, .block17 .list dd > ul > li > ul > li:before, .block17 .list dd > ol > li > ul > li:before, .contents .text ul > li:before, .contents > div > ul > li:before, .contents > div > ul > li > ul > li:before, .contents > div > ol > li > ul > li:before, .contents .imagebox > *:not(.image) > ul > li:before, .contents .imagebox > *:not(.image) > ul > li > ul > li:before, .contents .imagebox > *:not(.image) > ol > li > ul > li:before, .contents .column > * > ul > li:before, .contents .column > * > ul > li > ul > li:before, .contents .column > * > ol > li > ul > li:before, .contents .table > table > tbody > tr > th > ul > li:before, .contents .table > table > tbody > tr > th > ul > li > ul > li:before, .contents .table > table > tbody > tr > th > ol > li > ul > li:before, .contents .table > table > tr > td:not(.d) > ul > li:before, .contents .table > table > tr > td:not(.d) > ul > li > ul > li:before, .contents .table > table > tr > td:not(.d) > ol > li > ul > li:before, .contents .table > table > tbody > tr > td > ul > li:before, .contents .table > table > tbody > tr > td > ul > li > ul > li:before, .contents .table > table > tbody > tr > td > ol > li > ul > li:before, .contents .box > ul > li:before, .contents .box > ul > li > ul > li:before, .contents .box > ol > li > ul > li:before, .contents .form > dl > dd > ul > li:before, .contents .form > dl > dd > ul > li > ul > li:before, .contents .form > dl > dd > ol > li > ul > li:before, .headdingmenu > div > a > div > ul > li:before, .headdingmenu > div > a > div > ul > li > ul > li:before, .headdingmenu > div > a > div > ol > li > ul > li:before, .faqlist dl dd > ul > li:before, .faqlist dl dd > ul > li > ul > li:before, .faqlist dl dd > ol > li > ul > li:before, .textblock > ul > li:before, .textblock > ul > li > ul > li:before, .textblock > ol > li > ul > li:before {
	position: absolute;
	content: "";
	display: inline-block;
	width: 4px;
	height: 4px;
	vertical-align: middle;
	top: 0.73em;
	left: 0px;
	margin-top: -2px;
	background: #1A1311;
	border-radius: 50%;
}
.block17 .list dd > ul > li + li, .block17 .list dd > ul > li > ul > li + li, .contents .text ul > li + li, .contents > div > ul > li + li, .contents > div > ul > li > ul > li + li, .contents .imagebox > *:not(.image) > ul > li + li, .contents .imagebox > *:not(.image) > ul > li > ul > li + li, .contents .column > * > ul > li + li, .contents .column > * > ul > li > ul > li + li, .contents .table > table > tbody > tr > th > ul > li + li, .contents .table > table > tbody > tr > th > ul > li > ul > li + li, .contents .table > table > tr > td:not(.d) > ul > li + li, .contents .table > table > tr > td:not(.d) > ul > li > ul > li + li, .contents .table > table > tbody > tr > td > ul > li + li, .contents .table > table > tbody > tr > td > ul > li > ul > li + li, .contents .box > ul > li + li, .contents .box > ul > li > ul > li + li, .contents .form > dl > dd > ul > li + li, .contents .form > dl > dd > ul > li > ul > li + li, .contents .form > form > dl > dd > ol > li > ul > li + li, .headdingmenu > div > a > div > ul > li + li, .headdingmenu > div > a > div > ul > li > ul > li + li, .faqlist dl dd > ul > li + li, .faqlist dl dd > ul > li > ul > li + li, .textblock > ul > li + li, .textblock > ul > li > ul > li + li {
	margin-top: 8px;
}
.block17 .list dd > ul > li a, .contents .text ul > li a, .contents > div > ul > li a, .contents .imagebox > *:not(.image) > ul > li a, .contents .column > * > ul > li a, .contents .table > table > tbody > tr > th > ul > li a, .contents .table > table > tr > td:not(.d) > ul > li a, .contents .table > table > tbody > tr > td > ul > li a, .contents .box > ul > li a, .contents .form > dl > dd > ul > li a, .contents .form > form > dl > dd > ul > li > ul > li a, .contents .form > form > dl > dd > ol > li > ul > li a, .headdingmenu > div > a > div > ul > li a, .faqlist dl dd > ul > li a, .textblock > ul > li a {
	vertical-align: top;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
.block17 .list dd > ul > li a:before, .contents .text ul > li a:before, .contents > div > ul > li a:before, .contents .imagebox > *:not(.image) > ul > li a:before, .contents .column > * > ul > li a:before, .contents .table > table > tbody > tr > th > ul > li a:before, .contents .table > table > tr > td:not(.d) > ul > li a:before, .contents .table > table > tbody > tr > td > ul > li a:before, .contents .box > ul > li a:before, .contents .form > dl > dd > ul > li a:before, .headdingmenu > div > a > div > ul > li a:before, .faqlist dl dd > ul > li a:before, .textblock > ul > li a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.block17 .list dd > ul > li a:hover:before, .contents .text ul > li a:hover:before, .contents > div > ul > li a:hover:before, .contents .imagebox > *:not(.image) > ul > li a:hover:before, .contents .column > * > ul > li a:hover:before, .contents .table > table > tbody > tr > th > ul > li a:hover:before, .contents .table > table > tr > td:not(.d) > ul > li a:hover:before, .contents .table > table > tbody > tr > td > ul > li a:hover:before, .contents .box > ul > li a:hover:before, .contents .form > dl > dd > ul > li a:hover:before, .headdingmenu > div > a > div > ul > li a:hover:before, .faqlist dl dd > ul > li a:hover:before, .textblock > ul > li a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.block17 .list dd > ul > li ul, .contents .text ul > li ul, .contents > div > ul > li ul, .contents .imagebox > *:not(.image) > ul > li ul, .contents .column > * > ul > li ul, .contents .table > table > tbody > tr > th > ul > li ul, .contents .table > table > tr > td:not(.d) > ul > li ul, .contents .table > table > tbody > tr > td > ul > li ul, .contents .box > ul > li ul, .contents .form > dl > dd > ul > li ul, .contents .form > form > dl > dd > ul > li > ul > li ul, .contents .form > form > dl > dd > ol > li > ul > li ul, .headdingmenu > div > a > div > ul > li ul, .faqlist dl dd > ul > li ul, .textblock > ul > li ul, .block17 .list dd > ul > li ol, .contents .text ul > li ol, .contents > div > ul > li ol, .contents .imagebox > *:not(.image) > ul > li ol, .contents .column > * > ul > li ol, .contents .table > table > tbody > tr > th > ul > li ol, .contents .table > table > tr > td:not(.d) > ul > li ol, .contents .table > table > tbody > tr > td > ul > li ol, .contents .box > ul > li ol, .contents .form > dl > dd > ul > li ol, .contents .form > form > dl > dd > ul > li > ul > li ol, .contents .form > form > dl > dd > ol > li > ul > li ol, .headdingmenu > div > a > div > ul > li ol, .faqlist dl dd > ul > li ol, .textblock > ul > li ol {
	margin-top: 4px;
	margin-right: 0px;
}

.block17 .list dd > ul > li > ol, .block17 .list dd > ol, .block17 .list dd > ol > li > ol, .contents .text ol, .contents > div > ul > li > ol, .contents > div > ol, .contents > div > ol > li > ol, .contents .imagebox > *:not(.image) > ul > li > ol, .contents .imagebox > *:not(.image) > ol, .contents .imagebox > *:not(.image) > ol > li > ol, .contents .column > * > ul > li > ol, .contents .column > * > ol, .contents .column > * > ol > li > ol, .contents .table > table > tbody > tr > th > ul > li > ol, .contents .table > table > tbody > tr > th > ol, .contents .table > table > tbody > tr > th > ol > li > ol, .contents .table > table > tr > td:not(.d) > ul > li > ol, .contents .table > table > tr > td:not(.d) > ol, .contents .table > table > tr > td:not(.d) > ol > li > ol, .contents .table > table > tbody > tr > td > ul > li > ol, .contents .table > table > tbody > tr > td > ol, .contents .table > table > tbody > tr > td > ol > li > ol, .contents .box > ul > li > ol, .contents .box > ol, .contents .box > ol > li > ol, .contents .form > dl > dd > ul > li > ol, .contents .form > form > dl > dd > ul > li > ol, .contents .form > dl > dd > ol, .contents .form > form > dl > dd > ol, .contents .form > dl > dd > ol > li > ol, .contents .form > form > dl > dd > ol > li > ol, .headdingmenu > div > a > div > ul > li > ol, .headdingmenu > div > a > div > ol, .headdingmenu > div > a > div > ol > li > ol, .faqlist dl dd > ul > li > ol, .faqlist dl dd > ol, .faqlist dl dd > ol > li > ol, .textblock > ul > li > ol, .textblock > ol, .textblock > ol > li > ol {
	counter-reset: number;
}
.block17 .list dd > ul > li > ol.note > li:before, .block17 .list dd > ol.note > li:before, .block17 .list dd > ol > li > ol.note > li:before, .contents .text ol.note > li:before, .contents > div > ul > li > ol.note > li:before, .contents > div > ol.note > li:before, .contents > div > ol > li > ol.note > li:before, .contents .imagebox > *:not(.image) > ul > li > ol.note > li:before, .contents .imagebox > *:not(.image) > ol.note > li:before, .contents .imagebox > *:not(.image) > ol > li > ol.note > li:before, .contents .column > * > ul > li > ol.note > li:before, .contents .column > * > ol.note > li:before, .contents .column > * > ol > li > ol.note > li:before, .contents .table > table > tbody > tr > th > ul > li > ol.note > li:before, .contents .table > table > tbody > tr > th > ol.note > li:before, .contents .table > table > tbody > tr > th > ol > li > ol.note > li:before, .contents .table > table > tr > td:not(.d) > ul > li > ol.note > li:before, .contents .table > table > tr > td:not(.d) > ol.note > li:before, .contents .table > table > tr > td:not(.d) > ol > li > ol.note > li:before, .contents .table > table > tbody > tr > td > ul > li > ol.note > li:before, .contents .table > table > tbody > tr > td > ol.note > li:before, .contents .table > table > tbody > tr > td > ol > li > ol.note > li:before, .contents .box > ul > li > ol.note > li:before, .contents .box > ol.note > li:before, .contents .box > ol > li > ol.note > li:before, .contents .form > dl > dd > ul > li > ol.note > li:before, .contents .form > dl > dd > ol.note > li:before, .contents .form > dl > dd > ol > li > ol.note > li:before, .headdingmenu > div > a > div > ul > li > ol.note > li:before, .headdingmenu > div > a > div > ol.note > li:before, .headdingmenu > div > a > div > ol > li > ol.note > li:before, .faqlist dl dd > ul > li > ol.note > li:before, .faqlist dl dd > ol.note > li:before, .faqlist dl dd > ol > li > ol.note > li:before, .textblock > ul > li > ol.note > li:before, .textblock > ol.note > li:before, .textblock > ol > li > ol.note > li:before {
	content: "※" counter(number);
}
.block17 .list dd > ul > li > ol > li, .block17 .list dd > ol > li, .block17 .list dd > ol > li > ol > li, .contents .text ol > li, .contents > div > ul > li > ol > li, .contents > div > ol > li, .contents > div > ol > li > ol > li, .contents .imagebox > *:not(.image) > ul > li > ol > li, .contents .imagebox > *:not(.image) > ol > li, .contents .imagebox > *:not(.image) > ol > li > ol > li, .contents .column > * > ul > li > ol > li, .contents .column > * > ol > li, .contents .column > * > ol > li > ol > li, .contents .table > table > tbody > tr > th > ul > li > ol > li, .contents .table > table > tbody > tr > th > ol > li, .contents .table > table > tbody > tr > th > ol > li > ol > li, .contents .table > table > tr > td:not(.d) > ul > li > ol > li, .contents .table > table > tr > td:not(.d) > ol > li, .contents .table > table > tr > td:not(.d) > ol > li > ol > li, .contents .table > table > tbody > tr > td > ul > li > ol > li, .contents .table > table > tbody > tr > td > ol > li, .contents .table > table > tbody > tr > td > ol > li > ol > li, .contents .box > ul > li > ol > li, .contents .box > ol > li, .contents .box > ol > li > ol > li, .contents .form > dl > dd > ul > li > ol > li, .contents .form > dl > dd > ol > li, .contents .form > dl > dd > ol > li > ol > li, .headdingmenu > div > a > div > ul > li > ol > li, .headdingmenu > div > a > div > ol > li, .headdingmenu > div > a > div > ol > li > ol > li, .faqlist dl dd > ul > li > ol > li, .faqlist dl dd > ol > li, .faqlist dl dd > ol > li > ol > li, .textblock > ul > li > ol > li, .textblock > ol > li, .textblock > ol > li > ol > li {
	position: relative;
	padding-left: 1em;
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block17 .list dd > ul > li > ol > li, .block17 .list dd > ol > li, .block17 .list dd > ol > li > ol > li, .contents .text ol > li, .contents > div > ul > li > ol > li, .contents > div > ol > li, .contents > div > ol > li > ol > li, .contents .imagebox > *:not(.image) > ul > li > ol > li, .contents .imagebox > *:not(.image) > ol > li, .contents .imagebox > *:not(.image) > ol > li > ol > li, .contents .column > * > ul > li > ol > li, .contents .column > * > ol > li, .contents .column > * > ol > li > ol > li, .contents .table > table > tbody > tr > th > ul > li > ol > li, .contents .table > table > tbody > tr > th > ol > li, .contents .table > table > tbody > tr > th > ol > li > ol > li, .contents .table > table > tr > td:not(.d) > ul > li > ol > li, .contents .table > table > tr > td:not(.d) > ol > li, .contents .table > table > tr > td:not(.d) > ol > li > ol > li, .contents .table > table > tbody > tr > td > ul > li > ol > li, .contents .table > table > tbody > tr > td > ol > li, .contents .table > table > tbody > tr > td > ol > li > ol > li, .contents .box > ul > li > ol > li, .contents .box > ol > li, .contents .box > ol > li > ol > li, .contents .form > dl > dd > ul > li > ol > li, .contents .form > dl > dd > ol > li, .contents .form > dl > dd > ol > li > ol > li, .headdingmenu > div > a > div > ul > li > ol > li, .headdingmenu > div > a > div > ol > li, .headdingmenu > div > a > div > ol > li > ol > li, .faqlist dl dd > ul > li > ol > li, .faqlist dl dd > ol > li, .faqlist dl dd > ol > li > ol > li, .textblock > ul > li > ol > li, .textblock > ol > li, .textblock > ol > li > ol > li {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dd > ul > li > ol > li, .block17 .list dd > ol > li, .block17 .list dd > ol > li > ol > li, .contents .text ol > li, .contents > div > ul > li > ol > li, .contents > div > ol > li, .contents > div > ol > li > ol > li, .contents .imagebox > *:not(.image) > ul > li > ol > li, .contents .imagebox > *:not(.image) > ol > li, .contents .imagebox > *:not(.image) > ol > li > ol > li, .contents .column > * > ul > li > ol > li, .contents .column > * > ol > li, .contents .column > * > ol > li > ol > li, .contents .table > table > tbody > tr > th > ul > li > ol > li, .contents .table > table > tbody > tr > th > ol > li, .contents .table > table > tbody > tr > th > ol > li > ol > li, .contents .table > table > tr > td:not(.d) > ul > li > ol > li, .contents .table > table > tr > td:not(.d) > ol > li, .contents .table > table > tr > td:not(.d) > ol > li > ol > li, .contents .table > table > tbody > tr > td > ul > li > ol > li, .contents .table > table > tbody > tr > td > ol > li, .contents .table > table > tbody > tr > td > ol > li > ol > li, .contents .box > ul > li > ol > li, .contents .box > ol > li, .contents .box > ol > li > ol > li, .contents .form > dl > dd > ul > li > ol > li, .contents .form > dl > dd > ol > li, .contents .form > dl > dd > ol > li > ol > li, .headdingmenu > div > a > div > ul > li > ol > li, .headdingmenu > div > a > div > ol > li, .headdingmenu > div > a > div > ol > li > ol > li, .faqlist dl dd > ul > li > ol > li, .faqlist dl dd > ol > li, .faqlist dl dd > ol > li > ol > li, .textblock > ul > li > ol > li, .textblock > ol > li, .textblock > ol > li > ol > li {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.block17 .list dd > ul > li > ol > li:before, .block17 .list dd > ol > li:before, .block17 .list dd > ol > li > ol > li:before, .contents .text ol > li:before, .contents > div > ul > li > ol > li:before, .contents > div > ol > li:before, .contents > div > ol > li > ol > li:before, .contents .imagebox > *:not(.image) > ul > li > ol > li:before, .contents .imagebox > *:not(.image) > ol > li:before, .contents .imagebox > *:not(.image) > ol > li > ol > li:before, .contents .column > * > ul > li > ol > li:before, .contents .column > * > ol > li:before, .contents .column > * > ol > li > ol > li:before, .contents .table > table > tbody > tr > th > ul > li > ol > li:before, .contents .table > table > tbody > tr > th > ol > li:before, .contents .table > table > tbody > tr > th > ol > li > ol > li:before, .contents .table > table > tr > td:not(.d) > ul > li > ol > li:before, .contents .table > table > tr > td:not(.d) > ol > li:before, .contents .table > table > tr > td:not(.d) > ol > li > ol > li:before, .contents .table > table > tbody > tr > td > ul > li > ol > li:before, .contents .table > table > tbody > tr > td > ol > li:before, .contents .table > table > tbody > tr > td > ol > li > ol > li:before, .contents .box > ul > li > ol > li:before, .contents .box > ol > li:before, .contents .box > ol > li > ol > li:before, .contents .form > dl > dd > ul > li > ol > li:before, .contents .form > dl > dd > ol > li:before, .contents .form > dl > dd > ol > li > ol > li:before, .headdingmenu > div > a > div > ul > li > ol > li:before, .headdingmenu > div > a > div > ol > li:before, .headdingmenu > div > a > div > ol > li > ol > li:before, .faqlist dl dd > ul > li > ol > li:before, .faqlist dl dd > ol > li:before, .faqlist dl dd > ol > li > ol > li:before, .textblock > ul > li > ol > li:before, .textblock > ol > li:before, .textblock > ol > li > ol > li:before {
	position: absolute;
	display: inline-block;
	counter-increment: number;
	content: counter(number) ".";
	min-width: 1.5em;
	text-align: right;
	left: -1em;
}
.block17 .list dd > ol > li + li, .block17 .list dd > ol > li > ol > li + li, .contents .text ol > li + li, .contents > div > ol > li + li, .contents > div > ol > li > ol > li + li, .contents .imagebox > *:not(.image) > ol > li + li, .contents .imagebox > *:not(.image) > ol > li > ol > li + li, .contents .column > * > ol > li + li, .contents .column > * > ol > li > ol > li + li, .contents .table > table > tbody > tr > th > ol > li + li, .contents .table > table > tbody > tr > th > ol > li > ol > li + li, .contents .table > table > tr > td:not(.d) > ol > li + li, .contents .table > table > tr > td:not(.d) > ol > li > ol > li + li, .contents .table > table > tbody > tr > td > ol > li + li, .contents .table > table > tbody > tr > td > ol > li > ol > li + li, .contents .box > ol > li + li, .contents .box > ol > li > ol > li + li, .contents .form > dl > dd > ol > li + li, .contents .form > dl > dd > ol > li > ol > li + li, .headdingmenu > div > a > div > ol > li + li, .headdingmenu > div > a > div > ol > li > ol > li + li, .faqlist dl dd > ol > li + li, .faqlist dl dd > ol > li > ol > li + li, .textblock > ol > li + li, .textblock > ol > li > ol > li + li {
	margin-top: 8px;
}
.block17 .list dd > ol > li a, .contents .text ol > li a, .contents > div > ol > li a, .contents .imagebox > *:not(.image) > ol > li a, .contents .column > * > ol > li a, .contents .table > table > tbody > tr > th > ol > li a, .contents .table > table > tr > td:not(.d) > ol > li a, .contents .table > table > tbody > tr > td > ol > li a, .contents .box > ol > li a, .contents .form > dl > dd > ol > li a, .contents .form > form > dl > dd > ol > li > ol > li a, .headdingmenu > div > a > div > ol > li a, .faqlist dl dd > ol > li a, .textblock > ol > li a {
	vertical-align: top;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
.block17 .list dd > ol > li a:before, .contents .text ol > li a:before, .contents > div > ol > li a:before, .contents .imagebox > *:not(.image) > ol > li a:before, .contents .column > * > ol > li a:before, .contents .table > table > tbody > tr > th > ol > li a:before, .contents .table > table > tr > td:not(.d) > ol > li a:before, .contents .table > table > tbody > tr > td > ol > li a:before, .contents .box > ol > li a:before, .contents .form > dl > dd > ol > li a:before, .headdingmenu > div > a > div > ol > li a:before, .faqlist dl dd > ol > li a:before, .textblock > ol > li a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.block17 .list dd > ol > li a:hover:before, .contents .text ol > li a:hover:before, .contents > div > ol > li a:hover:before, .contents .imagebox > *:not(.image) > ol > li a:hover:before, .contents .column > * > ol > li a:hover:before, .contents .table > table > tbody > tr > th > ol > li a:hover:before, .contents .table > table > tr > td:not(.d) > ol > li a:hover:before, .contents .table > table > tbody > tr > td > ol > li a:hover:before, .contents .box > ol > li a:hover:before, .contents .form > dl > dd > ol > li a:hover:before, .headdingmenu > div > a > div > ol > li a:hover:before, .faqlist dl dd > ol > li a:hover:before, .textblock > ol > li a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.block17 .list dd > ol > li ul, .contents .text ol > li ul, .contents > div > ol > li ul, .contents .imagebox > *:not(.image) > ol > li ul, .contents .column > * > ol > li ul, .contents .table > table > tbody > tr > th > ol > li ul, .contents .table > table > tr > td:not(.d) > ol > li ul, .contents .table > table > tbody > tr > td > ol > li ul, .contents .box > ol > li ul, .contents .form > dl > dd > ol > li ul, .contents .form > form > dl > dd > ol > li > ol > li ul, .headdingmenu > div > a > div > ol > li ul, .faqlist dl dd > ol > li ul, .textblock > ol > li ul, .block17 .list dd > ol > li ol, .contents .text ol > li ol, .contents > div > ol > li ol, .contents .imagebox > *:not(.image) > ol > li ol, .contents .column > * > ol > li ol, .contents .table > table > tbody > tr > th > ol > li ol, .contents .table > table > tr > td:not(.d) > ol > li ol, .contents .table > table > tbody > tr > td > ol > li ol, .contents .box > ol > li ol, .contents .form > dl > dd > ol > li ol, .contents .form > form > dl > dd > ol > li > ol > li ol, .headdingmenu > div > a > div > ol > li ol, .faqlist dl dd > ol > li ol, .textblock > ol > li ol {
	margin-top: 4px;
	margin-right: 0px;
}

.loading * {
	transition: 0ms !important;
}
.loading *:before, .loading *:after {
	transition: 0ms !important;
}

.popup.popin {
	opacity: 0;
	transition: opacity 800ms 200ms !important;
}
.popup.popin.popon {
	opacity: 1;
}

.popup.popcont > * {
	opacity: 0;
	transition: opacity 800ms 200ms !important;
}
.popup.popcont.popon > * {
	opacity: 1;
}
.popup.popcont.popon > *:nth-child(0) {
	transition-delay: 200ms !important;
}
.popup.popcont.popon > *:nth-child(1) {
	transition-delay: 260ms !important;
}
.popup.popcont.popon > *:nth-child(2) {
	transition-delay: 320ms !important;
}
.popup.popcont.popon > *:nth-child(3) {
	transition-delay: 380ms !important;
}
.popup.popcont.popon > *:nth-child(4) {
	transition-delay: 440ms !important;
}
.popup.popcont.popon > *:nth-child(5) {
	transition-delay: 500ms !important;
}
.popup.popcont.popon > *:nth-child(6) {
	transition-delay: 560ms !important;
}
.popup.popcont.popon > *:nth-child(7) {
	transition-delay: 620ms !important;
}
.popup.popcont.popon > *:nth-child(8) {
	transition-delay: 680ms !important;
}
.popup.popcont.popon > *:nth-child(9) {
	transition-delay: 740ms !important;
}
.popup.popcont.popon > *:nth-child(10) {
	transition-delay: 800ms !important;
}
.popup.popcont.popon > *:nth-child(11) {
	transition-delay: 860ms !important;
}
.popup.popcont.popon > *:nth-child(12) {
	transition-delay: 920ms !important;
}

.contents *:not(h1, h2, h3, h4, h5, h6) + .column, .contents *:not(h1, h2, h3, h4, h5, h6) + .anchorlink, .contents *:not(h1, h2, h3, h4, h5, h6) + .morecontents, .contents *:not(h1, h2, h3, h4, h5, h6) + .banner, .contents *:not(h1, h2, h3, h4, h5, h6) + .collectionheading, .contents *:not(h1, h2, h3, h4, h5, h6) + .form, *:not(h1, h2, h3, h4, h5, h6) + .headdingmenu, *:not(h1, h2, h3, h4, h5, h6) + .contentsmenu, *:not(h1, h2, h3, h4, h5, h6) + .boxlink, *:not(h1, h2, h3, h4, h5, h6) + .teacherfilter, *:not(h1, h2, h3, h4, h5, h6) + .examfilter {
	margin-top: 120px;
}
@media screen and (max-width: 767px) {
	.contents *:not(h1, h2, h3, h4, h5, h6) + .column, .contents *:not(h1, h2, h3, h4, h5, h6) + .anchorlink, .contents *:not(h1, h2, h3, h4, h5, h6) + .morecontents, .contents *:not(h1, h2, h3, h4, h5, h6) + .banner, .contents *:not(h1, h2, h3, h4, h5, h6) + .collectionheading, .contents *:not(h1, h2, h3, h4, h5, h6) + .form, *:not(h1, h2, h3, h4, h5, h6) + .headdingmenu, *:not(h1, h2, h3, h4, h5, h6) + .contentsmenu, *:not(h1, h2, h3, h4, h5, h6) + .boxlink, *:not(h1, h2, h3, h4, h5, h6) + .teacherfilter, *:not(h1, h2, h3, h4, h5, h6) + .examfilter {
		margin-top: 90px;
	}
}

.block2 *:not(h1, h2, h3, h4, h5, h6) + h2, .contents *:not(h1, h2, h3, h4, h5, h6) + .lead, .contents *:not(h1, h2, h3, h4, h5, h6) + .text, .contents *:not(h1, h2, h3, h4, h5, h6) + figure,
.contents *:not(h1, h2, h3, h4, h5, h6) + .image, .contents *:not(h1, h2, h3, h4, h5, h6) + .imagebox, .contents *:not(h1, h2, h3, h4, h5, h6) + .table, .contents *:not(h1, h2, h3, h4, h5, h6) + .youtube, .contents *:not(h1, h2, h3, h4, h5, h6) + .button, .contents *:not(h1, h2, h3, h4, h5, h6) + .morebutton, .contents *:not(h1, h2, h3, h4, h5, h6) + .box, .contents *:not(h1, h2, h3, h4, h5, h6) + .teachermessage, .contents *:not(h1, h2, h3, h4, h5, h6) + .imagelink, .contents *:not(h1, h2, h3, h4, h5, h6) + .accordionmenu, .contents *:not(h1, h2, h3, h4, h5, h6) + .snslink, .contents *:not(h1, h2, h3, h4, h5, h6) + .pageselector, *:not(h1, h2, h3, h4, h5, h6) + .linklist, *:not(h1, h2, h3, h4, h5, h6) + .faqlist, *:not(h1, h2, h3, h4, h5, h6) + .admissionpoint, *:not(h1, h2, h3, h4, h5, h6) + .examlist, *:not(h1, h2, h3, h4, h5, h6) + .textblock,
*:not(h1, h2, h3, h4, h5, h6) + .oldhtml, *:not(h1, h2, h3, h4, h5, h6) + .pagenation {
	margin-top: 80px;
}
@media screen and (max-width: 767px) {
	.block2 *:not(h1, h2, h3, h4, h5, h6) + h2, .contents *:not(h1, h2, h3, h4, h5, h6) + .lead, .contents *:not(h1, h2, h3, h4, h5, h6) + .text, .contents *:not(h1, h2, h3, h4, h5, h6) + figure,
	.contents *:not(h1, h2, h3, h4, h5, h6) + .image, .contents *:not(h1, h2, h3, h4, h5, h6) + .imagebox, .contents *:not(h1, h2, h3, h4, h5, h6) + .table, .contents *:not(h1, h2, h3, h4, h5, h6) + .youtube, .contents *:not(h1, h2, h3, h4, h5, h6) + .button, .contents *:not(h1, h2, h3, h4, h5, h6) + .morebutton, .contents *:not(h1, h2, h3, h4, h5, h6) + .box, .contents *:not(h1, h2, h3, h4, h5, h6) + .teachermessage, .contents *:not(h1, h2, h3, h4, h5, h6) + .imagelink, .contents *:not(h1, h2, h3, h4, h5, h6) + .accordionmenu, .contents *:not(h1, h2, h3, h4, h5, h6) + .snslink, .contents *:not(h1, h2, h3, h4, h5, h6) + .pageselector, *:not(h1, h2, h3, h4, h5, h6) + .linklist, *:not(h1, h2, h3, h4, h5, h6) + .faqlist, *:not(h1, h2, h3, h4, h5, h6) + .admissionpoint, *:not(h1, h2, h3, h4, h5, h6) + .examlist, *:not(h1, h2, h3, h4, h5, h6) + .textblock,
	*:not(h1, h2, h3, h4, h5, h6) + .oldhtml, *:not(h1, h2, h3, h4, h5, h6) + .pagenation {
		margin-top: 60px;
	}
}

.block17 .list dd > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .text *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents > div > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .imagebox > *:not(.image) > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .column > * > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .table > table > tbody > tr > th > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .table > table > tr > td:not(.d) > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .table > table > tbody > tr > td > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .box > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .form > dl > dd > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .contents .form > form > dl > dd > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .headdingmenu > div > a > div > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .faqlist dl dd > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .textblock > *:not(h1, h2, h3, h4, h5, h6) + p:not(.image):not(.caption), .block17 .list dd > *:not(h1, h2, h3, h4, h5, h6) + ul, .block17 .list dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .block17 .list dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .text *:not(h1, h2, h3, h4, h5, h6) + ul, .contents > div > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents > div > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents > div > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .imagebox > *:not(.image) > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .imagebox > *:not(.image) > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .imagebox > *:not(.image) > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .column > * > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .column > * > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .column > * > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tbody > tr > th > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tbody > tr > th > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tbody > tr > th > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tr > td:not(.d) > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tr > td:not(.d) > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tr > td:not(.d) > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tbody > tr > td > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tbody > tr > td > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .table > table > tbody > tr > td > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .box > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .box > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .box > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .form > dl > dd > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .form > form > dl > dd > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .form > dl > dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .form > form > dl > dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .form > dl > dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .contents .form > form > dl > dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .headdingmenu > div > a > div > *:not(h1, h2, h3, h4, h5, h6) + ul, .headdingmenu > div > a > div > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .headdingmenu > div > a > div > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .faqlist dl dd > *:not(h1, h2, h3, h4, h5, h6) + ul, .faqlist dl dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .faqlist dl dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .textblock > *:not(h1, h2, h3, h4, h5, h6) + ul, .textblock > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .textblock > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ul, .block17 .list dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .block17 .list dd > *:not(h1, h2, h3, h4, h5, h6) + ol, .block17 .list dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .text *:not(h1, h2, h3, h4, h5, h6) + ol, .contents > div > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents > div > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents > div > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .imagebox > *:not(.image) > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .imagebox > *:not(.image) > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .imagebox > *:not(.image) > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .column > * > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .column > * > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .column > * > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tbody > tr > th > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tbody > tr > th > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tbody > tr > th > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tr > td:not(.d) > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tr > td:not(.d) > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tr > td:not(.d) > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tbody > tr > td > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tbody > tr > td > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .table > table > tbody > tr > td > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .box > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .box > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .box > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .form > dl > dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .form > form > dl > dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .form > dl > dd > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .form > form > dl > dd > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .form > dl > dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .contents .form > form > dl > dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .headdingmenu > div > a > div > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .headdingmenu > div > a > div > *:not(h1, h2, h3, h4, h5, h6) + ol, .headdingmenu > div > a > div > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .faqlist dl dd > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .faqlist dl dd > *:not(h1, h2, h3, h4, h5, h6) + ol, .faqlist dl dd > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .textblock > ul > li > *:not(h1, h2, h3, h4, h5, h6) + ol, .textblock > *:not(h1, h2, h3, h4, h5, h6) + ol, .textblock > ol > li > *:not(h1, h2, h3, h4, h5, h6) + ol, #pagetitle *:not(h1, h2, h3, h4, h5, h6) + p, .block2 *:not(h1, h2, h3, h4, h5, h6) + .more, .block8 *:not(h1, h2, h3, h4, h5, h6) + .more, .contents .lead *:not(h1, h2, h3, h4, h5, h6) + p, .contents .imagebox > .image > *:not(h1, h2, h3, h4, h5, h6) + img,
.contents .imagebox > .image > *:not(h1, h2, h3, h4, h5, h6) + a, .contents .teacherprofile *:not(h1, h2, h3, h4, h5, h6) + h4, .contents .form *:not(h1, h2, h3, h4, h5, h6) + textarea, *:not(h1, h2, h3, h4, h5, h6) + .datelist, .gsc-control-cse *:not(h1, h2, h3, h4, h5, h6) + .gsc-results-wrapper-nooverlay {
	margin-top: 20px;
}

header {
	display: block;
	position: fixed;
	width: 100%;
	height: 112px;
	top: 0px;
	background: rgba(255, 255, 255, 0.84);
	z-index: 1000;
	transition: top 600ms, background 600ms;
}
.library header, .scroll header, .megamenuopen header, .menuopen header, .searchopen header, header:has(~ #breadcrumbs:not(.headertrans)) {
	background: #fff;
}
.hideheader header {
	top: -62px;
}
@media screen and (max-width: 959px) {
	header {
		top: -62px;
	}
}
@media screen and (max-width: 767px) {
	header {
		background: #fff;
	}
}

#logo {
	position: fixed;
	top: 56px;
	left: 40px;
	transform: translateY(-50%);
	transition: top 600ms, left 600ms;
}
.hideheader #logo {
	top: 25px;
}
@media screen and (max-width: 959px) {
	#logo {
		top: 25px;
		left: 20px;
	}
	.hideheader #logo a {
		width: 237px;
	}
}
@media screen and (max-width: 767px) {
	#logo {
		left: 10px;
	}
}
#logo a {
	display: block;
	width: 237px;
	background: url(../images/logo.svg) no-repeat left center;
	background-size: 100% auto;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	transition: width 600ms, height 600ms, opacity 200ms;
	aspect-ratio: 237 / 39;
}
#logo a:hover {
	opacity: 0.7;
}
html[lang="en"] #logo a {
	width: 311px;
	background-image: url(../images/logoen.svg);
	aspect-ratio: 311 / 39;
}
@media screen and (max-width: 767px) {
	html[lang="en"] #logo a {
		width: 240px !important;
	}
}
.library #logo a {
	width: min(386px, 23.5365853659vw);
	background-image: url(../images/logolibrary.svg);
	aspect-ratio: 304 / 59;
}
@media screen and (max-width: 1279px) {
	.library #logo a {
		width: min(386px, 20.8333333333vw);
		max-width: min(386px, 20.8333333333vw);
	}
}
@media screen and (max-width: 959px) {
	.library #logo a {
		width: 200px !important;
		max-width: 100%;
	}
}
.hideheader .library #logo a {
	width: 245px;
}
@media screen and (max-width: 767px) {
	#logo a {
		width: 180px !important;
	}
}
#logo a span {
	position: absolute;
	left: -10000px;
}

#utility {
	position: fixed;
	display: flex;
	align-items: flex-end;
	gap: 0px;
	top: 0px;
	right: 170px;
	height: 40px;
	transition: right 600ms, top 600ms;
	z-index: 1;
}
.library #utility {
	display: none;
}
.hideheader #utility {
	top: -40px;
}
@media screen and (max-width: 1279px) {
	#utility {
		right: 120px;
	}
}
@media screen and (max-width: 959px) {
	#utility {
		display: none;
	}
}
#utility .sel {
	height: 20px;
	padding-right: 16px;
	border-right: 1px solid #CDD6DD;
}
#utility .sel > div {
	display: block;
	background: #fff;
	border: 1px solid #CDD6DD;
	border-radius: 5px;
}
#utility .sel > div > a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 9.667em;
	height: 18px;
	padding: 0px 15px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	#utility .sel > div > a {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#utility .sel > div > a {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
#utility .sel > div > a:hover {
	opacity: 0.7;
}
#utility .sel > div > a:before {
	content: "";
	display: block;
	position: absolute;
	width: 16px;
	height: 100%;
	right: 0px;
	top: 0px;
	background: url(../images/triangle.svg) no-repeat center center;
	transition: transform 400ms;
}
#utility .sel > div > a.on:before {
	transform: rotateX(180deg);
}
#utility .sel div div {
	display: none;
}
#utility .sel ul {
	position: relative;
	margin-top: 10px;
	padding-bottom: 10px;
}
#utility .sel ul:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 20px);
	height: 1px;
	top: 0px;
	left: 10px;
	background: #CDD6DD;
}
#utility .sel ul li {
	position: relative;
}
#utility .sel ul li:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 20px);
	height: 1px;
	bottom: 0px;
	left: 10px;
	background: #CDD6DD;
}
#utility .sel ul a {
	display: block;
	padding: 10px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	text-align: center;
}
@media screen and (max-width: 959px) {
	#utility .sel ul a {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#utility .sel ul a {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
#utility .contact,
#utility .request,
#utility .support {
	height: 20px;
	padding-left: 16px;
	padding-right: 16px;
	border-right: 1px solid #CDD6DD;
}
#utility .contact a,
#utility .request a,
#utility .support a {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding-left: 28px;
	height: 20px;
	vertical-align: top;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #000;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	#utility .contact a,
	#utility .request a,
	#utility .support a {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#utility .contact a,
	#utility .request a,
	#utility .support a {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
#utility .contact a:hover,
#utility .request a:hover,
#utility .support a:hover {
	opacity: 0.7;
}
#utility .contact a:after,
#utility .request a:after,
#utility .support a:after {
	content: "";
	display: block;
	position: absolute;
	top: calc(50% - 10px);
	left: 0px;
	width: 20px;
	height: 20px;
	background: no-repeat center center;
}
#utility .contact a:after {
	background-image: url(../images/contact.svg);
	background-size: 20px auto;
}
#utility .request a:after {
	background-image: url(../images/request.svg);
	background-size: 20px auto;
}
#utility .support a:after {
	background-image: url(../images/support.svg);
	background-size: auto 16px;
}
#utility .language {
	height: 20px;
	padding-left: 20px;
	padding-right: 20px;
	border-right: 1px solid #CDD6DD;
}
#utility .language ul {
	display: flex;
	gap: 15px;
	align-items: center;
	height: 20px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #1E2C58;
}
@media screen and (max-width: 959px) {
	#utility .language ul {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#utility .language ul {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#utility .language a {
	color: #A8BDCC;
	font-weight: 400;
	position: relative;
	display: inline-block;
}
#utility .language a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #A8BDCC;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#utility .language a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}

#navigation {
	position: absolute;
	bottom: 0px;
	right: 153px;
	transition: right 600ms, opacity 600ms;
}
.hideheader #navigation {
	right: 123px;
}
@media screen and (max-width: 1279px) {
	#navigation {
		right: 110px;
	}
	.hideheader #navigation {
		right: 110px;
	}
}
@media screen and (max-width: 959px) {
	#navigation {
		display: none;
	}
	.library #navigation {
		display: block;
	}
	.library #navigation li {
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.library #navigation {
		right: 55px;
	}
}
#navigation > ul {
	display: flex;
	gap: 0px;
	align-items: flex-end;
	height: 70px;
	transition: height 600ms;
}
.library #navigation > ul {
	height: 105px;
	align-items: center;
}
@media screen and (max-width: 959px) {
	.library #navigation > ul {
		height: 50px;
	}
}
.hideheader .library #navigation > ul, .hideheader #navigation > ul {
	height: 50px;
}
#navigation > ul > li {
	position: relative;
	transition: padding 600ms;
}
#navigation > ul > li a {
	display: flex;
	align-items: center;
	padding: 0px 17px 10px;
	height: 60px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #000;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	transition: opacity 0.2s, color 0.2s, border 0.2s, height 600ms, padding 600ms;
}
@media screen and (max-width: 959px) {
	#navigation > ul > li a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#navigation > ul > li a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#navigation > ul > li a:hover {
	opacity: 0.7;
}
.library #navigation > ul > li a {
	padding: 0px min(17px, 1.0625vw) 10px;
	font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.library #navigation > ul > li a {
		font-size: min(1.756097561vw * var(--fontratio, 1), 14.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library #navigation > ul > li a {
		font-size: min(3.6800881543vw * var(--fontratio, 1), 13.8003305785px * var(--fontratio, 1));
	}
}
.hideheader #navigation > ul > li a {
	padding-top: 10px;
	height: 50px;
}
@media screen and (max-width: 1279px) {
	#navigation > ul > li a {
		padding: 0px 10px 10px;
	}
}
#navigation > ul > li.exam {
	align-self: center;
	padding-right: 25px;
}
@media screen and (max-width: 1279px) {
	#navigation > ul > li.exam {
		padding-right: 10px;
	}
}
#navigation > ul > li.exam a {
	padding: 0px 20px;
	height: 40px;
	background: #fff;
	border: 1px solid #0077B6;
	border-radius: 20px;
}
#navigation > ul > li.myopac {
	align-self: center;
	padding-right: min(15px, 0.9375vw);
	padding-bottom: 10px;
}
.hideheader #navigation > ul > li.myopac {
	padding-bottom: 0px;
}
@media screen and (max-width: 1279px) {
	#navigation > ul > li.myopac {
		padding-right: 10px;
	}
}
@media screen and (max-width: 959px) {
	#navigation > ul > li.myopac {
		display: block;
		padding: 0;
	}
}
#navigation > ul > li.myopac a {
	padding: 0px 20px;
	height: 40px;
	color: #0077B6;
	background: #fff;
	border: 1px solid #0077B6;
	border-radius: 10px;
}

#search {
	position: fixed;
	top: 27px;
	right: 86px;
	transition: top 600ms, right 600ms;
}
.hideheader #search {
	top: 0px;
	right: 51px;
}
@media screen and (max-width: 1279px) {
	#search {
		right: 56px;
	}
}
@media screen and (max-width: 959px) {
	#search {
		top: 5px;
		right: 46px;
	}
	.hideheader #search {
		top: 5px;
		right: 46px;
	}
}
@media screen and (max-width: 767px) {
	#search {
		display: none;
	}
}
#search a {
	position: relative;
	display: block;
	width: 45px;
	height: 54px;
	background: #0077B6;
	text-indent: -10000px;
	border-radius: 10px 0 0 10px;
	overflow: hidden;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	transition: opacity 0.2s, background 0.2s, width 600ms, height 600ms, border-radius linear 600ms;
}
#search a:hover {
	opacity: 0.7;
}
.hideheader #search a {
	width: 50px;
	height: 50px;
	border-radius: 0px 0px 0px 0px;
}
@media screen and (max-width: 959px) {
	#search a {
		width: 40px;
		height: 40px;
		border-radius: 10px 0px 0px 10px;
	}
	.hideheader #search a {
		width: 40px;
		height: 40px;
		border-radius: 10px 0px 0px 10px;
	}
}
#search a:before {
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: url(../images/search.svg) no-repeat center center;
	opacity: 1;
	transition: 400ms;
}
#search a:after {
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: url(../images/close.svg) no-repeat center center;
	opacity: 0;
	transition: 400ms;
}
.searchopen #search a:before {
	opacity: 0;
}
.searchopen #search a:after {
	opacity: 1;
}

#menu {
	position: fixed;
	top: 27px;
	right: 40px;
	transition: top 600ms, right 600ms;
}
.hideheader #menu {
	top: 0px;
	right: 0px;
}
@media screen and (max-width: 1279px) {
	#menu {
		right: 10px;
	}
}
@media screen and (max-width: 959px) {
	#menu {
		top: 5px;
		right: 5px;
	}
	.hideheader #menu {
		top: 5px;
		right: 5px;
	}
}
#menu a {
	position: relative;
	display: block;
	width: 45px;
	height: 54px;
	text-indent: -10000px;
	background: #0077B6;
	border-radius: 0 10px 10px 0;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	transition: opacity 0.2s, background 0.2s, width 600ms, height 600ms, border-radius linear 600ms;
}
#menu a:hover {
	opacity: 0.7;
}
.hideheader #menu a {
	width: 50px;
	height: 50px;
	border-radius: 0px 0px 0px 0px;
}
@media screen and (max-width: 959px) {
	#menu a {
		width: 40px !important;
		height: 40px !important;
		border-radius: 0px 10px 10px 0px !important;
	}
}
@media screen and (max-width: 767px) {
	#menu a {
		border-radius: 10px !important;
	}
}
#menu a:before {
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: url(../images/menu.svg) no-repeat center center;
	opacity: 1;
	transition: 400ms;
}
#menu a:after {
	content: "";
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: url(../images/close.svg) no-repeat center center;
	opacity: 0;
	transition: 400ms;
}
.menuopen #menu a:before {
	opacity: 0;
}
.menuopen #menu a:after {
	opacity: 1;
}

#megamenu {
	position: fixed;
	top: 112px;
	width: 100%;
	background: #7D8E9E;
	z-index: 45;
	transform: translateY(-50%);
	transition: 400ms;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
.hideheader #megamenu {
	top: 50px;
}
@media screen and (max-width: 959px) {
	#megamenu {
		display: none;
	}
}
#megamenu > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 0px 40px 50px;
	transition: height 400ms;
}
@media screen and (max-width: 959px) {
	#megamenu > div {
		padding: 0px 20px 25px;
	}
}
@media screen and (max-width: 767px) {
	#megamenu > div {
		padding: 0px 15px 25px;
	}
}
.megamenuopen #megamenu {
	transform: translateY(0%);
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
#megamenu .mm {
	position: absolute;
	width: calc(100% - 80px);
	max-width: 1820px;
	margin: auto;
	left: 50%;
	top: 0px;
	transform: translateX(-50%);
	transition: visibility 200ms, opacity 200ms;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
#megamenu .mm.show {
	transition: visibility 0ms, opacity 400ms 200ms;
	z-index: 10;
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
#megamenu .mm .block {
	display: flex;
	padding-top: 50px;
}
#megamenu .mm .head {
	flex-grow: 1;
	padding-right: min(50px, 2.7472527473vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	white-space: nowrap;
}
@media screen and (max-width: 959px) {
	#megamenu .mm .head {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#megamenu .mm .head {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	#megamenu .mm .head {
		white-space: normal;
	}
}
#megamenu .mm .head a {
	color: #fff;
	position: relative;
	display: inline-block;
}
#megamenu .mm .head a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.15em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#megamenu .mm .head a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.15em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
#megamenu .mm .contents {
	position: relative;
	flex-grow: 1;
	column-count: 2;
	gap: min(100px, 5.4945054945vw);
	padding-left: min(50px, 2.7472527473vw);
	padding-right: min(50px, 2.7472527473vw);
	border-left: 1px solid #fff;
}
#megamenu .mm .contents ul {
	display: flex;
	flex-direction: column;
	margin-bottom: -15px;
}
#megamenu .mm .contents ul li {
	margin-bottom: 15px;
}
#megamenu .mm .contents a {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	#megamenu .mm .contents a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#megamenu .mm .contents a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
#megamenu .mm .contents a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.15em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#megamenu .mm .contents a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.15em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
#megamenu .mm .body {
	flex-grow: 1;
	padding-left: min(50px, 2.7472527473vw);
	padding-right: min(50px, 2.7472527473vw);
	border-left: 1px solid #fff;
}
#megamenu .mm .body ul {
	display: flex;
	flex-direction: column;
	gap: min(40px, 2.1978021978vw);
}
#megamenu .mm .body .image {
	margin-bottom: 10px;
}
#megamenu .mm .body .image img {
	display: block;
}
#megamenu .mm .body a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	#megamenu .mm .body a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#megamenu .mm .body a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
#megamenu .mm .body a:hover {
	opacity: 0.7;
}
#megamenu .mm .related {
	flex-grow: 1;
	padding-left: min(50px, 2.7472527473vw);
	border-left: 1px solid #fff;
}
#megamenu .mm .related p {
	margin-bottom: 30px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
}
@media screen and (max-width: 959px) {
	#megamenu .mm .related p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#megamenu .mm .related p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
#megamenu .mm .related ul {
	display: flex;
	flex-direction: column;
	gap: 15px;
}
#megamenu .mm .related a {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	#megamenu .mm .related a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#megamenu .mm .related a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
#megamenu .mm .related a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.15em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#megamenu .mm .related a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.15em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}

#fullmenu {
	position: fixed;
	top: 100px;
	right: 0px;
	width: 66.66666666666667%;
	height: calc(100% - 100px);
	color: #fff;
	z-index: 999;
	transform: translateX(40%);
	transition: visibility 600ms, opacity 600ms, transform 600ms, top 600ms, height 600ms, margin-top 600ms;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
.hideheader #fullmenu {
	top: 50px;
	height: calc(100% - 50px);
}
@media screen and (max-width: 959px) {
	#fullmenu {
		top: 50px;
		height: calc(100% - 50px);
	}
}
@media screen and (max-width: 767px) {
	#fullmenu {
		width: 100%;
		background: #0077B6;
		overflow-y: auto;
		overflow-x: hidden;
	}
}
.menuopen #fullmenu {
	transform: translateX(0%);
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
#fullmenu .panel {
	position: absolute;
	width: calc(33.33333333333333vw + 10px);
	height: 100%;
	right: 80%;
	top: 0px;
	padding: 0;
	transition: right 0ms 600ms;
	z-index: -1;
}
.menuopen #fullmenu .panel {
	right: 100%;
	transition: right linear 500ms;
}
#fullmenu .panel:before {
	content: "";
	display: block;
	position: fixed;
	width: 35vw;
	height: 100%;
	top: 0px;
	left: -35vw;
	background: url(../images/fullmenu.jpg) no-repeat right center;
	background-size: cover;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	#fullmenu .panel:before {
		display: none;
	}
}
#fullmenu .panel:after {
	content: "";
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: -50vw;
	background: rgba(0, 102, 169, 0.2);
	z-index: -1;
	mix-blend-mode: multiply;
}
@media screen and (max-width: 767px) {
	#fullmenu .panel:after {
		display: none;
	}
}
#fullmenu .panel > div {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}
@media screen and (max-width: 767px) {
	#fullmenu .panel > div {
		min-height: 0px;
	}
}
#fullmenu .panel > div img {
	display: block;
	width: 85%;
	max-width: 236px;
	object-fit: contain;
}
#fullmenu .body {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 30px 40px 25px 30px;
	background: #0077B6;
	overflow-y: auto;
	overflow-x: hidden;
	z-index: 5;
}
@media screen and (max-width: 767px) {
	#fullmenu .body {
		height: auto;
		padding: 0px 10px 40px;
	}
}
#fullmenu .search {
	position: relative;
	display: none;
	width: 100%;
	padding: 15px 10px 20px;
	background: #E8ECEB;
}
@media screen and (max-width: 767px) {
	#fullmenu .search {
		display: block;
	}
}
#fullmenu .search .title {
	margin-bottom: 10px;
	font-size: min(5.3333333333vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #000;
	font-family: "Marcellus", serif;
}
#fullmenu .search .input {
	position: relative;
	background: #ffffff;
	border-radius: 5px;
}
#fullmenu .search input {
	width: 100%;
	height: 50px;
	padding: 0px 60px 0px 10px;
	font-size: min(4.8vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	line-height: 60px;
	font-weight: 500;
	border: 1px solid #CDD6DD;
	border-radius: 5px;
}
#fullmenu .search input::placeholder {
	color: #707F89;
}
#fullmenu .search input:-ms-input-placeholder {
	color: #707F89;
}
#fullmenu .search input::-ms-input-placeholder {
	color: #707F89;
}
#fullmenu .search button {
	position: absolute;
	width: 60px;
	height: 60px;
	right: 0px;
	top: 0px;
	text-indent: -10000px;
	background: url(../images/search.svg) no-repeat center center;
	background-size: 16px;
	border: 0px;
	cursor: pointer;
}
#fullmenu .spblock {
	display: none;
	flex-direction: column;
	gap: 30px;
	padding-top: 25px;
}
@media screen and (max-width: 767px) {
	#fullmenu .spblock {
		display: flex;
	}
}
.library #fullmenu .spblock {
	display: none !important;
}
#fullmenu .spblock img {
	display: block;
	width: 100%;
	max-width: 370px;
	margin: auto;
}
#fullmenu .spblock .sel > div {
	display: block;
	background: #fff;
	border-radius: 20px;
	overflow: hidden;
}
#fullmenu .spblock .sel > div > a {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: 38px;
	padding: 0px 20px;
	font-size: min(4.5333333333vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
#fullmenu .spblock .sel > div > a:hover {
	opacity: 0.7;
}
#fullmenu .spblock .sel > div > a:before {
	content: "";
	display: block;
	position: absolute;
	width: 40px;
	height: 100%;
	right: 0px;
	top: 0px;
	background: url(../images/triangleb.svg) no-repeat center center;
	transition: transform 400ms;
}
#fullmenu .spblock .sel > div > a.on:before {
	transform: rotateX(180deg);
}
#fullmenu .spblock .sel div div {
	display: none;
}
#fullmenu .spblock .sel ul {
	position: relative;
	margin-top: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
}
#fullmenu .spblock .sel ul:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 20px);
	height: 1px;
	top: 0px;
	left: 10px;
	background: #0077B6;
}
#fullmenu .spblock .sel ul a {
	display: block;
	padding: 10px 30px;
	font-size: min(4vw * var(--fontratio, 1), 15px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
}
#fullmenu .spblock .utility {
	display: flex;
	background: #fff;
	border-radius: 5px;
}
#fullmenu .spblock .utility > * {
	flex: 1;
}
#fullmenu .spblock .utility .contact,
#fullmenu .spblock .utility .request,
#fullmenu .spblock .utility .support {
	position: relative;
}
#fullmenu .spblock .utility .contact:before,
#fullmenu .spblock .utility .request:before,
#fullmenu .spblock .utility .support:before {
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: calc(100% - 30px);
	right: 0;
	top: 15px;
	background: #CDD6DD;
}
#fullmenu .spblock .utility .contact a,
#fullmenu .spblock .utility .request a,
#fullmenu .spblock .utility .support a {
	display: block;
	height: 90px;
	padding: 55px 0 0;
	font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #000;
	text-align: center;
	background: none no-repeat bottom 50px center;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
#fullmenu .spblock .utility .contact a:hover,
#fullmenu .spblock .utility .request a:hover,
#fullmenu .spblock .utility .support a:hover {
	opacity: 0.7;
}
#fullmenu .spblock .utility .contact a {
	background-image: url(../images/contact.svg);
	background-size: 20px auto;
}
#fullmenu .spblock .utility .request a {
	background-image: url(../images/request.svg);
	background-size: 20px auto;
}
#fullmenu .spblock .utility .support a {
	background-image: url(../images/support.svg);
	background-size: auto 16px;
}
#fullmenu .spblock .utility .language {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 90px;
}
#fullmenu .spblock .utility .language ul {
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: center;
	height: 20px;
	font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #1E2C58;
}
#fullmenu .spblock .utility .language a {
	color: #A8BDCC;
	font-weight: 400;
	position: relative;
	display: inline-block;
}
#fullmenu .spblock .utility .language a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #A8BDCC;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#fullmenu .spblock .utility .language a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
#fullmenu .spblock .utility .language li + li {
	position: relative;
}
#fullmenu .spblock .utility .language li + li:before {
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: 0.8em;
	left: -6px;
	top: 0.15em;
	background: #000;
	transform: skew(-20deg);
}
#fullmenu .menu {
	position: relative;
	width: 28%;
	flex-shrink: 0;
	font-size: min(1.484375vw * var(--fontratio, 1), 19px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#fullmenu .menu {
		font-size: min(1.8536585366vw * var(--fontratio, 1), 15.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .menu {
		font-size: min(3.8020055096vw * var(--fontratio, 1), 14.2575206612px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .menu {
		width: 100%;
		margin-top: 20px;
	}
}
#fullmenu .menu a {
	display: inline-block;
	color: #fff;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu > div {
		margin: 0px -15px;
	}
}
#fullmenu .menu div {
	display: flex;
}
#fullmenu .menu div .sw {
	display: none;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu div {
		align-items: center;
		height: 50px;
	}
	#fullmenu .menu div .sw {
		position: relative;
		flex-shrink: 0;
		display: block;
		width: 70px;
		height: 100%;
		cursor: pointer;
		overflow: hidden;
	}
	#fullmenu .menu div .sw:before {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0%;
		background: url(../images/plus.svg) no-repeat center center;
		transition: top 400ms;
	}
	#fullmenu .menu div .sw:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: -100%;
		background: url(../images/minus.svg) no-repeat center center;
		transition: top 400ms;
	}
	#fullmenu .menu div .sw.open:before {
		top: 100%;
	}
	#fullmenu .menu div .sw.open:after {
		top: 0%;
	}
}
#fullmenu .menu div a:not(.sw) {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	height: min(57px, 4.453125vw);
	align-items: flex-start;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu div a:not(.sw) {
		padding: 10px 15px;
		height: 50px;
	}
}
#fullmenu .menu div a:not(.sw):before {
	content: "";
	display: block;
	position: absolute;
	width: 0px;
	height: 100%;
	top: 0px;
	left: -30px;
	background: rgba(255, 255, 255, 0.2);
	opacity: 0;
	transition: width 0ms 300ms, opacity 300ms;
	z-index: -1;
	mix-blend-mode: screen;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu div a:not(.sw):before {
		display: none;
	}
}
#fullmenu .menu div.open a:not(.sw):before {
	width: calc(100% + 30px);
	opacity: 1;
}
#fullmenu .menu div.separate {
	position: relative;
	margin-top: min(40px, 3.125vw);
	margin-bottom: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	#fullmenu .menu div.separate {
		margin-top: 40px;
	}
}
#fullmenu .menu div.separate:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 15px);
	height: 1px;
	top: -10px;
	left: 0px;
	background: #fff;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu div.separate:before {
		width: calc(100% - 30px);
		left: 15px;
		top: -20px;
	}
}
#fullmenu .menu ul {
	display: block;
	position: absolute;
	width: 100%;
	top: 0px;
	left: calc(100% + 0px);
	z-index: 10;
	transition: visibility 300ms, opacity 300ms, left 0ms 300ms;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
@media screen and (min-width: 768px) {
	#fullmenu .menu ul {
		display: block !important;
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul {
		display: none;
		position: static;
		margin: 0px -15px;
		width: auto;
		background: rgba(0, 0, 0, 0.2);
		opacity: 1;
		pointer-events: auto;
		visibility: visible;
	}
}
#fullmenu .menu ul ul {
	width: 35vw;
}
#fullmenu .menu ul ul li {
	width: 25vw;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul ul {
		display: none;
		width: 100%;
		margin-left: -5px;
	}
	#fullmenu .menu ul ul li {
		display: none;
		width: 100%;
	}
	#fullmenu .menu ul ul li.spmenushow {
		display: block;
	}
}
#fullmenu .menu ul ul:before {
	background: #CDD6DD;
}
#fullmenu .menu ul ul a {
	color: #000;
}
#fullmenu .menu ul ul a:before {
	background: rgba(255, 255, 255, 0.5);
	mix-blend-mode: screen;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul ul a {
		padding-left: 70px !important;
		color: #fff;
	}
}
#fullmenu .menu ul:before {
	content: "";
	display: block;
	position: fixed;
	width: 100vw;
	height: calc(100vh - 50px);
	background: #056295;
	top: 0px;
	margin-left: -30px;
	z-index: -1;
}
.hideheader #fullmenu .menu ul:before {
	height: calc(100vh - 50px);
}
@media screen and (max-width: 959px) {
	#fullmenu .menu ul:before {
		height: calc(100vh - 50px);
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul:before {
		display: none;
	}
}
#fullmenu .menu ul li.open > a:before {
	width: calc(100% + 30px);
	opacity: 1;
}
#fullmenu .menu ul li li a:hover:before {
	width: 35vw;
	transition: width 600ms, opacity 0ms;
}
#fullmenu .menu ul div a:not(.sw) {
	align-items: flex-start;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul div a:not(.sw) {
		align-items: flex-start;
		min-height: 50px;
		height: auto;
		padding: 10px 15px 10px 35px;
	}
}
#fullmenu .menu ul a:not(.sw) {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	min-height: min(57px, 4.453125vw);
	padding: 10px 0px;
	font-weight: 500;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul a:not(.sw) {
		min-height: 50px;
		padding: 10px 15px 10px 35px;
	}
}
#fullmenu .menu ul a:not(.sw):before {
	content: "";
	display: block;
	position: absolute;
	width: 0px;
	height: 100%;
	top: 0px;
	left: -30px;
	background: rgba(0, 0, 0, 0.3);
	opacity: 0;
	transition: width 0ms 300ms, opacity 300ms;
	z-index: -1;
	mix-blend-mode: multiply;
}
@media screen and (max-width: 767px) {
	#fullmenu .menu ul a:not(.sw):before {
		display: none;
	}
}
#fullmenu .menu ul a:not(.sw):hover:before {
	width: calc(100% + 30px);
	opacity: 1;
	transition: width 400ms, opacity 0ms;
}
#fullmenu .menu div.open + ul {
	opacity: 1;
	left: calc(100% + 30px);
	transition: visibility 0ms, opacity 400ms 250ms, left 400ms 250ms;
}
.menuopen #fullmenu .menu div.open + ul {
	visibility: visible;
	pointer-events: auto;
}
#fullmenu .menu div.open + ul li.open ul {
	opacity: 1;
	left: calc(100% + 30px);
	transition: visibility 0ms, opacity 400ms 250ms, left 400ms 250ms;
}
.menuopen #fullmenu .menu div.open + ul li.open ul {
	visibility: visible;
	pointer-events: auto;
}
#fullmenu .menu div a:not(.sw):hover:before {
	width: calc(100% + 30px);
	opacity: 1;
	transition: width 400ms, opacity 0ms;
}
#fullmenu .sublink {
	padding-top: min(40px, 3.125vw);
	margin-top: auto;
}
@media screen and (max-width: 767px) {
	#fullmenu .sublink {
		padding-top: 20px;
	}
}
#fullmenu .sublink ul {
	display: flex;
	gap: 10px;
	flex-direction: column;
}
@media screen and (max-width: 767px) {
	#fullmenu .sublink ul {
		align-items: center;
	}
}
#fullmenu .sublink a {
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	#fullmenu .sublink a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .sublink a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#fullmenu .sublink a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#fullmenu .sublink a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
#fullmenu .sns {
	padding-top: min(50px, 3.90625vw);
}
@media screen and (max-width: 767px) {
	#fullmenu .sns {
		padding-top: 20px;
		margin: auto;
	}
}
#fullmenu .sns ul {
	display: flex;
	gap: 20px;
}
#fullmenu .sns a {
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
#fullmenu .sns a:hover {
	opacity: 0.7;
}
#fullmenu .sns a img {
	display: block;
}
#fullmenu .copyright {
	position: relative;
	margin-top: auto;
	padding-top: min(50px, 3.90625vw);
	z-index: 0;
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
}
@media screen and (max-width: 959px) {
	#fullmenu .copyright {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .copyright {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#fullmenu .copyright {
		padding-top: 30px;
		text-align: center;
	}
}

#searchpanel {
	position: fixed;
	top: 112px;
	right: 0px;
	width: 100%;
	background: #0077B6;
	z-index: 30;
	transform: scale(1.1);
	transition: 600ms;
	overflow: auto;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
.searchopen #searchpanel {
	transform: scale(1);
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
.hideheader #searchpanel {
	top: 50px;
}
@media screen and (max-width: 959px) {
	#searchpanel {
		top: 50px;
	}
}
@media screen and (max-width: 767px) {
	#searchpanel {
		display: none;
	}
}
#searchpanel > div {
	position: relative;
	width: 100%;
	max-width: 1260px;
	margin: auto;
	padding: 50px 40px 50px;
}
@media screen and (max-width: 959px) {
	#searchpanel > div {
		padding: 25px 20px 25px;
	}
}
@media screen and (max-width: 767px) {
	#searchpanel > div {
		padding: 25px 15px 25px;
	}
}
#searchpanel > div .search {
	position: relative;
	display: flex;
	width: 100%;
}
#searchpanel > div .search .title {
	display: flex;
	white-space: nowrap;
	align-items: center;
	height: 80px;
	margin-right: 40px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
}
@media screen and (max-width: 959px) {
	#searchpanel > div .search .title {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#searchpanel > div .search .title {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
#searchpanel > div .search .body {
	width: 100%;
}
#searchpanel > div .search .input {
	position: relative;
	background: #ffffff;
	overflow: hidden;
}
#searchpanel > div .search input {
	width: 100%;
	height: 80px;
	padding: 0px 80px 0px 20px;
	font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	line-height: 80px;
	font-weight: 500;
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	#searchpanel > div .search input {
		font-size: min(1.756097561vw * var(--fontratio, 1), 14.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#searchpanel > div .search input {
		font-size: min(3.6800881543vw * var(--fontratio, 1), 13.8003305785px * var(--fontratio, 1));
	}
}
#searchpanel > div .search input::placeholder {
	color: #A8BDCC;
}
#searchpanel > div .search input:-ms-input-placeholder {
	color: #A8BDCC;
}
#searchpanel > div .search input::-ms-input-placeholder {
	color: #A8BDCC;
}
#searchpanel > div .search button {
	position: absolute;
	width: 80px;
	height: 80px;
	right: 0px;
	top: 0px;
	text-indent: -10000px;
	background: url(../images/searchb.svg) no-repeat center center;
	background-size: 26px auto;
	border: 0px;
	cursor: pointer;
}
#searchpanel > div .search .hashlist {
	margin-top: 40px;
}
#searchpanel > div .search .hashlist ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
#searchpanel > div .search .hashlist a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	text-decoration: underline;
}
@media screen and (max-width: 959px) {
	#searchpanel > div .search .hashlist a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#searchpanel > div .search .hashlist a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#searchpanel > div .search .hashlist a:hover {
	opacity: 0.7;
}
#searchpanel > div .search .hashlist a:before {
	content: "";
	display: block;
	position: relative;
	width: 14px;
	height: 14px;
	top: 1px;
	background: url(../images/tag.svg) no-repeat center center;
}

footer {
	position: relative;
	display: block;
	background: #7D8E9E;
}
@media screen and (max-width: 767px) {
	footer {
		border-top: 1px solid #fff;
	}
}
footer > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 50px 40px;
}
@media screen and (max-width: 959px) {
	footer > div {
		padding: 33.3333333333px 20px;
	}
}
@media screen and (max-width: 767px) {
	footer > div {
		padding: 25px 15px;
	}
}
@media screen and (max-width: 767px) {
	footer .logo {
		text-align: center;
	}
}
footer .logo a {
	display: inline-block;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
footer .logo a:hover {
	opacity: 0.7;
}
footer .logo img {
	display: block;
	filter: brightness(0) saturate(100%) invert(94%) sepia(94%) saturate(0%) hue-rotate(166deg) brightness(106%) contrast(105%);
}
footer .sns {
	margin-top: 30px;
}
@media screen and (max-width: 767px) {
	footer .sns {
		margin-top: 20px;
	}
}
footer .sns ul {
	display: flex;
	gap: 20px;
}
@media screen and (max-width: 767px) {
	footer .sns ul {
		justify-content: center;
	}
}
footer .sns a {
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
footer .sns a:hover {
	opacity: 0.7;
}
footer .sns a img {
	display: block;
}
footer .info {
	margin-top: 20px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #fff;
}
@media screen and (max-width: 959px) {
	footer .info {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .info {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .info {
		text-align: center;
	}
}
footer .access {
	margin-top: 20px;
}
footer .access a {
	display: flex;
	align-items: center;
	padding: 5px 15px;
	width: fit-content;
	height: 32px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
	border: 1px solid #fff;
	border-radius: 16px;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	footer .access a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .access a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
footer .access a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	footer .access a {
		margin: auto;
	}
}
footer .back {
	margin-top: 20px;
}
@media screen and (max-width: 767px) {
	footer .back {
		text-align: center;
	}
}
footer .back a {
	position: relative;
	display: flex;
	align-items: center;
	width: fit-content;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	footer .back a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .back a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
footer .back a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	footer .back a {
		display: inline-flex;
		height: 24px;
	}
}
footer .back a:before {
	content: "";
	display: block;
	position: absolute;
	width: 34px;
	height: 34px;
	right: 0;
	bottom: 0;
	background: #fff;
	border-radius: 50%;
}
@media screen and (max-width: 767px) {
	footer .back a:before {
		width: 24px;
		height: 24px;
	}
}
footer .back a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/arrow.svg) no-repeat center center;
	background-size: 10px auto;
	filter: brightness(0) saturate(100%) invert(58%) sepia(33%) saturate(195%) hue-rotate(168deg) brightness(90%) contrast(89%);
}
@media screen and (max-width: 767px) {
	footer .back a:after {
		background-size: 8px auto;
		width: 24px;
		height: 24px;
	}
}
footer .back a span {
	position: relative;
	display: inline-block;
}
footer .footercolumn {
	display: flex;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 959px) {
	footer .footercolumn {
		gap: 20px;
	}
}
@media screen and (max-width: 767px) {
	footer .footercolumn {
		flex-direction: column;
	}
}
.library footer .footercolumn .head {
	width: calc((100% - min(40px, 40/1280*100vw)) / 2);
	max-width: 460px;
}
@media screen and (max-width: 767px) {
	.library footer .footercolumn .head {
		width: auto;
		margin: auto;
	}
}
html[lang="en"] footer .footercolumn .head {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
	max-width: 360px;
}
@media screen and (max-width: 767px) {
	html[lang="en"] footer .footercolumn .head {
		width: auto;
		margin: auto;
	}
}
footer .footercolumn > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
}
@media screen and (max-width: 959px) {
	footer .footercolumn > div {
		width: calc((100% - 20px * 2) / 3);
	}
}
@media screen and (max-width: 767px) {
	footer .footercolumn > div {
		width: auto;
	}
}
@media screen and (max-width: 767px) {
	footer .body {
		display: none;
	}
}
footer .body ul {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
footer .body a {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	footer .body a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .body a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
footer .body a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.15em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
footer .body a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.15em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.library footer .body a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	font-family: "Noto Sans JP", sans-serif;
}
@media screen and (max-width: 959px) {
	.library footer .body a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library footer .body a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
footer .sub {
	margin-right: 0px;
	margin-left: auto;
}
.library footer .sub {
	display: none;
}
@media screen and (max-width: 767px) {
	footer .sub {
		margin: 40px auto 0px;
	}
}
footer .sub .sel {
	height: 20px;
}
@media screen and (max-width: 767px) {
	footer .sub .sel {
		display: none;
	}
}
footer .sub .sel > div {
	position: absolute;
	display: block;
	width: fit-content;
	background: #fff;
	border: 1px solid #CDD6DD;
	border-radius: 5px;
	z-index: 10;
}
footer .sub .sel > div > a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 9.667em;
	height: 18px;
	padding: 0px 15px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	footer .sub .sel > div > a {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .sel > div > a {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
footer .sub .sel > div > a:hover {
	opacity: 0.7;
}
footer .sub .sel > div > a:before {
	content: "";
	display: block;
	position: absolute;
	width: 16px;
	height: 100%;
	right: 0px;
	top: 0px;
	background: url(../images/triangle.svg) no-repeat center center;
	transition: transform 400ms;
}
footer .sub .sel > div > a.on:before {
	transform: rotateX(180deg);
}
footer .sub .sel div div {
	display: none;
}
footer .sub .sel ul {
	position: relative;
	margin-top: 10px;
	padding-bottom: 10px;
}
footer .sub .sel ul:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 20px);
	height: 1px;
	top: 0px;
	left: 10px;
	background: #CDD6DD;
}
footer .sub .sel ul li {
	position: relative;
}
footer .sub .sel ul li:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 20px);
	height: 1px;
	bottom: 0px;
	left: 10px;
	background: #CDD6DD;
}
footer .sub .sel ul a {
	display: block;
	padding: 10px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	text-align: center;
}
@media screen and (max-width: 959px) {
	footer .sub .sel ul a {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .sel ul a {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
footer .sub .contact {
	margin-top: 30px;
}
@media screen and (max-width: 767px) {
	footer .sub .contact {
		margin-top: 0px;
	}
}
footer .sub .contact a {
	position: relative;
	margin-left: 30px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	footer .sub .contact a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .contact a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
footer .sub .contact a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
footer .sub .contact a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
footer .sub .contact a:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: -30px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: url(../images/contactw.svg) no-repeat center center;
	background-size: 100% auto;
}
footer .sub .request {
	margin-top: 20px;
}
footer .sub .request a {
	position: relative;
	margin-left: 30px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	footer .sub .request a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .request a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
footer .sub .request a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
footer .sub .request a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
footer .sub .request a:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: -30px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: url(../images/requestw.svg) no-repeat center center;
	background-size: 100% auto;
}
footer .sub .support {
	margin-top: 20px;
}
footer .sub .support a {
	position: relative;
	margin-left: 30px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	footer .sub .support a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .support a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
footer .sub .support a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
footer .sub .support a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
footer .sub .support a:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: -30px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: url(../images/supportw.svg) no-repeat center center;
	background-size: auto 16px;
}
footer .sub * + .language {
	margin-top: 40px;
}
footer .sub .language ul {
	display: flex;
	gap: 12px;
	align-items: center;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #fff;
}
@media screen and (max-width: 959px) {
	footer .sub .language ul {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .language ul {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .sub .language ul {
		justify-content: center;
	}
}
footer .sub .language a {
	color: #fff;
	font-weight: 400;
	position: relative;
	display: inline-block;
}
footer .sub .language a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
footer .sub .language a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
footer .sub .language li + li {
	position: relative;
}
footer .sub .language li + li:before {
	content: "";
	display: block;
	position: absolute;
	width: 1px;
	height: 0.8em;
	left: -6px;
	top: 0.15em;
	background: #fff;
	transform: skew(-20deg);
}
footer .footer {
	margin-top: 50px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
}
@media screen and (max-width: 959px) {
	footer .footer {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	footer .footer {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
footer .footer ul {
	display: flex;
	gap: 30px;
	justify-content: center;
}
@media screen and (max-width: 767px) {
	footer .footer ul {
		flex-direction: column;
		align-items: center;
		gap: 20px;
		margin-bottom: 30px;
	}
}
footer .footer a {
	color: #fff;
	position: relative;
	display: inline-block;
}
footer .footer a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.15em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #fff;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
footer .footer a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.15em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
footer .copyright {
	margin-top: 10px;
	text-align: center;
}

#spfooter {
	display: none;
	position: sticky;
	bottom: 0px;
	background: #fff;
	z-index: 50;
}
@media screen and (max-width: 767px) {
	#spfooter {
		display: block;
	}
}
.library #spfooter {
	display: none !important;
}
#spfooter ul {
	display: flex;
	gap: 1px;
}
#spfooter li {
	flex: 1;
}
#spfooter a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 10px 5px;
	text-align: center;
	font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	background: #0077B6;
}

#breadcrumbs {
	position: relative;
	padding: 132px 40px 40px;
	transition: padding 600ms;
	z-index: 1;
}
@media screen and (max-width: 959px) {
	#breadcrumbs {
		padding: 70px 20px 40px;
	}
}
@media screen and (max-width: 767px) {
	#breadcrumbs {
		padding: 70px 15px 30px;
	}
}
#breadcrumbs > ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 0.45em;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #A8BDCC;
}
@media screen and (max-width: 959px) {
	#breadcrumbs > ul {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#breadcrumbs > ul {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#breadcrumbs > ul li {
	position: relative;
}
#breadcrumbs > ul li + li:before {
	content: "/";
	display: inline-block;
	margin-right: 0.45em;
}
#breadcrumbs > ul a {
	color: #1A1311;
	position: relative;
	display: inline-block;
}
#breadcrumbs > ul a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #000000;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#breadcrumbs > ul a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}

#recommend {
	position: relative;
	z-index: 0;
}
#recommend > div {
	display: flex;
	gap: 30px min(40px, 2.5vw);
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 50px 40px 120px;
}
@media screen and (max-width: 959px) {
	#recommend > div {
		padding: 25px 20px 60px;
	}
}
@media screen and (max-width: 767px) {
	#recommend > div {
		padding: 25px 15px 60px;
	}
}
@media screen and (max-width: 767px) {
	#recommend > div {
		flex-direction: column;
		padding-top: 30px;
		padding-bottom: 60px;
	}
}
#recommend > div:before {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: calc(100% - 50px - 120px);
	top: 0px;
	left: 50%;
	background: #E8ECEB;
	transform: translateX(-50%);
	z-index: -1;
}
@media screen and (max-width: 959px) {
	#recommend > div:before {
		height: calc(100% - 25px - 60px);
	}
}
@media screen and (max-width: 767px) {
	#recommend > div:before {
		height: 100%;
	}
}
#recommend h2 {
	margin-bottom: 5px;
	font-size: min(3.75vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	font-family: "Marcellus", serif;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
@media screen and (min-width: 1280px) {
	#recommend h2 {
		font-size: min(2.8571428571vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	#recommend h2 {
		font-size: min(2.8125vw * var(--fontratio, 1), 36px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	#recommend h2 {
		font-size: min(3.6585365854vw * var(--fontratio, 1), 30px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#recommend h2 {
		font-size: min(6.8774435262vw * var(--fontratio, 1), 25.7904132231px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#recommend h2 {
		text-align: center;
	}
}
#recommend p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (min-width: 1280px) {
	#recommend p {
		font-size: min(1.4285714286vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	#recommend p {
		font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	#recommend p {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#recommend p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#recommend p {
		text-align: center;
	}
}
#recommend .head {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
}
@media screen and (max-width: 959px) {
	#recommend .head {
		width: calc((100% - min(40px, 40/1600*100vw) * 2) / 3);
	}
}
@media screen and (max-width: 767px) {
	#recommend .head {
		width: 100%;
	}
}
#recommend .list {
	display: flex;
	gap: 18px;
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4 * 3 + min(40px, 40/1600*100vw) * 2);
}
@media screen and (max-width: 959px) {
	#recommend .list {
		width: calc((100% - min(40px, 40/1600*100vw) * 2) / 3 * 2 + min(40px, 40/1600*100vw));
	}
}
@media screen and (max-width: 767px) {
	#recommend .list {
		flex-direction: column;
		gap: 20px;
		width: 100%;
	}
}
#recommend .list > div {
	width: calc((100% - 18px * 2) / 3);
}
@media screen and (max-width: 767px) {
	#recommend .list > div {
		width: 100%;
		max-width: 360px;
		margin: auto;
	}
}
#recommend .list a {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
}
#recommend .list a img {
	width: 100%;
	transition: transform 600ms;
}
#recommend .list a .title {
	position: absolute;
	display: flex;
	align-items: center;
	bottom: 0;
	padding: 40px 74px 4px min(20px, 1.25vw);
	width: 100%;
	min-height: 100px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	background: linear-gradient(to bottom, rgba(0, 119, 182, 0) 0%, #0077b6 100%);
}
@media screen and (max-width: 959px) {
	#recommend .list a .title {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#recommend .list a .title {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	#recommend .list a .title {
		padding: 40px 54px 4px min(20px, 1.25vw);
	}
}
@media screen and (max-width: 959px) {
	#recommend .list a .title {
		padding-left: 20px;
	}
}
#recommend .list a .more {
	position: absolute;
	display: block;
	right: 20px;
	bottom: 15px;
	width: 34px;
	height: 34px;
	text-indent: -10000px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 959px) {
	#recommend .list a .more {
		right: 10px;
	}
}
#recommend .list a:hover img {
	transform: scale(1.15);
}

#footermenu {
	display: none;
	width: 100%;
	background: #0077B6;
	border-bottom: 1px solid #fff;
}
@media screen and (max-width: 767px) {
	#footermenu {
		display: block;
	}
}
#footermenu > div {
	position: relative;
	width: 100%;
	padding: 15px 0;
	font-size: min(1.484375vw * var(--fontratio, 1), 19px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#footermenu > div {
		font-size: min(1.8536585366vw * var(--fontratio, 1), 15.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#footermenu > div {
		font-size: min(3.8020055096vw * var(--fontratio, 1), 14.2575206612px * var(--fontratio, 1));
	}
}
#footermenu > div a {
	display: inline-block;
	color: #fff;
}
#footermenu > div > div {
	margin: 0px -15px;
}
#footermenu > div div {
	display: flex;
	align-items: center;
	margin: 0px;
	height: 50px;
}
#footermenu > div div .sw {
	position: relative;
	flex-shrink: 0;
	display: block;
	width: 70px;
	height: 100%;
	cursor: pointer;
	overflow: hidden;
}
#footermenu > div div .sw:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0%;
	background: url(../images/plus.svg) no-repeat center center;
	transition: top 400ms;
}
#footermenu > div div .sw:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: -100%;
	background: url(../images/minus.svg) no-repeat center center;
	transition: top 400ms;
}
#footermenu > div div .sw.open:before {
	top: 100%;
}
#footermenu > div div .sw.open:after {
	top: 0%;
}
#footermenu > div div a:not(.sw) {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
	height: 50px;
	padding: 10px 15px;
}
#footermenu > div div.separate {
	position: relative;
	margin-top: 40px;
	margin-bottom: min(40px, 3.125vw);
}
#footermenu > div div.separate:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 30px);
	height: 1px;
	top: -20px;
	left: 15px;
	background: #fff;
}
#footermenu > div ul {
	display: none;
	background: rgba(0, 0, 0, 0.2);
}
#footermenu > div ul ul {
	display: none;
	margin-left: -5px;
}
#footermenu > div ul ul li {
	display: none;
	width: 100%;
}
#footermenu > div ul ul li.spmenushow {
	display: block;
}
#footermenu > div ul ul a {
	padding-left: 70px !important;
}
#footermenu > div ul div a:not(.sw) {
	align-items: flex-start;
	min-height: 50px;
	height: auto;
	padding: 10px 15px 10px 35px;
}
#footermenu > div ul a:not(.sw) {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 50px;
	padding: 10px 15px 10px 35px;
	font-weight: 500;
}

#pagetitle {
	position: relative;
	z-index: 1;
}
#pagetitle:not(#pagetitle:has(+ #pagevisual)) {
	border-bottom: 1px solid #CDD6DD;
}
#pagetitle > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 20px;
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 20px 40px 60px;
	min-height: 300px;
}
@media screen and (max-width: 959px) {
	#pagetitle > div {
		padding: 10px 20px 30px;
	}
}
@media screen and (max-width: 767px) {
	#pagetitle > div {
		padding: 10px 15px 30px;
	}
}
@media screen and (max-width: 767px) {
	#pagetitle > div {
		min-height: 0px;
	}
}
#pagetitle h1 {
	font-size: min(4.6875vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#pagetitle h1 {
		font-size: min(5.8536585366vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle h1 {
		font-size: min(7.8898071625vw * var(--fontratio, 1), 29.5867768595px * var(--fontratio, 1));
	}
}
.library:not(.collection) #pagetitle h1 {
	font-weight: 500;
	font-family: "Noto Sans JP", sans-serif;
}
#pagetitle h1[data-en] {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	font-weight: 500;
}
@media screen and (max-width: 959px) {
	#pagetitle h1[data-en] {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle h1[data-en] {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
#pagetitle h1[data-en]:before {
	content: attr(data-en);
	display: block;
	position: relative;
	margin: 0px 0px 10px;
	padding: 0px;
	font-size: min(7.03125vw * var(--fontratio, 1), 90px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	font-family: "Marcellus", sans-serif;
	text-transform: uppercase;
}
@media screen and (max-width: 959px) {
	#pagetitle h1[data-en]:before {
		font-size: min(8.7804878049vw * var(--fontratio, 1), 72px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle h1[data-en]:before {
		font-size: min(9.7542699725vw * var(--fontratio, 1), 36.5785123967px * var(--fontratio, 1));
	}
}
.library.collection #pagetitle h1[data-en]:before {
	color: #1A1311;
}
#pagetitle p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #7D8E9E;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#pagetitle p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.library:not(.collection) #pagetitle p {
	font-family: "Noto Sans JP", sans-serif;
}
#pagetitle.news {
	border-bottom: 0px !important;
}
#pagetitle.news .moreinfo {
	display: flex;
	gap: 12px 20px;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	padding-top: 0px;
	padding-bottom: 0px;
	min-height: 0;
}
#pagetitle.news .moreinfo:after {
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: #CDD6DD;
}
#pagetitle.news .date {
	display: flex;
	align-items: center;
	height: 22px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #7D8E9E;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#pagetitle.news .date {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle.news .date {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.library #pagetitle.news .date {
	font-family: "Noto Sans JP", sans-serif;
}
#pagetitle.news .category {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 7em;
	height: 22px;
	padding: 0 10px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
	border: 1px solid #0077B6;
	border-radius: 16px;
}
@media screen and (max-width: 959px) {
	#pagetitle.news .category {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle.news .category {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
.library #pagetitle.news .category {
	min-width: 7.4285714286em;
	height: 32px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.library #pagetitle.news .category {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library #pagetitle.news .category {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#pagetitle.news .category:has(> span) {
	padding: 0;
	border: 0;
	border-radius: 0;
}
#pagetitle.news .category:has(> span) span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 7em;
	height: 22px;
	padding: 0 10px;
	white-space: nowrap;
	border: 1px solid #0077B6;
	border-radius: 16px;
}
@media screen and (max-width: 767px) {
	#pagetitle.news .category {
		left: 8em;
	}
}
#pagetitle.news .tags {
	margin-right: 0;
	margin-left: auto;
}
#pagetitle.news .tags ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
#pagetitle.news .tags ul li {
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #7D8E9E;
}
@media screen and (max-width: 959px) {
	#pagetitle.news .tags ul li {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagetitle.news .tags ul li {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}

#pagevisual {
	position: relative;
	display: flex;
	align-items: flex-end;
	height: min(490px, 38.28125vw);
}
#pagevisual:has(p) {
	height: min(590px, 46.09375vw);
}
#pagevisual > div {
	position: relative;
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 20px 40px 60px;
	display: flex;
	align-items: flex-end;
	margin-bottom: 0;
	min-height: 50%;
}
@media screen and (max-width: 959px) {
	#pagevisual > div {
		padding: 10px 20px 30px;
	}
}
@media screen and (max-width: 767px) {
	#pagevisual > div {
		padding: 10px 15px 30px;
	}
}
#pagevisual > div:before {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 100%;
	top: 0;
	left: 50%;
	margin-left: -50vw;
	background: linear-gradient(to bottom, rgba(29, 47, 64, 0) 0%, #334658 100%);
	opacity: 0.6;
	z-index: -1;
}
#pagevisual:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 167, 255, 0.1);
	mix-blend-mode: multiply;
	z-index: -1;
}
#pagevisual img {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
	z-index: -2;
}
#pagevisual p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 2;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#pagevisual p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pagevisual p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.library #pagevisual p {
	font-family: "Noto Sans JP", sans-serif;
}

#librarytopvisual {
	position: relative;
	margin-top: 112px;
	height: min(550px, 42.96875vw);
}
@media screen and (max-width: 959px) {
	#librarytopvisual {
		margin-top: 50px;
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual {
		height: 250px;
	}
}
#librarytopvisual > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 0px 40px;
	height: 100%;
}
@media screen and (max-width: 959px) {
	#librarytopvisual > div {
		padding: 0px 20px;
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual > div {
		padding: 0px 15px;
	}
}
#librarytopvisual .status {
	position: absolute;
	display: flex;
	flex-direction: column;
	gap: 10px;
	top: -20px;
	left: 40px;
	padding: min(20px, 1.5625vw);
	background: #fff;
	box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.16);
	opacity: 0;
	transition: opacity 600ms, top 600ms;
	cursor: pointer;
}
#librarytopvisual .status > div {
	display: flex;
	align-items: center;
	gap: 15px;
	transition: opacity 400ms;
}
#librarytopvisual .status .hc {
	display: flex;
	align-items: flex-end;
	gap: 10px 15px;
	width: 100%;
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .hc {
		flex-direction: column;
		align-items: flex-start;
	}
}
#librarytopvisual .status:hover > div {
	opacity: 0.7;
}
#librarytopvisual .status.view {
	top: 0;
	opacity: 1;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status {
		left: 20px;
		padding-top: 20px;
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status {
		top: 5px;
		left: 5px;
		padding: 10px;
	}
}
#librarytopvisual .status .code {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3em;
	height: 3em;
	padding: 0;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.1;
	font-weight: 400;
	color: var(--fc, #1A1311);
	text-align: center;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .code {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .code {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
#librarytopvisual .status .code:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: var(--bc);
	border-radius: 50%;
	z-index: -1;
}
#librarytopvisual .status .date {
	margin-bottom: 5px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .date {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .date {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
#librarytopvisual .status .date b {
	font-size: min(3.515625vw * var(--fontratio, 1), 45px * var(--fontratio, 1));
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .date b {
		font-size: min(4.3902439024vw * var(--fontratio, 1), 36px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .date b {
		font-size: min(6.6005509642vw * var(--fontratio, 1), 24.7520661157px * var(--fontratio, 1));
	}
}
#librarytopvisual .status .date span {
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .date span {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .date span {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
#librarytopvisual .status .flag {
	flex-shrink: 0;
	width: 3.333333333333333em;
	font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	text-align: center;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .flag {
		font-size: min(1.756097561vw * var(--fontratio, 1), 14.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .flag {
		font-size: min(3.6800881543vw * var(--fontratio, 1), 13.8003305785px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .flag {
		align-self: flex-start;
	}
}
#librarytopvisual .status .hours {
	font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .hours {
		font-size: min(1.756097561vw * var(--fontratio, 1), 14.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .hours {
		font-size: min(3.6800881543vw * var(--fontratio, 1), 13.8003305785px * var(--fontratio, 1));
	}
}
#librarytopvisual .status .calendar {
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .status .calendar {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .status .calendar {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
#librarytopvisual .status .calendar a {
	display: flex;
	align-items: center;
	gap: 8px;
	color: #0077B6;
	pointer-events: none;
}
#librarytopvisual .status .calendar a:before {
	content: "";
	display: block;
	width: 12px;
	height: 12px;
	background: url(../images/calendar.svg) no-repeat center center;
}
#librarytopvisual .opac {
	position: absolute;
	width: min(290px, 22.65625vw);
	height: min(290px, 22.65625vw);
	right: 40px;
	top: calc(50% - min(145px, 145/1280*100vw));
	background: #fff;
	border-radius: 20px;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .opac {
		right: 20px;
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .opac {
		right: 10px;
		top: auto;
		bottom: 10px;
		width: 130px;
		height: 130px;
	}
}
#librarytopvisual .opac a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: min(20px, 1.5625vw);
	width: 100%;
	height: 100%;
	padding: min(10px, 0.78125vw) min(20px, 1.5625vw) min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	background: #0077B6;
	border-radius: 20px;
	box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .opac a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .opac a {
		font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	}
}
#librarytopvisual .opac a:hover {
	opacity: 0.7;
}
#librarytopvisual .opac a strong {
	font-size: min(5.46875vw * var(--fontratio, 1), 70px * var(--fontratio, 1));
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	#librarytopvisual .opac a strong {
		font-size: min(6.8292682927vw * var(--fontratio, 1), 56px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarytopvisual .opac a strong {
		font-size: min(8vw * var(--fontratio, 1), 30px * var(--fontratio, 1));
	}
}
#librarytopvisual .opac a strong:after {
	content: "";
	display: block;
	width: 100%;
	height: min(82px, 6.40625vw);
	margin-top: min(20px, 1.5625vw);
	background: url(../images/opac.svg) no-repeat center center;
	background-size: auto 100%;
}
@media screen and (max-width: 767px) {
	#librarytopvisual .opac a strong:after {
		height: 30px;
	}
}

#gototop {
	position: sticky;
	width: 100%;
	bottom: 0px;
}
@media screen and (max-width: 767px) {
	#gototop {
		bottom: 40px;
	}
	.library #gototop {
		bottom: 0px;
	}
}
.scroll #gototop a {
	opacity: 1;
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
#gototop a {
	position: absolute;
	display: flex;
	justify-content: center;
	bottom: 20px;
	right: 40px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	text-align: center;
	opacity: 0;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: opacity 0.2s, background 0.2s, visibility 600ms;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	#gototop a {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#gototop a {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
#gototop a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 959px) {
	#gototop a {
		right: 20px;
	}
}
@media screen and (max-width: 767px) {
	#gototop a {
		right: 10px;
	}
}
#gototop a:before {
	content: "";
	display: block;
	position: absolute;
	width: 34px;
	height: 34px;
	left: calc(50% - 17px);
	bottom: calc(100% + 10px);
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
	transform: rotate(-90deg);
}

body.enchante {
	background: linear-gradient(to bottom, rgba(1, 142, 252, 0.2) 0%, rgba(3, 168, 234, 0.2) 18.2%, rgba(47, 209, 216, 0.2) 39.9%, rgba(128, 233, 207, 0.2) 63.1%, rgba(255, 255, 255, 0.2) 87.7%, rgba(255, 255, 255, 0.2) 100%) no-repeat;
	background-size: 100% 100vh;
}

#pickupnews {
	position: fixed;
	width: 100%;
	top: 112px;
	left: 0;
	padding: 5px 40px;
	background: #F8F0DD;
	transition: top 600ms, opacity 600ms, visibility 600ms;
	z-index: 10;
}
.hideheader #pickupnews {
	top: 50px;
	opacity: 0;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
@media screen and (max-width: 959px) {
	#pickupnews {
		top: 50px;
		padding: 5px 20px;
	}
}
@media screen and (max-width: 767px) {
	#pickupnews {
		top: 50px;
		padding: 10px 15px;
	}
}
#pickupnews a {
	display: flex;
	align-items: center;
	gap: 10px 20px;
	width: fit-content;
	min-height: 45px;
	margin: auto;
}
@media screen and (max-width: 767px) {
	#pickupnews a {
		flex-wrap: wrap;
		min-height: 0px;
	}
}
#pickupnews a:hover .title:before {
	bottom: -2px;
	opacity: 1;
	transform: scale(1);
	transition: opacity 200ms, transform 400ms, bottom 0ms;
}
#pickupnews a .date {
	display: flex;
	align-items: center;
	height: 22px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #7D8E9E;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#pickupnews a .date {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pickupnews a .date {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
#pickupnews a .category {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 8.5833333333em;
	height: 20px;
	padding: 0 10px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #ff0000;
	white-space: nowrap;
	border: 1px solid #ff0000;
	border-radius: 11px;
}
@media screen and (max-width: 959px) {
	#pickupnews a .category {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pickupnews a .category {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
#pickupnews a .title {
	position: relative;
	display: inline-block;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 500;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#pickupnews a .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#pickupnews a .title {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
#pickupnews a .title:before {
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	left: 0px;
	width: 100%;
	height: 1px;
	background: #1A1311;
	opacity: 0;
	transform-origin: left;
	transition: opacity 400ms, transform 0ms 400ms, bottom 400ms;
	transform: scale(0);
}

#visualstage {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100% !important;
	z-index: -2;
}
.library #visualstage {
	top: 112px;
	height: min(550px, 42.96875vw) !important;
}
@media screen and (max-width: 959px) {
	.library #visualstage {
		top: 50px;
	}
}
@media screen and (max-width: 767px) {
	.library #visualstage {
		height: 250px !important;
	}
}
@media screen and (max-width: 767px) {
	#visualstage {
		top: 50px;
		height: 300px !important;
	}
}
#visualstage .list {
	display: none;
}

#catch {
	position: fixed;
	display: flex;
	align-items: flex-end;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 0;
	overflow: hidden;
	opacity: 1;
	transition: width 1200ms, opacity 400ms;
}
#catch.popupcatch p.main span {
	transition: 600ms 1200ms;
}
#catch.popupcatch p.main span:nth-child(0) {
	transition-delay: 200ms;
}
#catch.popupcatch p.main span:nth-child(1) {
	transition-delay: 280ms;
}
#catch.popupcatch p.main span:nth-child(2) {
	transition-delay: 360ms;
}
#catch.popupcatch p.main span:nth-child(3) {
	transition-delay: 440ms;
}
#catch.popupcatch p.main span:nth-child(4) {
	transition-delay: 520ms;
}
#catch.popupcatch p.main span:nth-child(5) {
	transition-delay: 600ms;
}
#catch.popupcatch p.main span:nth-child(6) {
	transition-delay: 680ms;
}
#catch.popupcatch p.main span:nth-child(7) {
	transition-delay: 760ms;
}
#catch.popupcatch p.main span:nth-child(8) {
	transition-delay: 840ms;
}
#catch.popupcatch p.main span:nth-child(9) {
	transition-delay: 920ms;
}
#catch.popupcatch p.main span:nth-child(10) {
	transition-delay: 1000ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(0) {
	transition-delay: 0ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(1) {
	transition-delay: 40ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(2) {
	transition-delay: 80ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(3) {
	transition-delay: 120ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(4) {
	transition-delay: 160ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(5) {
	transition-delay: 200ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(6) {
	transition-delay: 240ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(7) {
	transition-delay: 280ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(8) {
	transition-delay: 320ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(9) {
	transition-delay: 360ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(10) {
	transition-delay: 400ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(11) {
	transition-delay: 440ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(12) {
	transition-delay: 480ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(13) {
	transition-delay: 520ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(14) {
	transition-delay: 560ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(15) {
	transition-delay: 600ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(16) {
	transition-delay: 640ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(17) {
	transition-delay: 680ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(18) {
	transition-delay: 720ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(19) {
	transition-delay: 760ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(20) {
	transition-delay: 800ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(21) {
	transition-delay: 840ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(22) {
	transition-delay: 880ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(23) {
	transition-delay: 920ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(24) {
	transition-delay: 960ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(25) {
	transition-delay: 1000ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(26) {
	transition-delay: 1040ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(27) {
	transition-delay: 1080ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(28) {
	transition-delay: 1120ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(29) {
	transition-delay: 1160ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(30) {
	transition-delay: 1200ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(31) {
	transition-delay: 1240ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(32) {
	transition-delay: 1280ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(33) {
	transition-delay: 1320ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(34) {
	transition-delay: 1360ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(35) {
	transition-delay: 1400ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(36) {
	transition-delay: 1440ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(37) {
	transition-delay: 1480ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(38) {
	transition-delay: 1520ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(39) {
	transition-delay: 1560ms;
}
html[lang="en"] #catch.popupcatch p.main span:nth-child(40) {
	transition-delay: 1600ms;
}
#catch.popupcatch:not(.poponcatch) {
	width: 0%;
	opacity: 0;
}
#catch.popupcatch:not(.poponcatch) p.main span {
	filter: blur(5px);
	opacity: 0;
	transform: translateY(0.3em);
}
#catch.popupcatch:not(.poponcatch) .image {
	opacity: 0;
}
@media screen and (max-width: 767px) {
	#catch {
		top: 50px;
		height: 300px;
	}
}
#catch > a {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 10;
}
#catch > div {
	position: relative;
	width: 100vw;
	padding-left: 50px;
	padding-right: 50px;
	padding-bottom: min(250px, 25.5102040816vh);
}
@media screen and (max-width: 767px) {
	#catch > div {
		padding-left: 10px;
		padding-right: 10px;
		padding-bottom: 100px;
	}
}
#catch p {
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	white-space: nowrap;
}
@media screen and (max-width: 959px) {
	#catch p {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#catch p {
		font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	}
}
html[lang="en"] #catch p {
	line-height: 1.3;
}
@media screen and (max-width: 959px) {
	html[lang="en"] #catch p {
		font-size: min(2.7vw, 20px);
	}
	html[lang="en"] #catch p br.view_sp {
		display: block !important;
	}
}
#catch p.main {
	position: relative;
	margin-bottom: 60px;
	font-size: min(5.46875vw * var(--fontratio, 1), 70px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	#catch p.main {
		font-size: min(6.8292682927vw * var(--fontratio, 1), 56px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#catch p.main {
		font-size: min(8vw * var(--fontratio, 1), 30px * var(--fontratio, 1));
	}
}
html[lang="en"] #catch p.main {
	line-height: 1.3;
	font-weight: 400;
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	html[lang="en"] #catch p.main {
		font-size: 6vw;
	}
}
@media screen and (max-width: 767px) {
	#catch p.main {
		margin-bottom: 20px;
	}
}
#catch p.main span + span {
	margin-left: 0.1em;
}
#catch p.main:after {
	content: "";
	position: absolute;
	display: block;
	width: 100vw;
	height: 1px;
	left: 50%;
	bottom: -30px;
	margin-left: -50vw;
	background: #fff;
}
@media screen and (max-width: 767px) {
	#catch p.main:after {
		bottom: -10px;
	}
}
#catch p.main span {
	display: inline-block;
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0);
}
#catch .image {
	position: absolute;
	width: 100vw;
	left: 50vw;
	bottom: 20px;
	margin-left: -50vw;
	background: url(/images/lineart.svg) repeat-x;
	background-size: 100% auto;
	aspect-ratio: 1900 / 209;
	background-position: 0px center;
	opacity: 1;
	transition: opacity 1200ms 1500ms;
	animation: 30s linear infinite loopbg;
}
@media screen and (max-width: 767px) {
	#catch .image {
		bottom: -20px;
		width: 300vw;
		animation: 25s linear infinite loopbgsp;
	}
}

@keyframes loopbg {
	from {
		background-position: 100vw center;
	}
	to {
		background-position: 0vw center;
	}
}
@keyframes loopbgsp {
	from {
		background-position: 300vw center;
	}
	to {
		background-position: 0vw center;
	}
}
#enchantetitle {
	position: relative;
	margin-top: 80px;
	z-index: 1;
}
@media screen and (max-width: 959px) {
	#enchantetitle {
		margin-top: 0px;
	}
}
#enchantetitle > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 0px 40px;
	aspect-ratio: 1680 / 1000;
}
@media screen and (max-width: 959px) {
	#enchantetitle > div {
		padding: 0px 20px;
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle > div {
		padding: 0px 15px;
	}
}
#enchantetitle > div:before {
	content: "";
	display: block;
	position: absolute;
	width: 86.25%;
	top: 0;
	left: 30%;
	background: url(../images/titleicon.webp) no-repeat center center;
	background-size: 100% auto;
	z-index: -2;
	aspect-ratio: 1380 / 1167;
}
@media screen and (max-width: 767px) {
	#enchantetitle > div:before {
		width: 100%;
		left: 25%;
		top: -15%;
	}
}
#enchantetitle h1 {
	margin-bottom: 10px;
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#enchantetitle h1 {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle h1 {
		font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
#enchantetitle h1:after {
	content: attr(data-en);
	display: block;
	margin-top: 15px;
	font-size: min(9.375vw * var(--fontratio, 1), 120px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	font-family: "Marcellus", serif;
	letter-spacing: 0.1em;
}
@media screen and (max-width: 959px) {
	#enchantetitle h1:after {
		font-size: min(11.7073170732vw * var(--fontratio, 1), 96px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle h1:after {
		font-size: min(10.6666666667vw * var(--fontratio, 1), 40px * var(--fontratio, 1));
	}
}
#enchantetitle .readingkana {
	margin-bottom: 40px;
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	#enchantetitle .readingkana {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle .readingkana {
		font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle .readingkana {
		margin-bottom: 30px;
	}
}
#enchantetitle .sns {
	margin-bottom: min(120px, 9.375vw);
}
@media screen and (max-width: 767px) {
	#enchantetitle .sns {
		margin-bottom: 130px;
	}
}
#enchantetitle .sns ul {
	display: flex;
	gap: 20px;
}
@media screen and (max-width: 767px) {
	#enchantetitle .sns ul {
		gap: 15px;
	}
}
#enchantetitle .sns a {
	display: block;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
#enchantetitle .sns a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	#enchantetitle .sns a img {
		width: 40px;
		height: 40px;
	}
}
#enchantetitle p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 2;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (min-width: 1280px) {
	#enchantetitle p {
		font-size: min(1.4285714286vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	#enchantetitle p {
		font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	#enchantetitle p {
		font-size: min(1.7073170732vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle p {
		font-size: min(4vw * var(--fontratio, 1), 15px * var(--fontratio, 1));
		line-height: 1.5;
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle p br {
		display: none;
	}
}
#enchantetitle .image {
	position: absolute;
	top: -10%;
	right: 40px;
	width: min(833px, 52.0625vw);
	height: 110%;
	border-radius: 0 12% 0 12% / 0 9.1% 0 9.1%;
	overflow: hidden;
	z-index: -1;
}
@media screen and (max-width: 959px) {
	#enchantetitle .image {
		top: -5%;
		right: 20px;
	}
}
@media screen and (max-width: 767px) {
	#enchantetitle .image {
		top: -5%;
		right: 0px;
		width: min(60%, 55.5555555556vw);
		height: 268px;
		border-radius: 0 50px 0 50px;
	}
}
#enchantetitle .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#octitle {
	position: relative;
	display: flex;
	flex-direction: column;
	padding-top: 112px;
	height: 100vh;
	min-height: 480px;
	max-height: 980px;
	z-index: 1;
}
@media screen and (max-width: 959px) {
	#octitle {
		padding-top: 50px;
		height: 50vh;
	}
}
@media screen and (max-width: 767px) {
	#octitle {
		margin-top: 50px;
		padding-top: 0px;
		height: auto;
		min-height: 0px;
	}
}
#octitle h1 {
	padding-left: 50%;
	margin: 0 auto auto;
	max-height: calc(100% - min(84px, 84/1280*100vw));
}
@media screen and (max-width: 767px) {
	#octitle h1 {
		display: flex;
		width: 100%;
		aspect-ratio: 1920 / 980;
	}
}
#octitle h1 img {
	margin: min(20px, 1.5625vw) auto auto;
	width: calc(920 / 1920 * 100vw);
	max-width: 920px;
}
#octitle .image {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	#octitle .image {
		height: auto;
		aspect-ratio: 1920 / 980;
	}
}
#octitle .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
}
#octitle .next {
	position: absolute;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	bottom: min(100px, 7.8125vw);
	left: 75%;
	width: min(446px, 23.2291666667vw);
	padding-right: min(100px, 5.2083333333vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
	color: #fff;
	text-align: center;
	background: url(../images/titleicon.webp) no-repeat center center;
	background-size: 100% auto;
	aspect-ratio: 446 / 377;
	transform: translateX(-50%);
}
@media screen and (max-width: 959px) {
	#octitle .next {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#octitle .next {
		font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#octitle .next {
		gap: 5px;
		top: calc(50vw - 110px);
		bottom: auto;
		width: 120px;
	}
}
#octitle .next strong {
	font-size: min(6.25vw * var(--fontratio, 1), 80px * var(--fontratio, 1));
	font-weight: 400;
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	#octitle .next strong {
		font-size: min(7.8048780488vw * var(--fontratio, 1), 64px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#octitle .next strong {
		font-size: min(6.4vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
#octitle .next span {
	display: block;
	margin-top: 10px;
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	font-weight: 400;
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	#octitle .next span {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#octitle .next span {
		font-size: min(4.2666666667vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#octitle .next span {
		margin-top: 5px;
	}
}
#octitle .navi {
	margin: 0;
	width: 100%;
	background: rgba(255, 255, 255, 0.9);
}
#octitle .navi ul {
	display: flex;
	gap: 10px min(40px, 3.125vw);
	justify-content: center;
	align-items: center;
	height: min(84px, 6.5625vw);
}
@media screen and (max-width: 767px) {
	#octitle .navi ul {
		flex-wrap: wrap;
		padding: 5px 10px;
		height: auto;
	}
}
#octitle .navi a {
	position: relative;
	margin-right: 20px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #1A1311;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	#octitle .navi a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#octitle .navi a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
#octitle .navi a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #1A1311;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
#octitle .navi a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
#octitle .navi a:after {
	content: "";
	display: block;
	position: absolute;
	right: -20px;
	top: 70%;
	width: 20px;
	height: 20px;
	margin-top: 0px;
	background: url(../images/arrow2.svg) no-repeat top center;
	background-size: auto 13px;
	filter: brightness(0) saturate(100%);
	transform: translateY(-50%) rotate(90deg);
}
@media screen and (max-width: 767px) {
	#octitle .navi a:after {
		width: 15px;
		right: -15px;
		top: 55%;
		background-size: auto 10px;
	}
}

#ocpagetitle {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 172px 20px 60px;
	width: 100%;
	max-height: 600px;
	aspect-ratio: 1920 / 600;
	z-index: 1;
}
@media screen and (max-width: 959px) {
	#ocpagetitle {
		padding-top: 50px;
		height: 50vh;
	}
}
@media screen and (max-width: 767px) {
	#ocpagetitle {
		padding-top: 60px;
		padding-bottom: 10px;
		height: auto;
		aspect-ratio: 1920 / 980;
	}
}
#ocpagetitle h1 {
	margin: auto;
	font-size: min(6.25vw * var(--fontratio, 1), 80px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Marcellus", serif;
	text-align: center;
	text-shadow: 0px 3px 10px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 959px) {
	#ocpagetitle h1 {
		font-size: min(7.8048780488vw * var(--fontratio, 1), 64px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#ocpagetitle h1 {
		font-size: min(9.2385674931vw * var(--fontratio, 1), 34.6446280992px * var(--fontratio, 1));
	}
}
#ocpagetitle h1 span {
	font-size: min(4.6875vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	#ocpagetitle h1 span {
		font-size: min(5.8536585366vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#ocpagetitle h1 span {
		font-size: min(7.8898071625vw * var(--fontratio, 1), 29.5867768595px * var(--fontratio, 1));
	}
}
#ocpagetitle h1:after {
	display: block;
	content: "OPEN CAMPUS";
	margin-top: 20px;
	font-size: min(7.8125vw * var(--fontratio, 1), 100px * var(--fontratio, 1));
	font-family: "Jost", sans-serif;
}
@media screen and (max-width: 959px) {
	#ocpagetitle h1:after {
		font-size: min(9.756097561vw * var(--fontratio, 1), 80px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#ocpagetitle h1:after {
		font-size: min(10.1641873278vw * var(--fontratio, 1), 38.1157024793px * var(--fontratio, 1));
	}
}
#ocpagetitle .image {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
}
#ocpagetitle .image:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(94, 117, 134, 0.34);
	mix-blend-mode: multiply;
	z-index: 1;
}
@media screen and (max-width: 767px) {
	#ocpagetitle .image {
		height: auto;
		aspect-ratio: 1920 / 980;
	}
}
#ocpagetitle .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#octitle + #breadcrumbs,
#ocpagetitle + #breadcrumbs {
	padding-top: 20px;
}

.block1 h2, .block2 h2, .block3 h2, .block7 h2, .block8 h2 {
	position: relative;
	margin: 0px 0px min(70px, 5.46875vw);
	padding: 0px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	letter-spacing: 0.1em;
	font-family: "Marcellus", serif;
	text-transform: uppercase;
}
@media screen and (max-width: 959px) {
	.block1 h2, .block2 h2, .block3 h2, .block7 h2, .block8 h2 {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block1 h2, .block2 h2, .block3 h2, .block7 h2, .block8 h2 {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.block1 h2, .block2 h2, .block3 h2, .block7 h2, .block8 h2 {
		margin-bottom: 30px;
	}
}
.block1 h2 span, .block2 h2 span, .block3 h2 span, .block7 h2 span, .block8 h2 span {
	padding-bottom: 5px;
	border-bottom: 1px solid #0077B6;
}

.block1 {
	position: relative;
	margin-top: 100vh;
	background: #fff;
	z-index: 10;
}
@media screen and (max-width: 767px) {
	.block1 {
		margin-top: 350px;
	}
}
.block1 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block1 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block1 > div {
		padding: 60px 15px;
	}
}
.block1 .list {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.block1 .list {
		gap: 20px;
	}
}
.block1 .list > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.block1 .list > div {
		width: calc((100% - 20px) / 2);
	}
	.block1 .list > div:nth-child(1), .block1 .list > div:nth-child(2) {
		width: 100%;
	}
	.block1 .list > div:nth-child(1) a .title, .block1 .list > div:nth-child(2) a .title {
		margin-bottom: 20px;
		font-size: min(4vw * var(--fontratio, 1), 15px * var(--fontratio, 1));
	}
}
.block1 .list a {
	display: flex;
	flex-direction: column;
	padding: min(29px, 2.265625vw) min(19px, 1.484375vw);
	height: 100%;
	color: #1A1311;
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 767px) {
	.block1 .list a {
		padding: 14px 9px 19px;
	}
}
.block1 .list a .title {
	margin-bottom: min(20px, 1.5625vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 500;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block1 .list a .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block1 .list a .title {
		font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block1 .list a .title {
		margin-bottom: 10px;
	}
}
.block1 .list a .title span {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.block1 .list a .title span {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block1 .list a .title span {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.block1 .list a .image {
	margin-bottom: min(30px, 2.34375vw);
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.block1 .list a .image {
		margin-bottom: 20px;
	}
}
.block1 .list a .image img {
	display: block;
	width: 100%;
	transition: transform 400ms;
}
.block1 .list a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin-top: auto;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block1 .list a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block1 .list a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block1 .list a .more {
		height: 24px;
	}
}
.block1 .list a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block1 .list a .more:after {
		width: 24px;
		height: 24px;
	}
}
.block1 .list a .more span {
	position: relative;
	display: inline-block;
}
.block1 .list a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block1 .list a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block1 .list a:hover .image img {
	transform: scale(1.1);
}
.block1 .list a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block1 .list a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

.block2 {
	position: relative;
	background: #fff;
}
.block2:before {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 250px;
	top: 0;
	left: 50%;
	background: linear-gradient(to bottom, #ecf4f8 0%, rgba(236, 244, 248, 0) 100%);
	transform: translateX(-50%);
	z-index: 0;
}
.library .block2:before {
	display: none;
}
.block2:after {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 0%;
	top: 0;
	left: 50%;
	background: linear-gradient(to bottom, #ecf4f8 90%, rgba(236, 244, 248, 0) 100%);
	transform: translateX(-50%);
	z-index: 0;
	opacity: 0;
}
.library .block2:after {
	display: none;
}
.block2.focus:after {
	height: 100%;
	opacity: 1;
	transition: height 1200ms, opacity 1200ms;
}
.block2 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 60px 40px 120px;
	z-index: 5;
}
@media screen and (max-width: 959px) {
	.block2 > div {
		padding: 30px 20px 60px;
	}
}
@media screen and (max-width: 767px) {
	.block2 > div {
		padding: 30px 15px 60px;
	}
}
.block2 .heading {
	margin-bottom: 50px;
	font-size: min(7.03125vw * var(--fontratio, 1), 90px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #A8BDCC;
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	.block2 .heading {
		font-size: min(8.7804878049vw * var(--fontratio, 1), 72px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .heading {
		font-size: min(9.7542699725vw * var(--fontratio, 1), 36.5785123967px * var(--fontratio, 1));
	}
}
.block2 .heading span + span {
	margin-left: 0.1em;
}
.block2 .heading .small {
	font-size: min(4.6875vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.block2 .heading .small {
		font-size: min(5.8536585366vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .heading .small {
		font-size: min(7.8898071625vw * var(--fontratio, 1), 29.5867768595px * var(--fontratio, 1));
	}
}
.block2 .heading.popup span {
	transition: 600ms;
}
.block2 .heading.popup span:nth-child(0) {
	transition-delay: 0ms;
}
.block2 .heading.popup span:nth-child(1) {
	transition-delay: 80ms;
}
.block2 .heading.popup span:nth-child(2) {
	transition-delay: 160ms;
}
.block2 .heading.popup span:nth-child(3) {
	transition-delay: 240ms;
}
.block2 .heading.popup span:nth-child(4) {
	transition-delay: 320ms;
}
.block2 .heading.popup span:nth-child(5) {
	transition-delay: 400ms;
}
.block2 .heading.popup span:nth-child(6) {
	transition-delay: 480ms;
}
.block2 .heading.popup span:nth-child(7) {
	transition-delay: 560ms;
}
.block2 .heading.popup span:nth-child(8) {
	transition-delay: 640ms;
}
.block2 .heading.popup span:nth-child(9) {
	transition-delay: 720ms;
}
.block2 .heading.popup span:nth-child(10) {
	transition-delay: 800ms;
}
.block2 .heading.popup span:nth-child(11) {
	transition-delay: 880ms;
}
.block2 .heading.popup span:nth-child(12) {
	transition-delay: 960ms;
}
.block2 .heading.popup span:nth-child(13) {
	transition-delay: 1040ms;
}
.block2 .heading.popup span:nth-child(14) {
	transition-delay: 1120ms;
}
.block2 .heading.popup span:nth-child(15) {
	transition-delay: 1200ms;
}
.block2 .heading.popup:not(.popon) span {
	filter: blur(5px);
	opacity: 0;
	transform: translateY(0.3em);
}
.block2 .heading span {
	display: inline-block;
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0);
}
.library .block2 h2 {
	margin-bottom: 40px;
}
.block2 .topcolumn {
	display: flex;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 959px) {
	.block2 .topcolumn {
		flex-direction: column;
		gap: 40px;
	}
}
.block2 .topcolumn .news {
	width: calc((100% - (min(40px, 40/1280*100vw) * 3)) / 4 * 3 + min(40px, 40/1280*100vw) *2);
}
@media screen and (max-width: 1279px) {
	.block2 .topcolumn .news {
		width: 100%;
	}
}
@media screen and (max-width: 959px) {
	.block2 .topcolumn .news {
		width: 100%;
	}
}
.block2 .topcolumn .events {
	width: calc((100% - (min(40px, 40/1280*100vw) * 3)) / 4);
}
@media screen and (max-width: 1279px) {
	.block2 .topcolumn .events {
		width: 290px;
		flex-shrink: 0;
	}
}
@media screen and (max-width: 959px) {
	.block2 .topcolumn .events {
		width: 100%;
	}
}
.block2 .head {
	display: flex;
	margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
	.block2 .head {
		margin-bottom: 20px;
	}
}
.block2 .head .more {
	margin-top: 0px;
	margin-right: 0px;
	margin-left: auto;
}
.block2 .more a {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block2 .more a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .more a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .more a {
		height: 24px;
	}
}
.block2 .more a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100% auto;
}
@media screen and (max-width: 767px) {
	.block2 .more a:after {
		width: 24px;
		height: 24px;
	}
}
.block2 .more a span {
	position: relative;
	display: inline-block;
}
.block2 .more a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block2 .more a span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block2 .more a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block2 .more a:hover span:after {
	animation: wheel ease-in-out 600ms;
}
.block2 .newscategory ul {
	display: flex;
	gap: 1px;
}
@media screen and (max-width: 767px) {
	.block2 .newscategory ul {
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
		padding: 10px;
		background: #fff;
		border: 1px solid #CDD6DD;
	}
}
.block2 .newscategory ul li {
	min-width: 100px;
}
@media screen and (max-width: 1279px) {
	.block2 .newscategory ul li {
		min-width: 0px;
	}
}
@media screen and (max-width: 767px) {
	.block2 .newscategory ul li {
		min-width: 80px;
	}
}
.block2 .newscategory ul a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0px 25px;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #1A1311;
	transition: opacity 0.2s, color 0.2s, background 0.2s;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.block2 .newscategory ul a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .newscategory ul a {
		font-size: min(2.9333333333vw * var(--fontratio, 1), 11px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.block2 .newscategory ul a {
		padding: 0px 15px;
	}
}
@media screen and (max-width: 767px) {
	.block2 .newscategory ul a {
		height: 18px;
		padding: 0px 5px;
	}
}
.block2 .newscategory ul a:after {
	content: "";
	display: none;
	position: absolute;
	left: 50%;
	top: 0px;
	width: 100%;
	height: 18px;
	background: #fff;
	border: 1px solid #CDD6DD;
	border-radius: 10px;
	z-index: -2;
	transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
	.block2 .newscategory ul a:after {
		display: block;
	}
}
.block2 .newscategory ul a:before {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	top: 1px;
	width: 0%;
	min-width: 32px;
	height: 32px;
	background: #0077B6;
	border-radius: 16px;
	z-index: -1;
	transform: translateX(-50%) scale(0);
	opacity: 0;
	transition: width 0ms 300ms, transform linear 0ms 300ms, opacity 300ms;
}
@media screen and (max-width: 767px) {
	.block2 .newscategory ul a:before {
		min-width: 18px;
		height: 18px;
	}
}
.block2 .newscategory ul a.on {
	color: #fff;
}
.block2 .newscategory ul a.on:before {
	width: 100%;
	opacity: 1;
	transform: translateX(-50%) scale(1);
	transition: width 400ms 100ms, transform linear 200ms, opacity 200ms;
}
.block2 .datelist:not(.important) {
	transition: opacity 500ms;
}
.block2 .datelist:not(.important).change {
	opacity: 0;
}
.block2 .datelist:not(.important) > ul > li {
	display: none;
}
.block2 .datelist:not(.important) > ul > li.show {
	display: block;
}
.block2 .datelist:not(.important) > ul > li > a {
	gap: 10px;
}
@media screen and (max-width: 767px) {
	.block2 .datelist:not(.important) > ul > li .image {
		display: block;
		width: 120px;
		margin-left: 0px;
	}
}
.block2 .keyword {
	margin-top: min(40px, 3.125vw);
	padding: min(25px, 1.953125vw) min(40px, 3.125vw) min(20px, 1.5625vw);
	background: #CDD6DD;
}
@media screen and (max-width: 767px) {
	.block2 .keyword {
		padding: 20px 10px;
	}
}
.block2 .keyword dl {
	display: flex;
	gap: 20px;
	align-items: center;
}
@media screen and (max-width: 1279px) {
	.block2 .keyword dl {
		gap: 15px;
	}
}
@media screen and (max-width: 767px) {
	.block2 .keyword dl {
		flex-direction: column;
	}
}
.block2 .keyword dl dt {
	width: 23.5294117647%;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #000;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block2 .keyword dl dt {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .keyword dl dt {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .keyword dl dt {
		width: 100%;
		text-align: center;
	}
}
.block2 .keyword dl dd {
	width: 84.1176470588%;
}
@media screen and (max-width: 767px) {
	.block2 .keyword dl dd {
		width: 100%;
	}
}
.block2 .keyword dl dd ul {
	display: flex;
	justify-content: center;
	gap: min(60px, 4.6875vw);
}
@media screen and (max-width: 1279px) {
	.block2 .keyword dl dd ul {
		gap: min(25px, 1.953125vw);
	}
}
@media screen and (max-width: 767px) {
	.block2 .keyword dl dd ul {
		gap: 20px;
		justify-content: center;
	}
}
.block2 .keyword a {
	position: relative;
	display: block;
	padding-top: 65px;
	min-width: 60px;
	text-align: center;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #000;
	background: none no-repeat top center;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.block2 .keyword a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .keyword a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.block2 .keyword a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 1279px) {
	.block2 .keyword a {
		padding-top: 55px;
		min-width: 50px;
		background-size: 100%;
	}
}
.block2 .keyword .a a {
	background-image: url(../images/a.svg);
}
.block2 .keyword .b a {
	background-image: url(../images/b.svg);
}
.block2 .keyword .c a {
	background-image: url(../images/c.svg);
}
.block2 .keyword .d a {
	background-image: url(../images/d.svg);
}
.block2 .keyword .e a {
	background-image: url(../images/e.svg);
}
.block2 .eventlist > ul {
	width: 100%;
	border-top: 1px solid #CDD6DD;
}
.block2 .eventlist > ul > li {
	display: block;
	padding: 20px 0px;
	border-bottom: 1px solid #CDD6DD;
}
.block2 .eventlist > ul > li a {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0 10px;
	position: relative;
}
.block2 .eventlist > ul > li a:hover .title:before {
	bottom: -2px;
	opacity: 1;
	transform: scale(1);
	transition: opacity 200ms, transform 400ms, bottom 0ms;
}
.block2 .eventlist > ul > li a:hover .image img {
	transform: scale(1.15);
}
.block2 .eventlist > ul > li .image {
	margin-bottom: 10px;
	overflow: hidden;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .image {
		width: 160px;
		margin-bottom: 0px;
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .image {
		width: 120px;
	}
}
.block2 .eventlist > ul > li .image img {
	transition: transform 400ms;
}
.block2 .eventlist > ul > li .date {
	display: flex;
	flex-direction: column;
	width: 55px;
	background: #0077B6;
}
.block2 .eventlist > ul > li .date .day {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	height: 25px;
	font-size: min(1.015625vw * var(--fontratio, 1), 13px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #fff;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .date .day {
		font-size: min(1.2682926829vw * var(--fontratio, 1), 10.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .date .day {
		font-size: min(4.5333333333vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .date .month {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 25px;
	font-size: min(0.703125vw * var(--fontratio, 1), 9px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .date .month {
		font-size: min(0.8780487805vw * var(--fontratio, 1), 7.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .date .month {
		font-size: min(2.5352286501vw * var(--fontratio, 1), 9.507107438px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .date .week {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: auto;
	margin-bottom: 0;
	height: 16px;
	font-size: min(0.703125vw * var(--fontratio, 1), 9px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	background: #A8BDCC;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .date .week {
		font-size: min(0.8780487805vw * var(--fontratio, 1), 7.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .date .week {
		font-size: min(2.5352286501vw * var(--fontratio, 1), 9.507107438px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .image + .title {
	max-width: 100%;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .image + .title {
		max-width: calc(100% - 170px);
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .image + .title {
		max-width: calc(100% - 130px);
	}
}
.block2 .eventlist > ul > li .title {
	position: relative;
	display: inline-block;
	max-width: calc(100% - 65px);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .title {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.library .block2 .eventlist > ul > li .title {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	font-family: "Noto Sans JP", sans-serif;
}
@media screen and (max-width: 959px) {
	.library .block2 .eventlist > ul > li .title {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library .block2 .eventlist > ul > li .title {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .title span {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .title span {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .title span {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .title:before {
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	left: 0px;
	width: 100%;
	height: 1px;
	background: #1A1311;
	opacity: 0;
	transform-origin: left;
	transition: opacity 400ms, transform 0ms 400ms, bottom 400ms;
	transform: scale(0);
}
.block2 .eventlist > ul > li .info {
	margin-top: 10px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #1A1311;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .info {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .info {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .schedule {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: 24px;
	padding-left: 24px;
	margin-top: 20px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #7D8E9E;
	background: url(../images/schedule.svg) no-repeat left center;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .schedule {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .schedule {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
.library .block2 .eventlist > ul > li .schedule {
	margin-top: 10px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
}
@media screen and (max-width: 959px) {
	.library .block2 .eventlist > ul > li .schedule {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library .block2 .eventlist > ul > li .schedule {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.block2 .eventlist > ul > li .place {
	display: flex;
	align-items: center;
	width: 100%;
	padding-left: 24px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #7D8E9E;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .place {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .place {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.library .block2 .eventlist > ul > li .title + place {
	margin-top: 10px;
}
.block2 .eventlist > ul > li .tags {
	margin-top: 10px;
	width: 100%;
}
.block2 .eventlist > ul > li .tags ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.block2 .eventlist > ul > li .tags ul li {
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #7D8E9E;
}
@media screen and (max-width: 959px) {
	.block2 .eventlist > ul > li .tags ul li {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .eventlist > ul > li .tags ul li {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
.block2 .enchantelink {
	margin-top: 100px;
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink {
		margin-top: 40px;
	}
}
.block2 .enchantelink a {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: min(40px, 3.125vw);
	width: 100%;
	padding: min(20px, 1.5625vw) min(40px, 3.125vw);
	aspect-ratio: 1280 / 342;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink a {
		padding: 15px 20px;
		aspect-ratio: 360 / 130;
	}
}
.block2 .enchantelink a:hover .image img {
	transform: scale(1.1);
}
.block2 .enchantelink h2 {
	margin: 0;
	font-size: min(7.03125vw * var(--fontratio, 1), 90px * var(--fontratio, 1));
	line-height: 1;
	color: #fff;
	letter-spacing: 0;
}
@media screen and (max-width: 959px) {
	.block2 .enchantelink h2 {
		font-size: min(8.7804878049vw * var(--fontratio, 1), 72px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink h2 {
		font-size: min(9.7542699725vw * var(--fontratio, 1), 36.5785123967px * var(--fontratio, 1));
	}
}
.block2 .enchantelink h2 span + span {
	margin-left: 0.1em;
}
.block2 .enchantelink h2.popup span {
	transition: 600ms;
}
.block2 .enchantelink h2.popup span:nth-child(0) {
	transition-delay: 0ms;
}
.block2 .enchantelink h2.popup span:nth-child(1) {
	transition-delay: 80ms;
}
.block2 .enchantelink h2.popup span:nth-child(2) {
	transition-delay: 160ms;
}
.block2 .enchantelink h2.popup span:nth-child(3) {
	transition-delay: 240ms;
}
.block2 .enchantelink h2.popup span:nth-child(4) {
	transition-delay: 320ms;
}
.block2 .enchantelink h2.popup span:nth-child(5) {
	transition-delay: 400ms;
}
.block2 .enchantelink h2.popup span:nth-child(6) {
	transition-delay: 480ms;
}
.block2 .enchantelink h2.popup span:nth-child(7) {
	transition-delay: 560ms;
}
.block2 .enchantelink h2.popup span:nth-child(8) {
	transition-delay: 640ms;
}
.block2 .enchantelink h2.popup span:nth-child(9) {
	transition-delay: 720ms;
}
.block2 .enchantelink h2.popup span:nth-child(10) {
	transition-delay: 800ms;
}
.block2 .enchantelink h2.popup span:nth-child(11) {
	transition-delay: 880ms;
}
.block2 .enchantelink h2.popup span:nth-child(12) {
	transition-delay: 960ms;
}
.block2 .enchantelink h2.popup span:nth-child(13) {
	transition-delay: 1040ms;
}
.block2 .enchantelink h2.popup span:nth-child(14) {
	transition-delay: 1120ms;
}
.block2 .enchantelink h2.popup span:nth-child(15) {
	transition-delay: 1200ms;
}
.block2 .enchantelink h2.popup:not(.popon) span {
	filter: blur(5px);
	opacity: 0;
	transform: translateY(0.3em);
}
.block2 .enchantelink h2 span {
	display: inline-block;
	padding: 0;
	border: 0;
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0);
}
.block2 .enchantelink .image {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
	z-index: -1;
}
.block2 .enchantelink .image:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: url(../../images/ecover.webp) no-repeat top left;
	background-size: auto 100%;
	z-index: 2;
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink .image:before {
		background-position: top left 50%;
	}
}
.block2 .enchantelink .image:after {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	top: 0;
	left: 0;
	border: 1px solid #CDD6DD;
	z-index: 1;
}
.block2 .enchantelink .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 400ms;
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink .image img {
		object-position: right;
	}
}
.block2 .enchantelink p {
	margin-top: auto;
	margin-bottom: 0;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block2 .enchantelink p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.block2 .enchantelink .more {
	display: flex;
	align-items: center;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
}
@media screen and (max-width: 959px) {
	.block2 .enchantelink .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink .more {
		height: 24px;
	}
}
.block2 .enchantelink .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block2 .enchantelink .more:after {
		width: 24px;
		height: 24px;
	}
}
.block2 .enchantelink .more span {
	position: relative;
	display: inline-block;
}

.headdingarea {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 400px;
	padding: 0px;
	overflow: hidden;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.headdingarea {
		height: 350px;
	}
}
.headdingarea p {
	font-size: min(3.7vw, 60px);
	line-height: 1.5;
	font-weight: 400;
	color: #fff;
	font-family: "Marcellus", serif;
	letter-spacing: 0.2em;
}
@media screen and (max-width: 767px) {
	.headdingarea p {
		font-size: min(9vw, 60px);
		text-align: center;
	}
}
.headdingarea p.popup span {
	transition: 600ms;
}
.headdingarea p.popup span:nth-child(0) {
	transition-delay: 0ms;
}
.headdingarea p.popup span:nth-child(1) {
	transition-delay: 40ms;
}
.headdingarea p.popup span:nth-child(2) {
	transition-delay: 80ms;
}
.headdingarea p.popup span:nth-child(3) {
	transition-delay: 120ms;
}
.headdingarea p.popup span:nth-child(4) {
	transition-delay: 160ms;
}
.headdingarea p.popup span:nth-child(5) {
	transition-delay: 200ms;
}
.headdingarea p.popup span:nth-child(6) {
	transition-delay: 240ms;
}
.headdingarea p.popup span:nth-child(7) {
	transition-delay: 280ms;
}
.headdingarea p.popup span:nth-child(8) {
	transition-delay: 320ms;
}
.headdingarea p.popup span:nth-child(9) {
	transition-delay: 360ms;
}
.headdingarea p.popup span:nth-child(10) {
	transition-delay: 400ms;
}
.headdingarea p.popup span:nth-child(11) {
	transition-delay: 440ms;
}
.headdingarea p.popup span:nth-child(12) {
	transition-delay: 480ms;
}
.headdingarea p.popup span:nth-child(13) {
	transition-delay: 520ms;
}
.headdingarea p.popup span:nth-child(14) {
	transition-delay: 560ms;
}
.headdingarea p.popup span:nth-child(15) {
	transition-delay: 600ms;
}
.headdingarea p.popup span:nth-child(16) {
	transition-delay: 640ms;
}
.headdingarea p.popup span:nth-child(17) {
	transition-delay: 680ms;
}
.headdingarea p.popup span:nth-child(18) {
	transition-delay: 720ms;
}
.headdingarea p.popup span:nth-child(19) {
	transition-delay: 760ms;
}
.headdingarea p.popup span:nth-child(20) {
	transition-delay: 800ms;
}
.headdingarea p.popup span:nth-child(21) {
	transition-delay: 840ms;
}
.headdingarea p.popup span:nth-child(22) {
	transition-delay: 880ms;
}
.headdingarea p.popup span:nth-child(23) {
	transition-delay: 920ms;
}
.headdingarea p.popup span:nth-child(24) {
	transition-delay: 960ms;
}
.headdingarea p.popup span:nth-child(25) {
	transition-delay: 1000ms;
}
.headdingarea p.popup span:nth-child(26) {
	transition-delay: 1040ms;
}
.headdingarea p.popup span:nth-child(27) {
	transition-delay: 1080ms;
}
.headdingarea p.popup span:nth-child(28) {
	transition-delay: 1120ms;
}
.headdingarea p.popup span:nth-child(29) {
	transition-delay: 1160ms;
}
.headdingarea p.popup span:nth-child(30) {
	transition-delay: 1200ms;
}
.headdingarea p.popup span:nth-child(31) {
	transition-delay: 1240ms;
}
.headdingarea p.popup span:nth-child(32) {
	transition-delay: 1280ms;
}
.headdingarea p.popup span:nth-child(33) {
	transition-delay: 1320ms;
}
.headdingarea p.popup span:nth-child(34) {
	transition-delay: 1360ms;
}
.headdingarea p.popup span:nth-child(35) {
	transition-delay: 1400ms;
}
.headdingarea p.popup span:nth-child(36) {
	transition-delay: 1440ms;
}
.headdingarea p.popup span:nth-child(37) {
	transition-delay: 1480ms;
}
.headdingarea p.popup span:nth-child(38) {
	transition-delay: 1520ms;
}
.headdingarea p.popup span:nth-child(39) {
	transition-delay: 1560ms;
}
.headdingarea p.popup span:nth-child(40) {
	transition-delay: 1600ms;
}
.headdingarea p.popup:not(.popon) span {
	filter: blur(5px);
	opacity: 0;
	transform: translateY(0.3em);
}
.headdingarea p span {
	display: inline-block;
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0);
}
.headdingarea .bg {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.headdingarea .bg {
		transform: scale(1) !important;
	}
}
.headdingarea .bg img {
	position: absolute;
	display: block;
	width: 100%;
	height: 100vh;
	top: 50%;
	transform: translateY(-50%);
	object-fit: cover;
}
@media screen and (max-width: 767px) {
	.headdingarea .bg img {
		height: 350px;
	}
}

.block3 {
	position: relative;
	background: #fff;
}
.block3 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block3 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block3 > div {
		padding: 60px 15px;
	}
}
.block3 .topcolumn {
	display: flex;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 959px) {
	.block3 .topcolumn {
		gap: 10px;
	}
}
@media screen and (max-width: 767px) {
	.block3 .topcolumn {
		flex-direction: column;
	}
}
.block3 .topcolumn > div {
	flex: 1;
}
.block3 img {
	width: 100%;
}
.block3 p {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block3 p {
		font-size: min(1.3414634146vw * var(--fontratio, 1), 11px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block3 p {
		font-size: min(3.4666666667vw * var(--fontratio, 1), 13px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block3 p:last-child {
		margin-bottom: 30px;
	}
}
.block3 p.catch {
	margin-bottom: 50px;
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.block3 p.catch {
		font-size: min(3.1707317073vw * var(--fontratio, 1), 26px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block3 p.catch {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.block3 p.catch {
		margin-bottom: 35px;
	}
}
.block3 p + p {
	margin-top: 1em;
}
.block3 .more {
	margin-top: min(40px, 3.125vw);
}
.block3 .more a {
	display: flex;
	align-items: center;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block3 .more a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block3 .more a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block3 .more a {
		height: 24px;
	}
}
.block3 .more a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100% auto;
}
@media screen and (max-width: 767px) {
	.block3 .more a:after {
		width: 24px;
		height: 24px;
	}
}
.block3 .more a span {
	position: relative;
	display: inline-block;
}
.block3 .more a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block3 .more a span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block3 .more a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block3 .more a:hover span:after {
	animation: wheel ease-in-out 600ms;
}

.block4 {
	position: relative;
	background: #fff;
}
html[lang="en"] .block4 {
	margin-top: 100vh;
}
@media screen and (max-width: 767px) {
	html[lang="en"] .block4 {
		margin-top: 350px;
	}
}
.block4:before {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 250px;
	top: 0;
	left: 50%;
	background: linear-gradient(to bottom, #ecf4f8 0%, rgba(236, 244, 248, 0) 100%);
	transform: translateX(-50%);
	z-index: 0;
}
.block4:after {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 0%;
	top: 0;
	left: 50%;
	background: linear-gradient(to bottom, #ecf4f8 90%, rgba(236, 244, 248, 0) 100%);
	transform: translateX(-50%);
	z-index: 0;
	opacity: 0;
}
.block4.focus:after {
	height: 100%;
	opacity: 1;
	transition: height 1200ms, opacity 1200ms;
}
.block4 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 70px 40px 120px;
	z-index: 5;
}
@media screen and (max-width: 959px) {
	.block4 > div {
		padding: 35px 20px 60px;
	}
}
@media screen and (max-width: 767px) {
	.block4 > div {
		padding: 35px 15px 60px;
	}
}
.block4 .heading {
	margin-bottom: 60px;
	font-size: min(7.03125vw * var(--fontratio, 1), 90px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #A8BDCC;
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	.block4 .heading {
		font-size: min(8.7804878049vw * var(--fontratio, 1), 72px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .heading {
		font-size: min(9.7542699725vw * var(--fontratio, 1), 36.5785123967px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .heading {
		margin-bottom: 30px;
	}
}
.block4 .heading span + span {
	margin-left: 0.1em;
}
.block4 .heading.popup span {
	transition: 600ms;
}
.block4 .heading.popup span:nth-child(0) {
	transition-delay: 0ms;
}
.block4 .heading.popup span:nth-child(1) {
	transition-delay: 80ms;
}
.block4 .heading.popup span:nth-child(2) {
	transition-delay: 160ms;
}
.block4 .heading.popup span:nth-child(3) {
	transition-delay: 240ms;
}
.block4 .heading.popup span:nth-child(4) {
	transition-delay: 320ms;
}
.block4 .heading.popup span:nth-child(5) {
	transition-delay: 400ms;
}
.block4 .heading.popup span:nth-child(6) {
	transition-delay: 480ms;
}
.block4 .heading.popup span:nth-child(7) {
	transition-delay: 560ms;
}
.block4 .heading.popup span:nth-child(8) {
	transition-delay: 640ms;
}
.block4 .heading.popup span:nth-child(9) {
	transition-delay: 720ms;
}
.block4 .heading.popup span:nth-child(10) {
	transition-delay: 800ms;
}
.block4 .heading.popup span:nth-child(11) {
	transition-delay: 880ms;
}
.block4 .heading.popup span:nth-child(12) {
	transition-delay: 960ms;
}
.block4 .heading.popup span:nth-child(13) {
	transition-delay: 1040ms;
}
.block4 .heading.popup span:nth-child(14) {
	transition-delay: 1120ms;
}
.block4 .heading.popup span:nth-child(15) {
	transition-delay: 1200ms;
}
.block4 .heading.popup:not(.popon) span {
	filter: blur(5px);
	opacity: 0;
	transform: translateY(0.3em);
}
.block4 .heading span {
	display: inline-block;
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0);
}
.block4 .block {
	position: relative;
	display: flex;
	gap: 25px min(40px, 3.125vw);
	margin-bottom: 80px;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.block4 .block {
		flex-direction: column;
		margin-bottom: 40px;
	}
}
.block4 .block h2 {
	margin-bottom: min(40px, 3.125vw);
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block4 .block h2 {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block h2 {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block h2 {
		padding: 10px;
		text-align: center;
		color: #1A1311;
		background: #fff;
		border: 1px solid #CDD6DD;
	}
}
.block4 .block p {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block4 .block p {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block p {
		font-size: min(4vw * var(--fontratio, 1), 15px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block p {
		color: #1A1311;
		text-align: center;
	}
}
.block4 .block.reverse {
	flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
	.block4 .block.reverse {
		flex-direction: column;
	}
}
.block4 .block.reverse .bg {
	right: auto;
	left: calc(-300% - 120px + min(145px, 145/1280*100vw));
}
html[lang="en"] .block4 .block.reverse .bg {
	left: calc(-138% - 120px + min(145px, 145/1280*100vw));
}
.block4 .block.reverse .bg:after {
	right: auto;
	left: 0;
	background: linear-gradient(to left, #03082f 5%, rgba(3, 8, 47, 0) 70%);
}
.block4 .block.reverse .bg img {
	margin-right: auto;
	margin-left: 0;
	object-position: left;
}
.block4 .block .head {
	position: relative;
	flex-shrink: 0;
	align-self: flex-start;
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
	padding: min(40px, 3.125vw) 0;
	z-index: 0;
}
html[lang="en"] .block4 .block .head {
	width: calc((100% - min(40px, 40/1280*100vw) * 4) / 5 * 2 + min(40px, 40/1280*100vw));
}
@media screen and (max-width: 767px) {
	.block4 .block .head {
		width: 100% !important;
		padding: 0;
	}
}
.block4 .block .head .more {
	margin-top: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.block4 .block .head .more {
		margin-top: 20px;
	}
}
.block4 .block .head .more a {
	color: #fff;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.block4 .block .head .more a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.block4 .block .head .more a {
		justify-content: center;
		color: #0077B6;
	}
}
.block4 .block .head .more a span:before,
.block4 .block .head .more a span:after {
	display: none;
}
.block4 .block .bg {
	position: absolute;
	width: 100vw;
	height: 100%;
	top: 0;
	right: calc(-300% - 120px + min(145px, 145/1280*100vw));
	background: #03082F;
	z-index: -1;
}
html[lang="en"] .block4 .block .bg {
	right: calc(-138% - 120px + min(145px, 145/1280*100vw));
}
@media screen and (max-width: 767px) {
	.block4 .block .bg {
		display: none;
	}
}
.block4 .block .bg:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	right: 0;
	top: 0;
	backdrop-filter: blur(8px) brightness(0.9);
	z-index: 0;
}
.block4 .block .bg:after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	max-width: 1500px;
	height: 100%;
	right: 0;
	top: 0;
	background: linear-gradient(to right, #03082f 5%, rgba(3, 8, 47, 0) 70%);
	z-index: 1;
}
.block4 .block .bg img {
	width: 100%;
	max-width: 1455px;
	height: 100%;
	margin-right: 0;
	margin-left: auto;
	object-fit: cover;
	object-position: right;
}
.block4 .block .list {
	position: relative;
	display: flex;
	gap: 25px min(40px, 3.125vw);
	width: 100%;
	padding-top: min(70px, 5.46875vw);
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.block4 .block .list {
		flex-direction: column;
		padding: 0;
	}
}
.block4 .block .list > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 767px) {
	.block4 .block .list > div {
		width: 100%;
	}
}
.block4 .block .list a {
	display: flex;
	flex-direction: column;
	gap: min(20px, 1.5625vw) 10px;
	height: 100%;
	padding: min(19px, 1.484375vw);
	color: #1A1311;
	background: #fff;
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 767px) {
	.block4 .block .list a {
		flex-direction: row;
		padding: 0;
		background: transparent;
		border: 0;
	}
}
.block4 .block .list a .image {
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .image {
		flex-shrink: 0;
		height: 120px;
	}
}
.block4 .block .list a .image img {
	width: 100%;
	transition: transform 400ms;
	object-fit: cover;
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .image img {
		height: 100%;
	}
}
.block4 .block .list a .body {
	display: flex;
	flex-direction: column;
}
.block4 .block .list a .title {
	margin-bottom: min(10px, 0.78125vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block4 .block .list a .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .title {
		font-size: min(5.0666666667vw * var(--fontratio, 1), 19px * var(--fontratio, 1));
		font-weight: 600;
	}
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .title {
		margin-bottom: 10px;
	}
}
.block4 .block .list a .info {
	margin-bottom: min(20px, 1.5625vw);
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block4 .block .list a .info {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .info {
		font-size: min(2.9333333333vw * var(--fontratio, 1), 11px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .info {
		margin-bottom: 0px;
	}
}
.block4 .block .list a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin-top: auto;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block4 .block .list a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .more {
		height: 24px;
	}
}
.block4 .block .list a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block4 .block .list a .more:after {
		width: 24px;
		height: 24px;
	}
}
.block4 .block .list a .more span {
	position: relative;
	display: inline-block;
}
.block4 .block .list a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block4 .block .list a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block4 .block .list a:hover .image img {
	transform: scale(1.15);
}
.block4 .block .list a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block4 .block .list a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}
.block4 .more a {
	display: flex;
	align-items: center;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block4 .more a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .more a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block4 .more a {
		height: 24px;
	}
}
.block4 .more a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100% auto;
}
@media screen and (max-width: 767px) {
	.block4 .more a:after {
		width: 24px;
		height: 24px;
	}
}
.block4 .more a span {
	position: relative;
	display: inline-block;
}
.block4 .more a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block4 .more a span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block4 .more a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block4 .more a:hover span:after {
	animation: wheel ease-in-out 600ms;
}

.block5 {
	position: relative;
	z-index: 0;
	overflow-y: clip;
	border-bottom: 120px solid #fff;
}
@media screen and (max-width: 767px) {
	.block5 {
		border-bottom-width: 60px;
	}
}
.block5:before {
	content: "";
	display: block;
	position: absolute;
	width: 50vw;
	height: 100%;
	left: 0;
	top: 0;
	background: linear-gradient(to right, #03082f 0%, rgba(0, 0, 0, 0) 100%);
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block5:before {
		width: 100%;
	}
}
.block5 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 70px 40px 60px;
}
@media screen and (max-width: 959px) {
	.block5 > div {
		padding: 35px 20px 30px;
	}
}
@media screen and (max-width: 767px) {
	.block5 > div {
		padding: 35px 15px 30px;
	}
}
.block5 .heading {
	margin-bottom: min(70px, 5.46875vw);
	font-size: min(7.03125vw * var(--fontratio, 1), 90px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	.block5 .heading {
		font-size: min(8.7804878049vw * var(--fontratio, 1), 72px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block5 .heading {
		font-size: min(9.7542699725vw * var(--fontratio, 1), 36.5785123967px * var(--fontratio, 1));
	}
}
.block5 .heading span + span {
	margin-left: 0.1em;
}
.block5 .heading.popup span {
	transition: 600ms;
}
.block5 .heading.popup span:nth-child(0) {
	transition-delay: 0ms;
}
.block5 .heading.popup span:nth-child(1) {
	transition-delay: 80ms;
}
.block5 .heading.popup span:nth-child(2) {
	transition-delay: 160ms;
}
.block5 .heading.popup span:nth-child(3) {
	transition-delay: 240ms;
}
.block5 .heading.popup span:nth-child(4) {
	transition-delay: 320ms;
}
.block5 .heading.popup span:nth-child(5) {
	transition-delay: 400ms;
}
.block5 .heading.popup span:nth-child(6) {
	transition-delay: 480ms;
}
.block5 .heading.popup span:nth-child(7) {
	transition-delay: 560ms;
}
.block5 .heading.popup span:nth-child(8) {
	transition-delay: 640ms;
}
.block5 .heading.popup span:nth-child(9) {
	transition-delay: 720ms;
}
.block5 .heading.popup span:nth-child(10) {
	transition-delay: 800ms;
}
.block5 .heading.popup span:nth-child(11) {
	transition-delay: 880ms;
}
.block5 .heading.popup span:nth-child(12) {
	transition-delay: 960ms;
}
.block5 .heading.popup span:nth-child(13) {
	transition-delay: 1040ms;
}
.block5 .heading.popup span:nth-child(14) {
	transition-delay: 1120ms;
}
.block5 .heading.popup span:nth-child(15) {
	transition-delay: 1200ms;
}
.block5 .heading.popup:not(.popon) span {
	filter: blur(5px);
	opacity: 0;
	transform: translateY(0.3em);
}
.block5 .heading span {
	display: inline-block;
	opacity: 1;
	filter: blur(0px);
	transform: translateY(0);
}
.block5 .bg {
	position: absolute;
	top: 0%;
	left: 50%;
	width: 100vw;
	height: 100%;
	margin-left: -50vw;
	z-index: -2;
}
.block5 .bg img {
	position: absolute;
	display: block;
	width: 100%;
	height: 100vh;
	top: 50%;
	transform: translateY(-50%);
	object-fit: cover;
}
@media screen and (max-width: 767px) {
	.block5 .bg img {
		height: 100%;
		object-position: left;
	}
}
.block5 .list {
	position: relative;
	display: flex;
	gap: min(40px, 3.125vw);
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.block5 .list {
		gap: 10px;
	}
}
@media screen and (max-width: 767px) {
	.block5 .list {
		flex-direction: column;
		gap: 30px;
	}
}
.block5 .list > p {
	width: calc((100% - (min(40px, 40/1280*100vw) * 3)) / 4);
	font-size: min(1.640625vw * var(--fontratio, 1), 21px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block5 .list > p {
		font-size: min(1.8292682927vw * var(--fontratio, 1), 15px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block5 .list > p {
		font-size: min(4.0426666667vw * var(--fontratio, 1), 15.16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block5 .list > p {
		width: calc((100% - (10px * 3)) / 4);
	}
}
@media screen and (max-width: 767px) {
	.block5 .list > p {
		width: 100%;
	}
}
.block5 .list ul {
	display: flex;
	gap: 20px min(40px, 3.125vw);
	flex-wrap: wrap;
	width: calc(((100% - (min(40px, 40/1280*100vw) * 3)) / 4 * 3) + (min(40px, 40/1280*100vw) * 2));
}
@media screen and (max-width: 959px) {
	.block5 .list ul {
		gap: 10px;
		width: calc(((100% - (10px * 3)) / 4 * 3) + (10px * 2));
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul {
		gap: 0px;
		width: 100%;
		border-bottom: 1px solid #fff;
	}
}
.block5 .list ul li {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 959px) {
	.block5 .list ul li {
		width: calc((100% - 20px) / 3);
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul li {
		width: 100%;
		border-top: 1px solid #fff;
	}
}
.block5 .list ul a {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: min(20px, 1.5625vw);
	background: #fff;
	height: 100%;
}
@media screen and (max-width: 1279px) {
	.block5 .list ul a {
		gap: 15px;
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul a {
		flex-direction: row;
		align-items: center;
		gap: 5px;
		padding: 10px 0px;
		background: transparent;
	}
}
.block5 .list ul a .title {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block5 .list ul a .title {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul a .title {
		font-size: min(3.4666666667vw * var(--fontratio, 1), 13px * var(--fontratio, 1));
		color: #fff;
	}
}
.block5 .list ul a .info {
	margin-top: -10px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block5 .list ul a .info {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul a .info {
		font-size: min(2.6666666667vw * var(--fontratio, 1), 10px * var(--fontratio, 1));
		color: #fff;
	}
}
@media screen and (max-width: 1279px) {
	.block5 .list ul a .info {
		margin-top: -5px;
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul a .info {
		margin-top: 0px;
	}
}
.block5 .list ul a .more {
	display: flex;
	align-items: center;
	margin-top: auto;
	margin-bottom: 0px;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block5 .list ul a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul a .more {
		font-size: min(2.9333333333vw * var(--fontratio, 1), 11px * var(--fontratio, 1));
		color: #fff;
	}
}
@media screen and (max-width: 767px) {
	.block5 .list ul a .more {
		margin: auto 0px auto auto;
		height: 24px;
	}
}
.block5 .list ul a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block5 .list ul a .more:after {
		width: 24px;
		height: 24px;
		margin-left: 5px;
	}
}
.block5 .list ul a .more span {
	position: relative;
	display: inline-block;
}
.block5 .list ul a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block5 .list ul a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block5 .list ul a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block5 .list ul a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

.block7 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 120px 40px 0px;
}
@media screen and (max-width: 959px) {
	.block7 > div {
		padding: 60px 20px 0px;
	}
}
@media screen and (max-width: 767px) {
	.block7 > div {
		padding: 60px 15px 0px;
	}
}
.block7 h2 {
	margin-bottom: min(30px, 2.34375vw);
}
@media screen and (max-width: 767px) {
	.block7 h2 {
		margin-bottom: 20px;
	}
}
.block7 p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block7 p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.block7 .list {
	display: flex;
	gap: min(40px, 2.5vw);
	margin-top: min(60px, 4.6875vw);
}
@media screen and (max-width: 767px) {
	.block7 .list {
		flex-wrap: wrap;
		gap: 20px;
		margin-top: 30px;
	}
}
@media screen and (max-width: 767px) and (max-width: 767px) {
	.block7 .list {
		gap: 15px;
	}
}

.block7 .list > div {
	display: flex;
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.block7 .list > div {
		width: calc((100% - 15px) / 2);
	}
}
.block7 .list > div.l {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 2 + min(40px, 40/1600*100vw));
}
@media screen and (max-width: 767px) {
	.block7 .list > div.l {
		width: 100%;
	}
}
.block7 .list > div.l a .image {
	height: 100%;
}
.block7 .list > div.l a .image img {
	height: 100%;
	object-fit: cover;
}
.block7 .list > div.l a .title,
.block7 .list > div.l a .info {
	display: none;
}
.block7 .list > div.l a .more {
	position: absolute;
	right: 0px;
	bottom: 0px;
	color: #fff;
}
.block7 .list > div.l a .more span:before {
	background: #fff;
}
.block7 .list > div.l a .more span:after {
	display: none;
}
.block7 .list a {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	color: #1A1311;
}
.block7 .list a:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	border: 1px solid #CDD6DD;
	pointer-events: none;
	z-index: 10;
}
.block7 .list a .image {
	overflow: hidden;
}
.block7 .list a .image img {
	width: 100%;
	transition: transform 400ms;
}
.block7 .list a .title {
	padding: min(20px, 1.25vw) min(20px, 1.25vw) min(10px, 0.625vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block7 .list a .title {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .list a .title {
		font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .list a .title {
		padding: 15px 10px;
	}
}
.block7 .list a .info {
	padding: 0 min(20px, 1.25vw) min(20px, 1.25vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block7 .list a .info {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .list a .info {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .list a .info {
		display: none;
	}
}
.block7 .list a .more {
	display: flex;
	align-items: center;
	margin: auto min(20px, 1.25vw) min(20px, 1.25vw);
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block7 .list a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .list a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .list a .more {
		margin: auto 10px 10px 15px;
		height: 24px;
	}
}
.block7 .list a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block7 .list a .more:after {
		width: 24px;
		height: 24px;
	}
}
.block7 .list a .more span {
	position: relative;
	display: inline-block;
}
.block7 .list a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block7 .list a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block7 .list a:hover .image img {
	transform: scale(1.1);
}
.block7 .list a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block7 .list a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}
.block7 .button {
	margin-top: 50px;
}
.block7 .button a {
	display: flex;
	margin: auto;
	align-items: center;
	justify-content: center;
	padding: 5px 60px;
	width: min(330px, 25.78125vw);
	height: 44px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	background: url(../images/select.svg) no-repeat right 10px center #A8BDCC;
	border-radius: 22px;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.block7 .button a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block7 .button a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.block7 .button a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.block7 .button a {
		padding: 5px 30px 5px 10px;
		width: 200px;
		background-position: right center;
	}
}

.block8 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block8 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block8 > div {
		padding: 60px 15px;
	}
}
.block8 h2 {
	margin-bottom: min(30px, 2.34375vw);
}
@media screen and (max-width: 767px) {
	.block8 h2 {
		margin-bottom: 20px;
	}
}
.block8 p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block8 p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block8 p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.block8 .head {
	display: flex;
	align-items: center;
	margin-top: min(60px, 4.6875vw);
	margin-bottom: min(60px, 4.6875vw);
}
@media screen and (max-width: 767px) {
	.block8 .head {
		margin-top: 30px;
		margin-bottom: 30px;
	}
}
.block8 .head .more {
	margin-top: 0px;
	margin-right: 0px;
	margin-left: auto;
}
.block8 .more a {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block8 .more a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block8 .more a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block8 .more a {
		height: 24px;
	}
}
.block8 .more a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block8 .more a:after {
		width: 24px;
		height: 24px;
	}
}
.block8 .more a span {
	position: relative;
	display: inline-block;
}
.block8 .more a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block8 .more a span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block8 .more a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block8 .more a:hover span:after {
	animation: wheel ease-in-out 600ms;
}
.block8 .list {
	transition: opacity 500ms;
}
.block8 .list.change {
	opacity: 0;
}
.block8 .list ul {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 2.5vw);
}
@media screen and (max-width: 767px) {
	.block8 .list ul {
		gap: 20px;
	}
}
.block8 .list li {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.block8 .list li {
		width: calc((100% - 20px) / 2);
	}
}
.block8 .list a {
	position: relative;
	display: block;
	color: #1A1311;
}
.block8 .list a .image {
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.block8 .list a .image {
		border-radius: 0 25px 0 25px;
	}
}
.block8 .list a .image img {
	width: 100%;
	transition: transform 400ms;
}
.block8 .list a .date {
	display: flex;
	align-items: center;
	height: 32px;
	margin-top: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #7D8E9E;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block8 .list a .date {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block8 .list a .date {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block8 .list a .date {
		height: 22px;
	}
}
.block8 .list a .category {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 7.4285714286em;
	height: 32px;
	left: 8.5em;
	margin-top: -32px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
	border: 1px solid #0077B6;
	border-radius: 16px;
}
@media screen and (max-width: 959px) {
	.block8 .list a .category {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block8 .list a .category {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block8 .list a .category {
		left: 7.5em;
		height: 24px;
		margin-top: -24px;
	}
}
@media screen and (max-width: 767px) {
	.block8 .list a .category {
		min-width: 7em;
		left: 7em;
	}
}
.block8 .list a .title {
	margin-top: 10px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block8 .list a .title {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block8 .list a .title {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.block8 .list a:hover .image img {
	transform: scale(1.1);
}

.block9 .h2, .block10 .h2, .block11 .h2 {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: min(40px, 2.5vw);
	width: 18.75em;
	padding-top: min(115px, 7.1875vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.block9 .h2, .block10 .h2, .block11 .h2 {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .h2, .block10 .h2, .block11 .h2 {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .h2, .block10 .h2, .block11 .h2 {
		gap: 15px;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		padding-top: 60px;
	}
}
.block9 .h2:before, .block10 .h2:before, .block11 .h2:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	top: 0;
	background: url(../images/h2bg.webp) no-repeat center center;
	background-size: 100% auto;
	aspect-ratio: 450 / 390;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block9 .h2:before, .block10 .h2:before, .block11 .h2:before {
		width: 235px;
		left: 50%;
		margin-left: -117.5px;
	}
}
.block9 .h2 h2, .block10 .h2 h2, .block11 .h2 h2 {
	margin: 0px;
	padding: 0px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	text-align: center;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block9 .h2 h2, .block10 .h2 h2, .block11 .h2 h2 {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .h2 h2, .block10 .h2 h2, .block11 .h2 h2 {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.block9 .h2 h2:before, .block10 .h2 h2:before, .block11 .h2 h2:before {
	content: attr(data-en);
	display: block;
	margin-bottom: 10px;
	font-size: min(3.75vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Marcellus", serif;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
@media screen and (max-width: 959px) {
	.block9 .h2 h2:before, .block10 .h2 h2:before, .block11 .h2 h2:before {
		font-size: min(4.6829268293vw * var(--fontratio, 1), 38.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .h2 h2:before, .block10 .h2 h2:before, .block11 .h2 h2:before {
		font-size: min(6.8774435262vw * var(--fontratio, 1), 25.7904132231px * var(--fontratio, 1));
	}
}
.block9 .h2 p, .block10 .h2 p, .block11 .h2 p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block9 .h2 p, .block10 .h2 p, .block11 .h2 p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .h2 p, .block10 .h2 p, .block11 .h2 p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .h2 p, .block10 .h2 p, .block11 .h2 p {
		text-align: center;
	}
}

.block9 {
	position: relative;
}
.block9:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: linear-gradient(to bottom, rgba(1, 142, 252, 0.2) 0%, rgba(3, 168, 234, 0.2) 18.2%, rgba(47, 209, 216, 0.2) 39.9%, rgba(128, 233, 207, 0.2) 63.1%, rgba(255, 255, 255, 0.2) 87.7%, rgba(255, 255, 255, 0.2) 100%) no-repeat;
	background-size: 100% 100vh;
}
.block9 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 90px 40px 0px;
}
@media screen and (max-width: 959px) {
	.block9 > div {
		padding: 45px 20px 0px;
	}
}
@media screen and (max-width: 767px) {
	.block9 > div {
		padding: 45px 15px 0px;
	}
}
.block9 .list {
	position: relative;
	display: flex;
	gap: min(40px, 2.5vw);
	margin-top: min(80px, 5vw);
	z-index: 5;
}
@media screen and (max-width: 767px) {
	.block9 .list {
		flex-wrap: wrap;
		gap: 30px 20px;
		margin-top: 40px;
	}
}
.block9 .list > div {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.block9 .list > div {
		width: calc((100% - 20px) / 2);
	}
}
.block9 .list a {
	position: relative;
	display: block;
	color: #1A1311;
}
@media screen and (max-width: 767px) {
	.block9 .list a {
		max-width: 360px;
		margin: auto;
	}
}
.block9 .list a .image {
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
.block9 .list a .image img {
	width: 100%;
	transition: transform 400ms;
}
@media screen and (max-width: 767px) {
	.block9 .list a .image img {
		height: 168px;
		object-fit: cover;
	}
}
@media screen and (max-width: 767px) {
	.block9 .list a .image.top img {
		object-position: top;
	}
}
.block9 .list a .title {
	margin-top: min(20px, 1.25vw);
	margin-bottom: min(20px, 1.25vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block9 .list a .title {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .list a .title {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .list a .title {
		margin-top: 10px;
	}
}
.block9 .list a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin-top: auto;
	margin-bottom: 0;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block9 .list a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .list a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block9 .list a .more {
		height: 24px;
	}
}
.block9 .list a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block9 .list a .more:after {
		width: 24px;
		height: 24px;
	}
}
.block9 .list a .more span {
	position: relative;
	display: inline-block;
}
.block9 .list a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block9 .list a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block9 .list a:hover .image img {
	transform: scale(1.1);
}
.block9 .list a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block9 .list a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

.block10 > div {
	display: flex;
	flex-direction: row-reverse;
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 120px 40px 0px;
}
@media screen and (max-width: 959px) {
	.block10 > div {
		padding: 60px 20px 0px;
	}
}
@media screen and (max-width: 767px) {
	.block10 > div {
		padding: 60px 15px 0px;
	}
}
@media screen and (max-width: 767px) {
	.block10 > div {
		flex-direction: column;
		padding-bottom: 60px;
	}
}
.block10 .h2 {
	flex-shrink: 0;
	margin-left: 10px;
}
@media screen and (max-width: 767px) {
	.block10 .h2 {
		margin-left: auto;
		margin-bottom: 40px;
	}
}
.block10 .list {
	width: 100%;
}
.block10 .list ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0 min(18px, 1.125vw);
}
.block10 .list li {
	width: calc((100% - min(18px, 18/1600*100vw) *2) / 3);
	margin-top: -1px;
	border-top: 1px solid #CDD6DD;
	border-bottom: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.block10 .list li {
		width: calc((100% - min(18px, 18/1600*100vw)) / 2);
	}
}
@media screen and (max-width: 767px) {
	.block10 .list li {
		width: 100%;
	}
}
.block10 .list li.l {
	width: 100%;
	height: auto;
	margin-bottom: min(40px, 2.5vw);
	border: 0;
}
@media screen and (max-width: 767px) {
	.block10 .list li.l {
		margin-bottom: 30px;
	}
}
.block10 .list li.l span {
	position: absolute;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 10px min(60px, 3.75vw);
	z-index: 1;
	background: linear-gradient(210deg, rgba(0, 119, 182, 0) 50%, #0077b6 75%);
}
.block10 .list li.l a {
	justify-content: center;
	padding: 0px;
	height: auto;
	font-size: min(2.8125vw * var(--fontratio, 1), 36px * var(--fontratio, 1));
	color: #fff;
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
@media screen and (max-width: 959px) {
	.block10 .list li.l a {
		font-size: min(2.4390243902vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block10 .list li.l a {
		font-size: min(4.5333333333vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block10 .list li.l a {
		border-radius: 0 25px 0 25px;
	}
}
.block10 .list li.l a img {
	width: 100%;
	min-height: 100px;
	transition: transform 600ms;
	object-fit: cover;
}
.block10 .list li.l a:hover img {
	transform: scale(1.15);
}
.block10 .list a {
	position: relative;
	display: flex;
	align-items: center;
	height: 63px;
	padding: 5px 54px 5px 10px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block10 .list a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block10 .list a {
		font-size: min(4.5333333333vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	}
}
.block10 .list a:after {
	content: "";
	position: absolute;
	display: block;
	width: 34px;
	height: 34px;
	right: 10px;
	top: 50%;
	margin-top: -17px;
	background: url(../images/link.svg) no-repeat center center;
}
.block10 .list a span {
	position: relative;
	display: inline-block;
}
.block10 .list a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block10 .list a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms;
}

@media screen and (max-width: 767px) {
	.block11 {
		position: relative;
	}
	.block11:before {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: linear-gradient(to bottom, rgba(1, 142, 252, 0.2) 0%, rgba(3, 168, 234, 0.2) 18.2%, rgba(47, 209, 216, 0.2) 39.9%, rgba(128, 233, 207, 0.2) 63.1%, rgba(255, 255, 255, 0.2) 87.7%, rgba(255, 255, 255, 0.2) 100%) no-repeat;
		background-size: 100% 100vh;
	}
}
.block11 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 120px 40px 120px;
}
@media screen and (max-width: 959px) {
	.block11 > div {
		padding: 60px 20px 60px;
	}
}
@media screen and (max-width: 767px) {
	.block11 > div {
		padding: 60px 15px 60px;
	}
}
.block11 .h2 {
	z-index: -1;
}
.block11 h3 {
	margin-bottom: min(40px, 2.5vw);
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block11 h3 {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 h3 {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 h3 {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 57px;
		margin-bottom: 10px;
		background: #fff;
		border: 1px solid #CDD6DD;
		border-radius: 0 25px 0 25px;
	}
}
.block11 h3.alt {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100px;
	margin-bottom: min(20px, 1.25vw);
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.block11 h3.alt {
		font-size: min(2.1951219512vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 h3.alt {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block11 h3.alt {
		height: 65px;
	}
}
@media screen and (max-width: 767px) {
	.block11 h3.alt {
		height: 57px;
		margin-bottom: 10px;
	}
}
.block11 p {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block11 p {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 p {
		font-size: min(4vw * var(--fontratio, 1), 15px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 p {
		text-align: center;
	}
}
.block11 p.l {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block11 p.l {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 p.l {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.block11 .image {
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
.block11 .image img {
	width: 100%;
	transition: transform 400ms;
}
@media screen and (max-width: 767px) {
	.block11 .image img {
		max-height: 168px;
		object-fit: cover;
	}
}
.block11 .morel {
	margin-top: min(40px, 2.5vw);
}
@media screen and (max-width: 767px) {
	.block11 .morel {
		margin-top: 20px;
		text-align: center;
	}
}
.block11 .morel a {
	display: flex;
	align-items: center;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block11 .morel a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .morel a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .morel a {
		display: inline-flex;
		height: 24px;
	}
}
.block11 .morel a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block11 .morel a:after {
		width: 24px;
		height: 24px;
	}
}
.block11 .morel a span {
	position: relative;
	display: inline-block;
}
.block11 .morel a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block11 .morel a span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block11 .morel a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block11 .morel a:hover span:after {
	animation: wheel ease-in-out 600ms;
}
.block11 .list {
	display: flex;
	gap: min(40px, 2.5vw);
	max-width: 1280px;
	margin: 80px auto 0;
}
@media screen and (max-width: 767px) {
	.block11 .list {
		flex-wrap: wrap;
		gap: 30px 20px;
		margin-top: 40px;
	}
}
.block11 .list > div {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.block11 .list > div {
		width: calc((100% - 20px) / 2);
	}
	.block11 .list > div:first-child {
		width: 100%;
	}
}
.block11 .list > div.size3 {
	display: flex;
	gap: min(40px, 2.5vw);
	flex-wrap: wrap;
	align-items: flex-start;
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4 * 3 + min(40px, 40/1600*100vw) * 2);
}
@media screen and (max-width: 767px) {
	.block11 .list > div.size3 {
		width: 100%;
		gap: 30px min(40px, 2.5vw);
	}
}
.block11 .list > div.size3 > a {
	width: calc((100% - min(40px, 40/1600*100vw) * 2) / 3);
	height: auto;
}
.block11 .list > div.size3 > a .title {
	margin-top: 0;
	margin-bottom: 10px;
}
.block11 .list > div > a {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	color: #1A1311;
}
.block11 .list > div > a .title {
	margin-top: min(20px, 1.25vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block11 .list > div > a .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .list > div > a .title {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .list > div > a .title {
		margin-top: 10px;
	}
}
.block11 .list > div > a .info {
	margin-top: 10px;
	margin-bottom: min(20px, 1.25vw);
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block11 .list > div > a .info {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .list > div > a .info {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.block11 .list > div > a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin-top: auto;
	margin-bottom: 0;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block11 .list > div > a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .list > div > a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .list > div > a .more {
		height: 24px;
	}
}
.block11 .list > div > a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block11 .list > div > a .more:after {
		width: 24px;
		height: 24px;
	}
}
.block11 .list > div > a .more span {
	position: relative;
	display: inline-block;
}
.block11 .list > div > a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block11 .list > div > a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.block11 .list > div > a:hover .image img {
	transform: scale(1.1);
}
.block11 .list > div > a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.block11 .list > div > a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}
.block11 .splist {
	width: 100%;
	max-width: 1280px;
	margin: 80px auto 0;
}
.block11 .splist ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px min(40px, 2.5vw);
}
.block11 .splist li {
	width: calc((100% - min(40px, 40/1600*100vw)) / 2);
}
@media screen and (max-width: 767px) {
	.block11 .splist li {
		width: 100%;
	}
}
.block11 .splist a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: min(2.8125vw * var(--fontratio, 1), 36px * var(--fontratio, 1));
	color: #fff;
	font-family: "Noto Serif JP", serif;
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
@media screen and (max-width: 959px) {
	.block11 .splist a {
		font-size: min(2.4390243902vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block11 .splist a {
		font-size: min(4.5333333333vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block11 .splist a {
		border-radius: 0 25px 0 25px;
	}
}
.block11 .splist a img {
	width: 100%;
	min-height: 100px;
	transition: transform 600ms;
	object-fit: cover;
}
.block11 .splist a span {
	position: absolute;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 10px min(50px, 3.125vw);
	z-index: 1;
	background: linear-gradient(210deg, rgba(0, 119, 182, 0) 10%, #0077b6 55%);
}
.block11 .splist a:hover img {
	transform: scale(1.15);
}

.block12 {
	position: relative;
	z-index: -5;
}
.block12:before {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 35%;
	width: min(2000px, 120vw);
	background: url(../images/titleicon.webp) no-repeat center bottom 120px;
	background-size: 100%;
	aspect-ratio: 1380 / 1167;
	transform: translateX(-50%);
	z-index: -2;
	pointer-events: none;
}
@media screen and (max-width: 959px) {
	.block12:before {
		left: 30%;
		bottom: -20%;
	}
}
@media screen and (max-width: 767px) {
	.block12:before {
		width: 275vw;
		height: 300px;
		left: 45%;
		top: 0;
		bottom: auto;
		background-position: center bottom;
		aspect-ratio: auto;
	}
}
.block12:after {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: calc(min(2000px, 120vw) - 100%);
	bottom: 100%;
	left: 0;
	background: #fff;
	z-index: -1;
	pointer-events: none;
}
.block12 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 120px 40px 200px;
	display: flex;
	gap: 24px min(40px, 2.5vw);
}
@media screen and (max-width: 959px) {
	.block12 > div {
		padding: 60px 20px 100px;
	}
}
@media screen and (max-width: 767px) {
	.block12 > div {
		padding: 60px 15px 100px;
	}
}
@media screen and (max-width: 767px) {
	.block12 > div {
		flex-direction: column;
		padding-bottom: 50px;
	}
}
.block12 .head {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
}
@media screen and (max-width: 959px) {
	.block12 .head {
		width: calc((100% - min(40px, 40/1600*100vw) * 2) / 3);
	}
}
@media screen and (max-width: 767px) {
	.block12 .head {
		width: 100%;
		text-align: center;
	}
}
.block12 .head h2 {
	margin-bottom: 20px;
	font-size: min(3.75vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	font-family: "Marcellus", serif;
	letter-spacing: 0.06em;
}
@media screen and (min-width: 1280px) {
	.block12 .head h2 {
		font-size: min(2.8571428571vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.block12 .head h2 {
		font-size: min(2.8125vw * var(--fontratio, 1), 36px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block12 .head h2 {
		font-size: min(4.6829268293vw * var(--fontratio, 1), 38.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block12 .head h2 {
		font-size: min(6.8774435262vw * var(--fontratio, 1), 25.7904132231px * var(--fontratio, 1));
	}
}
.block12 .head p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (min-width: 1280px) {
	.block12 .head p {
		font-size: min(1.4285714286vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.block12 .head p {
		font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block12 .head p {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block12 .head p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block12 .head .more {
		display: none;
	}
}
.block12 .head .more a {
	color: #fff;
}
.block12 .head .more a span:before {
	background: #fff;
}
.block12 .body {
	position: relative;
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4 * 3 + min(40px, 40/1600*100vw) * 2);
}
@media screen and (max-width: 959px) {
	.block12 .body {
		width: calc((100% - min(40px, 40/1600*100vw) * 2) / 3 * 2 + min(40px, 40/1600*100vw));
	}
}
@media screen and (max-width: 767px) {
	.block12 .body {
		width: 100%;
	}
}
.block12 .body .slidewrap ul {
	pointer-events: none;
}
.block12 .body .slidewrap li:not(.swiper-slide-active ~ li):not(.swiper-slide-active) {
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}
@media screen and (max-width: 767px) {
	.block12 .body .slidewrap li:not(.swiper-slide-active ~ li):not(.swiper-slide-active) {
		opacity: 1;
		pointer-events: auto;
		visibility: visible;
	}
}
.block12 .body .slidewrap a {
	position: relative;
	display: block;
}
.block12 .body .slidewrap a img {
	width: 100%;
	transition: transform 600ms;
}
.block12 .body .slidewrap a:hover img {
	transform: scale(1.15);
}
.block12 .body .swiper-slide {
	width: min(250px, 15.625vw);
	margin-right: min(20px, 1.25vw);
	background: #fff;
	transition: opacity 600ms, visibility 600ms;
	pointer-events: auto;
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.block12 .body .swiper-slide {
		width: 250px;
		margin-left: 10px;
		margin-right: 10px;
	}
}
.block12 .body .switch {
	position: relative;
	padding-top: min(40px, 2.5vw);
}
@media screen and (max-width: 767px) {
	.block12 .body .switch {
		padding-top: 20px;
	}
}
.block12 .body .switch div {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
@media screen and (max-width: 767px) {
	.block12 .body .switch div {
		justify-content: center;
	}
}
.block12 .body .switch ul {
	display: flex;
	align-items: center;
	gap: 5px;
}
@media screen and (max-width: 767px) {
	.block12 .body .switch ul {
		gap: 10px;
	}
}
.block12 .body .switch ul a {
	display: block;
	width: 8px;
	height: 8px;
	text-indent: -10000px;
	background: #A8BDCC;
	border-radius: 50%;
	overflow: hidden;
	transition: opacity 0.2s, background 0.2s, background 600ms;
	cursor: pointer;
}
.block12 .body .switch ul a:hover {
	opacity: 0.7;
}
.block12 .body .switch ul .on a {
	background: #0077B6;
}
.block12 .body .switch ul li:first-child a {
	margin-right: 5px;
	width: 34px;
	height: 34px;
	background: url(../images/next.svg) no-repeat center center #0077B6;
	transform: rotate(-180deg);
}
.block12 .body .switch ul li:last-child a {
	margin-left: 5px;
	width: 34px;
	height: 34px;
	background: url(../images/next.svg) no-repeat center center #0077B6;
}
.block12 .body .more {
	display: none;
}
@media screen and (max-width: 767px) {
	.block12 .body .more {
		display: block;
	}
}
.block12 .more {
	margin-top: 20px;
}
@media screen and (max-width: 767px) {
	.block12 .more {
		text-align: center;
	}
}
.block12 .more a {
	display: flex;
	align-items: center;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.block12 .more a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block12 .more a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block12 .more a {
		display: inline-flex;
		height: 24px;
	}
}
.block12 .more a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.block12 .more a:after {
		width: 24px;
		height: 24px;
	}
}
.block12 .more a span {
	position: relative;
	display: inline-block;
}
.block12 .more a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.block12 .more a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 0ms;
}

.block13 h2, .block14 h2, .block15 h2, .block16 h2, .block17 h2, .block18 h2, .ocblock02 h2, .ocblock03 h2, .ocblock04 h2, .ocblock05 h2 {
	position: relative;
	margin: 0px 0px min(80px, 6.25vw);
	padding: 0px 0px min(40px, 3.125vw);
	font-size: min(10.9375vw * var(--fontratio, 1), 140px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Courgette", serif;
	text-align: center;
	-webkit-text-stroke: 3px #B2D6E9;
}
@media screen and (max-width: 959px) {
	.block13 h2, .block14 h2, .block15 h2, .block16 h2, .block17 h2, .block18 h2, .ocblock02 h2, .ocblock03 h2, .ocblock04 h2, .ocblock05 h2 {
		font-size: min(8.5365853659vw * var(--fontratio, 1), 70px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 h2, .block14 h2, .block15 h2, .block16 h2, .block17 h2, .block18 h2, .ocblock02 h2, .ocblock03 h2, .ocblock04 h2, .ocblock05 h2 {
		font-size: min(10.7460055096vw * var(--fontratio, 1), 40.2975206612px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.block13 h2, .block14 h2, .block15 h2, .block16 h2, .block17 h2, .block18 h2, .ocblock02 h2, .ocblock03 h2, .ocblock04 h2, .ocblock05 h2 {
		-webkit-text-stroke: 1.5px #B2D6E9;
	}
}
@media screen and (max-width: 767px) {
	.block13 h2, .block14 h2, .block15 h2, .block16 h2, .block17 h2, .block18 h2, .ocblock02 h2, .ocblock03 h2, .ocblock04 h2, .ocblock05 h2 {
		-webkit-text-stroke: 1px #B2D6E9;
	}
}
.block13 h2:before, .block14 h2:before, .block15 h2:before, .block16 h2:before, .block17 h2:before, .block18 h2:before, .ocblock02 h2:before, .ocblock03 h2:before, .ocblock04 h2:before, .ocblock05 h2:before {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 52px;
	height: 3px;
	margin-left: -26px;
	background: #0077B6;
	border-radius: 2px;
}

.block13 {
	position: relative;
	background: #fff;
}
.block13 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block13 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block13 > div {
		padding: 60px 15px;
	}
}
.block13 .list {
	position: relative;
	padding: min(80px, 6.25vw) min(50px, 3.90625vw);
	background: #C4E9F8;
	border-radius: 0 50px 0 50px;
}
.block13 .list .slidewrap {
	overflow-x: clip;
}
.block13 .list .slidewrap .past a:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #7D8E9E;
	mix-blend-mode: multiply;
	pointer-events: none;
	z-index: 10;
	border-radius: 0 50px 0 50px;
}
.block13 .list .slidewrap .next a:before {
	content: "直近の開催予定！";
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 80%;
	max-width: 240px;
	height: min(60px, 4.6875vw);
	top: -20px;
	left: 50%;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
	background: #0077B6;
	transform: translateX(-50%);
	z-index: 10;
	clip-path: polygon(0% 0%, 100% 0%, calc(100% - 13px) 50%, 100% 100%, 0% 100%, 13px 50%);
}
@media screen and (max-width: 959px) {
	.block13 .list .slidewrap .next a:before {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap .next a:before {
		font-size: min(3.2vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap .next a:before {
		top: -10px;
		height: 28px;
	}
}
.block13 .list .slidewrap a {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: min(80px, 6.25vw) 20px min(40px, 3.125vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	text-align: center;
	background: #fff;
	border-radius: 0 50px 0 50px;
}
@media screen and (max-width: 959px) {
	.block13 .list .slidewrap a {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap a {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap a {
		padding-top: 32px;
	}
}
.block13 .list .slidewrap a .date {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
	font-size: min(5.46875vw * var(--fontratio, 1), 70px * var(--fontratio, 1));
	font-family: "Marcellus", serif;
}
@media screen and (max-width: 959px) {
	.block13 .list .slidewrap a .date {
		font-size: min(6.8292682927vw * var(--fontratio, 1), 56px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap a .date {
		font-size: min(8.6170798898vw * var(--fontratio, 1), 32.3140495868px * var(--fontratio, 1));
	}
}
.block13 .list .slidewrap a .date span {
	font-size: min(2.34375vw * var(--fontratio, 1), 30px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.block13 .list .slidewrap a .date span {
		font-size: min(2.9268292683vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap a .date span {
		font-size: min(5.0732782369vw * var(--fontratio, 1), 19.0247933884px * var(--fontratio, 1));
	}
}
.block13 .list .slidewrap a .time {
	font-family: "Marcellus", serif;
}
.block13 .list .slidewrap a .more {
	position: relative;
	margin: auto;
	padding: 1px;
	width: 100%;
	max-width: 160px;
	border-radius: 20px / 50%;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	font-weight: 500;
	z-index: 0;
	overflow: hidden;
}
@media screen and (max-width: 959px) {
	.block13 .list .slidewrap a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .slidewrap a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.block13 .list .slidewrap a .more:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 2px);
	height: calc(100% - 2px);
	top: 0;
	left: 0;
	border: 1px solid #0077B6;
	border-radius: 20px / 50%;
	z-index: -2;
}
.block13 .list .slidewrap a .more:after {
	content: "";
	display: block;
	position: absolute;
	width: 51%;
	height: 0px;
	bottom: 50%;
	left: 50%;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: left center;
	transform: translateY(50%) rotate(-90deg);
	transition: 200ms;
	z-index: -1;
	opacity: 0;
}
.block13 .list .slidewrap a .more span {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 5px 15px;
	min-height: 38px;
	background: #fff;
	border-radius: 20px / 50%;
	z-index: 0;
}
.block13 .list .slidewrap a:hover .more:after {
	animation: buttonwheel cubic-bezier(1, 0.45, 0.01, 0.55) 1000ms;
}
.block13 .list .swiper-slide {
	width: calc((100% - min(40px, 40/1600*100vw) * 3) / 4);
	margin-right: min(40px, 2.5vw);
}
@media screen and (max-width: 959px) {
	.block13 .list .swiper-slide {
		width: calc((100% - min(40px, 40/1600*100vw) * 2) / 3);
	}
}
@media screen and (max-width: 767px) {
	.block13 .list .swiper-slide {
		width: calc((100% - min(40px, 40/1600*100vw)) / 2);
		min-width: 200px;
	}
}
.block13 .list .switch ul .prev {
	position: absolute;
	left: calc(min(50px, 50/1280*100vw) - 30px);
	top: calc(50% - 30px);
	z-index: 10;
}
@media screen and (max-width: 959px) {
	.block13 .list .switch ul .prev {
		left: calc(min(50px, 50/1280*100vw) - 22.5px);
		top: calc(50% - 22.5px);
	}
}
.block13 .list .switch ul .prev a {
	background: url(../images/arrow2.svg) no-repeat center center #0077B6;
	transform: rotate(-180deg);
}
.block13 .list .switch ul .next {
	position: absolute;
	right: calc(min(50px, 50/1280*100vw) - 30px);
	top: calc(50% - 30px);
	z-index: 10;
}
@media screen and (max-width: 959px) {
	.block13 .list .switch ul .next {
		right: calc(min(50px, 50/1280*100vw) - 22.5px);
		top: calc(50% - 22.5px);
	}
}
.block13 .list .switch ul .next a {
	background: url(../images/arrow2.svg) no-repeat center center #0077B6;
}
.block13 .list .switch ul a {
	display: block;
	width: 60px;
	height: 60px;
	text-indent: -10000px;
	background: #0077B6;
	border-radius: 50%;
	overflow: hidden;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.block13 .list .switch ul a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 959px) {
	.block13 .list .switch ul a {
		width: 45px;
		height: 45px;
	}
}

.block14 {
	position: relative;
	background: no-repeat center center;
	background-image: var(--bg);
	background-size: cover;
}
.block14:before {
	content: "";
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.3);
}
.block14 > div {
	position: relative;
	width: 100%;
	max-width: 1680px;
	margin: auto;
	padding: 100px 40px 240px;
}
@media screen and (max-width: 959px) {
	.block14 > div {
		padding: 50px 20px 120px;
	}
}
@media screen and (max-width: 767px) {
	.block14 > div {
		padding: 50px 15px 120px;
	}
}
.block14 h3 {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: min(40px, 3.125vw);
	margin: 0 auto min(80px, 6.25vw);
	max-width: 1200px;
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #03A8EA;
}
@media screen and (max-width: 959px) {
	.block14 h3 {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block14 h3 {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
.block14 h3 span {
	white-space: nowrap;
}
.block14 h3:before, .block14 h3:after {
	content: "";
	display: block;
	width: 50%;
	height: 10px;
	background: #03A8EA;
	border-radius: 5px;
}
.block14 h3.alt {
	margin-top: min(100px, 7.8125vw);
	color: #23AFB5;
}
.block14 h3.alt:before, .block14 h3.alt:after {
	background: #23AFB5;
}
.block14 .programlist {
	margin: auto;
	padding: min(40px, 3.125vw);
	max-width: 1200px;
	background: #fff;
	border: 10px solid #A8BDCC;
	border-radius: 0 50px 0 50px;
}
.block14 .block {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
	padding: min(80px, 6.25vw) 0 min(55px, 4.296875vw);
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.block14 .block {
		padding: 40px 0 30px;
	}
}
.block14 .block.reverse:before {
	left: auto;
	right: max(-160px, -12.5vw);
}
@media screen and (max-width: 767px) {
	.block14 .block.reverse:before {
		left: auto;
		right: -40px;
	}
}
.block14 .block.reverse:after {
	left: auto;
	right: calc(max(-160px, -160/1280*100vw) + 20px);
	background: #0077B6;
}
@media screen and (max-width: 767px) {
	.block14 .block.reverse:after {
		left: auto;
		right: -40px;
	}
}
.block14 .block.reverse h4 {
	text-align: right;
}
.block14 .block.reverse h4:before {
	left: auto;
	right: -20px;
	transform: rotateY(180deg);
}
.block14 .block:before {
	content: "";
	display: block;
	position: absolute;
	width: 200vw;
	height: 100%;
	top: 0;
	left: max(-160px, -12.5vw);
	background: #fff;
	border-radius: 200px;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block14 .block:before {
		left: -40px;
		border-radius: 100px;
	}
}
.block14 .block:after {
	content: "";
	display: block;
	position: absolute;
	width: 200vw;
	height: 100%;
	top: 20px;
	left: calc(max(-160px, -160/1280*100vw) + 20px);
	background: #23AFB5;
	border-radius: 200px;
	filter: blur(30px);
	z-index: -2;
}
@media screen and (max-width: 767px) {
	.block14 .block:after {
		left: -40px;
		border-radius: 100px;
	}
}
.block14 .block h4 {
	position: relative;
	margin-bottom: min(40px, 3.125vw);
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.block14 .block h4 {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block14 .block h4 {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
.block14 .block h4:before {
	content: "";
	display: block;
	position: absolute;
	width: 150px;
	height: 130px;
	left: -20px;
	top: calc(40% - 65px);
	background: url(../images/h2bg.webp) no-repeat left center;
	background-size: 100%;
	opacity: 0.2;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block14 .block h4:before {
		width: 100px;
		height: 87px;
		top: calc(40% - 43px);
	}
}
.block14 .list {
	display: flex;
	gap: 20px min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.block14 .list {
		flex-wrap: wrap;
		justify-content: center;
	}
}
.block14 .list > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 767px) {
	.block14 .list > div {
		width: calc((100% - min(40px, 40/1280*100vw)) / 2);
	}
}
.block14 .list .image {
	position: relative;
	padding: 0 10px 10px 0;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.block14 .list .image {
		padding: 0 5px 5px 0;
	}
}
.block14 .list .image img {
	width: 100%;
	border-radius: 0 50px 0 50px;
}
@media screen and (max-width: 767px) {
	.block14 .list .image img {
		border-radius: 0 25px 0 25px;
	}
}
.block14 .list .image:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	top: 10px;
	left: 10px;
	background: #C3F0F2;
	border-radius: 0 50px 0 50px;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block14 .list .image:before {
		width: calc(100% - 5px);
		height: calc(100% - 5px);
		top: 5px;
		left: 5px;
		border-radius: 0 25px 0 25px;
	}
}
.block14 .list .title {
	margin-top: 20px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.block14 .list .title {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block14 .list .title {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.block14 .list .info {
	margin-top: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block14 .list .info {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block14 .list .info {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}

.block15 {
	position: relative;
}
.block15 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block15 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block15 > div {
		padding: 60px 15px;
	}
}
.block15 p {
	margin-top: max(-40px, -3.125vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	text-align: center;
}
@media screen and (max-width: 959px) {
	.block15 p {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block15 p {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.block15 .list {
	position: relative;
	margin: min(40px, 31.25vw) auto 0;
	max-width: 900px;
	border-radius: 0 50px 0 50px;
}
@media screen and (max-width: 959px) {
	.block15 .list {
		max-width: 600px;
	}
}
@media screen and (max-width: 767px) {
	.block15 .list {
		max-width: 320px;
	}
}
.block15 .list .swiper-slide {
	width: 100%;
	margin-left: min(20px, 1.5625vw);
	margin-right: min(20px, 1.5625vw);
}
.block15 .list .swiper-slide img {
	width: 100%;
	border-radius: 0 50px 0 50px;
}
.block15 .list .switch ul .prev {
	position: absolute;
	left: -30px;
	top: calc(50% - 30px);
	z-index: 10;
}
@media screen and (max-width: 959px) {
	.block15 .list .switch ul .prev {
		left: -22.5px;
		top: calc(50% - 22.5px);
	}
}
.block15 .list .switch ul .prev a {
	background: url(../images/arrow2.svg) no-repeat center center #0077B6;
	transform: rotate(-180deg);
}
.block15 .list .switch ul .next {
	position: absolute;
	right: -30px;
	top: calc(50% - 30px);
	z-index: 10;
}
@media screen and (max-width: 959px) {
	.block15 .list .switch ul .next {
		right: -22.5px;
		top: calc(50% - 22.5px);
	}
}
.block15 .list .switch ul .next a {
	background: url(../images/arrow2.svg) no-repeat center center #0077B6;
}
.block15 .list .switch ul a {
	display: block;
	width: 60px;
	height: 60px;
	text-indent: -10000px;
	background: #0077B6;
	border-radius: 50%;
	overflow: hidden;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.block15 .list .switch ul a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 959px) {
	.block15 .list .switch ul a {
		width: 45px;
		height: 45px;
	}
}

.block16 {
	position: relative;
	background: #EDFAFF;
	z-index: 0;
}
.block16:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: linear-gradient(to bottom, #018efc 0%, #03a8ea 18.2%, #2fd1d8 39.9%, #80e9cf 63.1%, #fff 89.7%);
	opacity: 0.2;
	mix-blend-mode: multiply;
	z-index: -1;
}
.block16 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block16 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block16 > div {
		padding: 60px 15px;
	}
}
.block16 p {
	margin-top: max(-40px, -3.125vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	text-align: center;
}
@media screen and (max-width: 959px) {
	.block16 p {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block16 p {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.block16 .list {
	margin: min(40px, 31.25vw) auto 0;
}
.block16 .list ol {
	position: relative;
	display: flex;
	gap: min(40px, 3.125vw);
	counter-reset: number;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.block16 .list ol {
		flex-direction: column;
		overflow: hidden;
	}
}
.block16 .list ol li:nth-child(1) .image {
	position: relative;
}
.block16 .list ol li:nth-child(1) .image:before {
	content: "";
	display: block;
	position: absolute;
	width: 400%;
	height: 10px;
	top: calc(50% - 5px);
	left: 10%;
	background: #B2D6E9;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block16 .list ol li:nth-child(1) .image:before {
		display: none;
	}
}
.block16 .list ol li {
	position: relative;
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.block16 .list ol li {
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding-left: 120px;
		width: 100%;
		min-height: 100px;
	}
	.block16 .list ol li:after {
		content: "";
		display: block;
		position: absolute;
		width: 6px;
		height: 100px;
		top: -100px;
		left: 47px;
		background: #B2D6E9;
		z-index: -1;
	}
}
.block16 .list ol li:before {
	counter-increment: number;
	content: counter(number);
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	width: min(80px, 6.25vw);
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
	background: #0077B6;
	border-radius: 50%;
	aspect-ratio: 1 / 1;
	z-index: 1;
}
@media screen and (max-width: 959px) {
	.block16 .list ol li:before {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block16 .list ol li:before {
		font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block16 .list ol li:before {
		left: 0;
		top: 0;
		width: 30px;
	}
}
.block16 .list ol li .image img {
	width: 100%;
	border: 5px solid #B2D6E9;
	border-radius: 50%;
}
@media screen and (max-width: 767px) {
	.block16 .list ol li .image img {
		border: 3px solid #B2D6E9;
	}
}
@media screen and (max-width: 767px) {
	.block16 .list ol li .image {
		position: absolute !important;
		left: 0;
		width: 100px;
	}
}
.block16 .list ol li .text {
	margin-top: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block16 .list ol li .text {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block16 .list ol li .text {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block16 .list ol li .text {
		margin-top: 0;
	}
}
.block16 .list ol li .more {
	margin-top: 10px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.block16 .list ol li .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block16 .list ol li .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}

.block17 {
	position: relative;
	clip-path: inset(0);
}
.block17:before {
	content: "";
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: no-repeat top center fixed;
	background-image: var(--bg);
	background-size: cover;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.block17 {
		background-position: top right;
	}
}
.block17 > div {
	position: relative;
	width: 100%;
	max-width: 1040px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block17 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block17 > div {
		padding: 60px 15px;
	}
}
.block17 .list {
	position: relative;
	display: flex;
	flex-direction: column;
}
.block17 .list:after {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 6px);
	height: calc(min(100px, 100/1280*100vw) - 6px);
	bottom: 0;
	left: 0;
	border: 3px solid #0077B6;
	border-radius: min(50px, 3.90625vw);
	pointer-events: none;
	clip-path: polygon(0% 57%, 100% 57%, 100% 100%, 0% 100%);
}
@media screen and (max-width: 767px) {
	.block17 .list:after {
		width: calc(100% - 4px);
		height: calc(50px - 6px);
		border-width: 2px;
		border-radius: 25px;
	}
}
.block17 .list dt {
	position: relative;
	display: flex;
	align-items: center;
	padding: 10px min(100px, 7.8125vw) 10px 0;
	min-height: min(100px, 7.8125vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	background: #fff;
	border-radius: min(50px, 3.90625vw);
	cursor: pointer;
	user-select: none;
	transition: border-radius 400ms;
}
@media screen and (max-width: 959px) {
	.block17 .list dt {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dt {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dt {
		min-height: 50px;
	}
}
.block17 .list dt.open {
	border-radius: min(50px, 3.90625vw) min(50px, 3.90625vw) 0px 0px;
}
.block17 .list dt.open:before {
	top: 100%;
	opacity: 0;
}
.block17 .list dt:before {
	content: "";
	display: block;
	position: absolute;
	width: min(100px, 7.8125vw);
	height: 100%;
	top: 0%;
	right: 0;
	background: url(../images/bar.svg) no-repeat center center;
	transition: top 400ms, opacity 400ms;
	pointer-events: none;
	opacity: 1;
	transform: rotate(90deg);
}
@media screen and (max-width: 767px) {
	.block17 .list dt:before {
		background-size: 12px auto;
	}
}
.block17 .list dt:after {
	content: "";
	display: block;
	position: absolute;
	width: min(100px, 7.8125vw);
	height: 100%;
	top: 0%;
	right: 0;
	background: url(../images/bar.svg) no-repeat center center;
	pointer-events: none;
}
@media screen and (max-width: 767px) {
	.block17 .list dt:after {
		background-size: 12px auto;
	}
}
.block17 .list dt span {
	display: flex;
	justify-content: center;
	flex-shrink: 0;
	width: min(100px, 7.8125vw);
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	font-family: "Courgette", serif;
}
@media screen and (max-width: 959px) {
	.block17 .list dt span {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dt span {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
.block17 .list dt span:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 6px);
	height: calc(min(100px, 100/1280*100vw) - 6px);
	top: 0;
	left: 0;
	border: 3px solid #0077B6;
	border-radius: min(50px, 3.90625vw);
	pointer-events: none;
	clip-path: polygon(0% 0%, 100% 0%, 100% 43%, 0% 43%);
}
@media screen and (max-width: 767px) {
	.block17 .list dt span:before {
		width: calc(100% - 4px);
		height: calc(50px - 6px);
		border-width: 2px;
		border-radius: 25px;
	}
}
.block17 .list * + dt {
	margin-top: 25px;
}
.block17 .list * + dt span:after {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 6px);
	height: calc(min(100px, 100/1280*100vw) - 6px);
	bottom: calc(100% + 25px);
	left: 0;
	border: 3px solid #0077B6;
	border-radius: min(50px, 3.90625vw);
	pointer-events: none;
	clip-path: polygon(0% 57%, 100% 57%, 100% 100%, 0% 100%);
}
@media screen and (max-width: 767px) {
	.block17 .list * + dt span:after {
		width: calc(100% - 4px);
		height: calc(50px - 6px);
		border-width: 2px;
		border-radius: 25px;
	}
}
.block17 .list dd {
	position: relative;
	display: none;
	padding: 10px min(50px, 3.90625vw) min(40px, 3.125vw);
	background: #fff;
	border-radius: 0px 0px min(50px, 3.90625vw) min(50px, 3.90625vw);
}
.block17 .list dd:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.block17 .list dd:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block17 .list dd:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.block17 .list dd:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.block17 .list dd:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}

.block18 {
	position: relative;
	margin-bottom: 10px;
	background: #0077B6;
}
.block18 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.block18 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.block18 > div {
		padding: 60px 15px;
	}
}
.block18 h2:before {
	background: #fff;
}
.block18 .list {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
	margin-top: max(-40px, -3.125vw);
}
@media screen and (max-width: 767px) {
	.block18 .list {
		margin-top: 0px;
	}
}
.block18 .list > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 767px) {
	.block18 .list > div {
		width: calc((100% - min(40px, 40/1280*100vw) * 1) / 2);
	}
}
.block18 .list a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 10px min(60px, 4.6875vw);
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 500;
	color: #fff;
	aspect-ratio: 400 / 283;
	z-index: 0;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.block18 .list a {
		font-size: min(2.3170731707vw * var(--fontratio, 1), 19px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.block18 .list a {
		font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
.block18 .list a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.block18 .list a {
		padding: 10px 25px;
	}
}
.block18 .list a:before {
	content: "";
	display: block;
	position: absolute;
	width: min(60px, 4.6875vw);
	height: 100%;
	right: 0;
	top: 0;
	background: url(../images/arrow2.svg) no-repeat 5px center;
}
@media screen and (max-width: 767px) {
	.block18 .list a:before {
		width: 25px;
		background-size: 6px;
	}
}
.block18 .list a .image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	border-radius: 0 50px 0 50px;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.block18 .list a .image {
		border-radius: 0 25px 0 25px;
	}
}
.block18 .list a .image:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(125, 142, 158, 0.8);
	mix-blend-mode: multiply;
}
.block18 .list a .image:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	border: 3px solid #fff;
	z-index: 1;
	border-radius: 0 50px 0 50px;
	clip-path: polygon(0% 0%, 100% 0%, 100% 20%, 50% 27.5%, 100% 35%, 100% 100%, 0% 100%, 0% 80%, 50% 72.5%, 0% 65%);
}
@media screen and (max-width: 767px) {
	.block18 .list a .image:after {
		width: calc(100% - 4px);
		height: calc(100% - 4px);
		border-width: 2px;
		border-radius: 0 25px 0 25px;
	}
}
.block18 .list a .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.block18 .list a .title {
	text-align: center;
}
.block18 .list a .title span {
	display: inline-block;
}

.ocpastinfo {
	position: relative;
	background: #0077B6;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	text-align: center;
}
.ocpastinfo > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 40px 40px;
	margin-bottom: 60px;
}
@media screen and (max-width: 959px) {
	.ocpastinfo > div {
		padding: 26.6666666667px 20px;
	}
}
@media screen and (max-width: 767px) {
	.ocpastinfo > div {
		padding: 20px 15px;
	}
}
@media screen and (max-width: 959px) {
	.ocpastinfo > div {
		margin-bottom: 40px;
	}
}
@media screen and (max-width: 959px) {
	.ocpastinfo {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocpastinfo {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}

.ocblock01 {
	position: relative;
}
.ocblock01 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 0px 40px 90px;
}
@media screen and (max-width: 959px) {
	.ocblock01 > div {
		padding: 0px 20px 45px;
	}
}
@media screen and (max-width: 767px) {
	.ocblock01 > div {
		padding: 0px 15px 45px;
	}
}
.ocblock01:first-child {
	padding-top: 40px;
}
.ocblock01 ul {
	display: flex;
	justify-content: center;
	gap: min(40px, 3.125vw);
	flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
	.ocblock01 ul {
		gap: 10px;
	}
}
.ocblock01 li {
	min-width: calc((100% - min(40px, 40/1280*100vw) *3) / 4);
}
@media screen and (max-width: 767px) {
	.ocblock01 li {
		min-width: 0;
	}
}
.ocblock01 a {
	position: relative;
	display: flex;
	align-items: center;
	padding-right: 20px;
	padding-bottom: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
	border-bottom: 2px solid #0077B6;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.ocblock01 a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock01 a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.ocblock01 a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.ocblock01 a {
		padding-bottom: 10px;
	}
}
.ocblock01 a:before {
	content: "";
	display: block;
	position: absolute;
	width: 13px;
	height: 13px;
	right: 0;
	bottom: 22px;
	background: url(../images/arrow2.svg) no-repeat right center;
	background-size: auto 100%;
	transform: rotate(90deg);
	filter: brightness(0) saturate(100%) invert(32%) sepia(63%) saturate(1586%) hue-rotate(173deg) brightness(95%) contrast(103%);
}
@media screen and (max-width: 767px) {
	.ocblock01 a:before {
		bottom: 14px;
	}
}

.ocblock02 {
	position: relative;
	background: #EDFAFF;
}
.ocblock02 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.ocblock02 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 > div {
		padding: 60px 15px;
	}
}
.ocblock02 .start {
	max-width: 760px;
	margin: min(40px, 3.125vw) auto min(80px, 6.25vw);
	padding: min(40px, 3.125vw) 0;
	border-top: 1px solid #A8BDCC;
	border-bottom: 1px solid #A8BDCC;
}
.ocblock02 .start dl {
	display: flex;
	gap: 10px min(40px, 3.125vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.ocblock02 .start dl {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 .start dl {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 .start dl {
		flex-direction: column;
		align-items: center;
	}
}
.ocblock02 .start dl dt {
	position: absolute;
}
@media screen and (max-width: 767px) {
	.ocblock02 .start dl dt {
		position: relative;
	}
}
.ocblock02 .start dl dd {
	margin: auto;
	padding: 0 6em;
}
.ocblock02 .apply {
	display: flex;
	margin: min(40px, 3.125vw) auto min(40px, 3.125vw);
}
.ocblock02 .apply a {
	position: relative;
	display: block;
	margin: auto;
	padding: 3px;
	overflow: hidden;
	border-radius: 45px / 50%;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.ocblock02 .apply a {
		border-radius: 23px / 50%;
	}
}
.ocblock02 .apply a:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 6px);
	height: calc(100% - 6px);
	top: 0;
	left: 0;
	border: 3px solid #0077B6;
	border-radius: 45px / 50%;
	z-index: -2;
}
@media screen and (max-width: 767px) {
	.ocblock02 .apply a:before {
		border-radius: 23px / 50%;
	}
}
.ocblock02 .apply a:after {
	content: "";
	display: block;
	position: absolute;
	width: 51%;
	height: 0px;
	bottom: 50%;
	left: 50%;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: left center;
	transform: translateY(50%) rotate(-90deg);
	transition: 200ms;
	z-index: -1;
	opacity: 0;
}
.ocblock02 .apply a:hover:after {
	animation: buttonwheel cubic-bezier(1, 0.45, 0.01, 0.55) 1000ms;
}
.ocblock02 .apply a span {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 5px 65px 5px 40px;
	min-width: 446px;
	min-height: 79px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
	background: #fff;
	border-radius: 45px / 50%;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.ocblock02 .apply a span {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 .apply a span {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 .apply a span {
		padding: 5px 45px 5px 20px;
		min-width: 0;
		min-height: 40px;
		border-radius: 23px / 50%;
	}
}
.ocblock02 .apply a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 60px;
	height: 100%;
	left: auto;
	right: 0px;
	top: 0px;
	bottom: auto;
	background: url(../images/arrow2.svg) no-repeat 10px center;
	filter: brightness(0) saturate(100%) invert(32%) sepia(63%) saturate(1586%) hue-rotate(173deg) brightness(95%) contrast(103%);
}
@media screen and (max-width: 767px) {
	.ocblock02 .apply a span:before {
		width: 40px;
	}
}
.ocblock02 .line {
	display: flex;
	margin: 0 auto 20px;
}
.ocblock02 .line a {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: auto;
	min-width: 200px;
	height: 46px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #fff;
	background: #0077B6;
	border-radius: 23px;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.ocblock02 .line a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 .line a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.ocblock02 .line a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.ocblock02 .line a {
		min-width: 180px;
		height: 30px;
	}
}
.ocblock02 p {
	margin-top: max(-40px, -3.125vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	text-align: center;
}
@media screen and (max-width: 959px) {
	.ocblock02 p {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 p {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.ocblock02 p.small {
	margin-top: 0;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.ocblock02 p.small {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock02 p.small {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}

.ocblock03 {
	position: relative;
}
.ocblock03 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.ocblock03 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.ocblock03 > div {
		padding: 60px 15px;
	}
}
.ocblock03 .image {
	display: flex;
}
.ocblock03 .image div {
	margin: auto;
	padding: min(40px, 3.125vw);
	max-width: 1200px;
	background: #fff;
	border: 10px solid #A8BDCC;
	border-radius: 0 50px 0 50px;
}
.ocblock03 .image a {
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.ocblock03 .image a:hover {
	opacity: 0.7;
}

.ocblock04 {
	position: relative;
	background: #EDFAFF;
	z-index: 0;
}
.ocblock04:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: linear-gradient(to bottom, #018efc 0%, #03a8ea 18.2%, #2fd1d8 39.9%, #80e9cf 63.1%, #fff 89.7%);
	opacity: 0.2;
	mix-blend-mode: multiply;
	z-index: -1;
}
.ocblock04 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.ocblock04 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.ocblock04 > div {
		padding: 60px 15px;
	}
}
.ocblock04 .list {
	display: flex;
	flex-direction: column;
	gap: min(120px, 6.25vw);
	max-width: 990px;
	margin: auto;
}
.ocblock04 .list > div {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 0px min(40px, 2.0833333333vw);
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div {
		flex-direction: column;
	}
}
.ocblock04 .list > div:nth-child(even) {
	direction: rtl;
}
.ocblock04 .list > div:nth-child(even):before {
	right: auto;
	left: max(-150px, -11.71875vw);
}
.ocblock04 .list > div:nth-child(even) > * {
	direction: ltr;
}
.ocblock04 .list > div:before {
	content: "";
	display: block;
	position: absolute;
	right: max(-150px, -11.71875vw);
	top: 0;
	width: 200vw;
	height: min(210px, 21.2121212121vw);
	background: rgba(255, 255, 255, 0.4);
	border-radius: 0 80px 0 80px;
	z-index: -1;
}
.ocblock04 .list > div .image {
	position: relative;
	flex-shrink: 0;
	width: min(620px, 62.6262626263vw);
	padding: 0 20px 20px 0;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div .image {
		width: min(250px, 60%);
		padding: 0 5px 5px 0;
		margin: auto;
	}
}
.ocblock04 .list > div .image img {
	width: 100%;
	border-radius: 0 50px 0 50px;
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div .image img {
		border-radius: 0 25px 0 25px;
	}
}
.ocblock04 .list > div .image:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% - 20px);
	height: calc(100% - 20px);
	top: 20px;
	left: 20px;
	background: #B2D6E9;
	border-radius: 0 50px 0 50px;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div .image:before {
		width: calc(100% - 5px);
		height: calc(100% - 5px);
		top: 5px;
		left: 5px;
		border-radius: 0 25px 0 25px;
	}
}
.ocblock04 .list > div .body {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.ocblock04 .list > div h3 {
	margin-top: min(60px, 4.6875vw);
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 500;
}
@media screen and (max-width: 959px) {
	.ocblock04 .list > div h3 {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div h3 {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
.ocblock04 .list > div .schedule {
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.ocblock04 .list > div .schedule {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div .schedule {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.ocblock04 .list > div .info {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.ocblock04 .list > div .info {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock04 .list > div .info {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}

.ocblock05 {
	position: relative;
	z-index: 0;
}
.ocblock05:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: calc(100% - (120px + 0.5em));
	top: calc(120px + 0.5em);
	left: 0;
	font-size: min(10.9375vw * var(--fontratio, 1), 140px * var(--fontratio, 1));
	line-height: 1;
	background: linear-gradient(to bottom, #018efc 0%, #03a8ea 10%, #2fd1d8 21%, #80e9cf 35%, #fff 45%, #fff 50%, #80e9cf 65%, #2fd1d8 79%, #03a8ea 90%, #018efc 100%);
	opacity: 0.2;
	mix-blend-mode: multiply;
	z-index: -1;
}
@media screen and (max-width: 959px) {
	.ocblock05:before {
		font-size: min(8.5365853659vw * var(--fontratio, 1), 70px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05:before {
		font-size: min(10.7460055096vw * var(--fontratio, 1), 40.2975206612px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.ocblock05:before {
		top: calc(80px + 0.5em);
		height: calc(100% - (80px + 0.5em));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05:before {
		top: calc(60px + 0.5em);
		height: calc(100% - (60px + 0.5em));
	}
}
.ocblock05 > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px;
}
@media screen and (max-width: 959px) {
	.ocblock05 > div {
		padding: 80px 20px;
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 > div {
		padding: 60px 15px;
	}
}
.ocblock05 .coursetitle {
	margin-bottom: min(80px, 6.25vw);
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	text-align: center;
}
@media screen and (max-width: 959px) {
	.ocblock05 .coursetitle {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .coursetitle {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
.ocblock05 .navi ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.ocblock05 .navi ul {
		gap: 10px;
	}
}
.ocblock05 .navi li {
	min-width: calc((100% - min(40px, 40/1280*100vw) *3) / 4);
}
@media screen and (max-width: 767px) {
	.ocblock05 .navi li {
		min-width: 0;
	}
}
.ocblock05 .navi a {
	position: relative;
	display: flex;
	align-items: center;
	padding-bottom: 20px;
	padding-right: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
	border-bottom: 2px solid #0077B6;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.ocblock05 .navi a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .navi a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.ocblock05 .navi a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.ocblock05 .navi a {
		padding-bottom: 10px;
	}
}
.ocblock05 .navi a:before {
	content: "";
	display: block;
	position: absolute;
	width: 13px;
	height: 13px;
	right: 0;
	bottom: 22px;
	background: url(../images/arrow2.svg) no-repeat right center;
	background-size: auto 100%;
	transform: rotate(90deg);
	filter: brightness(0) saturate(100%) invert(32%) sepia(63%) saturate(1586%) hue-rotate(173deg) brightness(95%) contrast(103%);
}
@media screen and (max-width: 767px) {
	.ocblock05 .navi a:before {
		bottom: 14px;
	}
}
.ocblock05 .list + .list {
	margin-top: min(120px, 9.375vw);
}
.ocblock05 .list + .list:before {
	right: auto;
	left: calc(50% - 50vw + min(160px, 160/1920*100vw));
}
@media screen and (max-width: 1279px) {
	.ocblock05 .list + .list:before {
		left: -10px;
	}
}
.ocblock05 .list {
	position: relative;
	display: flex;
	flex-direction: column;
	max-width: 1045px;
	margin: min(80px, 6.25vw) auto 0;
	padding: min(120px, 9.375vw) 0;
	z-index: 0;
}
.ocblock05 .list:before {
	content: "";
	display: block;
	position: absolute;
	width: 200vw;
	height: 100%;
	right: calc(50% - 50vw + min(160px, 160/1920*100vw));
	top: 0;
	background: #fff;
	border-radius: 200px;
	z-index: -1;
}
@media screen and (max-width: 1279px) {
	.ocblock05 .list:before {
		right: -10px;
	}
}
@media screen and (max-width: 959px) {
	.ocblock05 .list:before {
		border-radius: 100px;
	}
}
.ocblock05 .list h3 {
	position: relative;
	display: flex;
	margin: 0 auto min(100px, 7.8125vw);
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 500;
	text-align: center;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.ocblock05 .list h3 {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h3 {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
.ocblock05 .list h3:before {
	content: "";
	display: block;
	position: absolute;
	width: 150px;
	height: 130px;
	left: -60px;
	top: calc(40% - 65px);
	background: url(../images/h2bg.webp) no-repeat left center;
	background-size: 100%;
	opacity: 0.2;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h3:before {
		width: 100px;
		height: 87px;
		top: calc(40% - 43px);
	}
}
.ocblock05 .list h4 {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0 0 20px;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #0077B6;
	font-family: "Noto Serif JP", serif;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.ocblock05 .list h4 {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h4 {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h4 {
		margin-left: 1.5em;
	}
}
.ocblock05 .list h4:before {
	content: "";
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
	left: max(-195px, -15.234375vw);
	top: 50%;
	margin-top: -10px;
	background: #fff;
	border: 2px solid #0077B6;
	border-radius: 50%;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h4:before {
		width: 12px;
		height: 12px;
		margin-top: -8px;
		left: calc(-1.5em - 22px);
	}
}
.ocblock05 .list h4:after {
	content: "";
	display: block;
	position: absolute;
	width: min(90px, 7.03125vw);
	height: 1px;
	left: max(-195px, -15.234375vw);
	top: 50%;
	margin-left: 10px;
	background: #A8BDCC;
	z-index: -2;
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h4:after {
		display: none;
	}
}
.ocblock05 .list h4 div {
	position: relative;
	margin-left: 1.5em;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.ocblock05 .list h4 div {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list h4 div {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.ocblock05 .list h4 div:before {
	content: "";
	display: block;
	position: absolute;
	width: 3.25em;
	height: 3.25em;
	left: 50%;
	top: 50%;
	background: #EDFAFF;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}
.ocblock05 .list p {
	margin-bottom: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.ocblock05 .list p {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list p {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.ocblock05 .list .image {
	display: flex;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.ocblock05 .list .image {
		gap: 10px;
	}
}
.ocblock05 .list .image img {
	max-width: min(100%, 60vw);
	overflow: hidden;
	border-radius: 10px;
}
.ocblock05 .list h4 + .image {
	margin-top: 40px;
}
.ocblock05 .list ol {
	display: flex;
	flex-direction: column;
	gap: min(100px, 7.8125vw);
	padding-left: min(195px, 15.234375vw);
	counter-reset: number;
}
@media screen and (max-width: 767px) {
	.ocblock05 .list ol {
		padding-left: 15px;
	}
}
.ocblock05 .list ol > li {
	position: relative;
	z-index: 0;
}
.ocblock05 .list ol > li:before {
	position: absolute;
	display: block;
	counter-increment: number;
	content: counter(number);
	padding-right: min(40px, 3.125vw);
	font-size: min(4.6875vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	font-family: "Marcellus", serif;
	text-align: right;
	top: -0.15em;
	right: 100%;
}
@media screen and (max-width: 959px) {
	.ocblock05 .list ol > li:before {
		font-size: min(5.8536585366vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list ol > li:before {
		font-size: min(7.8898071625vw * var(--fontratio, 1), 29.5867768595px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list ol > li:before {
		right: auto;
		left: 0;
		width: 0.5em;
	}
}
.ocblock05 .list ol > li:after {
	content: "";
	position: absolute;
	display: block;
	width: 10px;
	height: calc(100% + min(100px, 100/1280*100vw));
	margin-left: 5px;
	left: max(-195px, -15.234375vw);
	top: 0.65em;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	background: #B2D6E9;
	z-index: -1;
}
@media screen and (max-width: 959px) {
	.ocblock05 .list ol > li:after {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list ol > li:after {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock05 .list ol > li:after {
		width: 5px;
		left: -22px;
	}
}
.ocblock05 .list ol > li:last-child:after {
	display: none;
}

.ocblock06 {
	position: relative;
}
.ocblock06 > div {
	position: relative;
	width: 100%;
	max-width: 1060px;
	margin: auto;
	padding: 120px 40px 80px;
	display: flex;
	flex-direction: column;
}
@media screen and (max-width: 959px) {
	.ocblock06 > div {
		padding: 60px 20px 40px;
	}
}
@media screen and (max-width: 767px) {
	.ocblock06 > div {
		padding: 60px 15px 40px;
	}
}
.ocblock06 > div > p {
	margin-top: 25px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.ocblock06 > div > p {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock06 > div > p {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.ocblock06 h2 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 auto 40px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #23AFB5;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.ocblock06 h2 {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock06 h2 {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.ocblock06 h2:before {
	content: "";
	width: 1px;
	height: 1em;
	background: #23AFB5;
	transform: skew(35deg);
	transform-origin: bottom right;
}
.ocblock06 h2:after {
	content: "";
	width: 1px;
	height: 1em;
	background: #23AFB5;
	transform: skew(-35deg);
	transform-origin: bottom left;
}
.ocblock06 h3 {
	margin-bottom: 20px;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #23AFB5;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.ocblock06 h3 {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock06 h3 {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
.ocblock06 .block {
	display: flex;
	gap: min(40px, 3.125vw);
	align-items: center;
	justify-content: center;
}
.ocblock06 .block:has(> .text + .image) {
	justify-content: flex-end;
}
.ocblock06 .block .text p {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.ocblock06 .block .text p {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.ocblock06 .block .text p {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.ocblock06 .block .image {
	flex-shrink: 0;
	width: calc((100% - min(40px, 40/1280*100vw)) / 2);
}
@media screen and (max-width: 767px) {
	.ocblock06 .block .image {
		width: calc((100% - min(40px, 40/1280*100vw)) / 2.5);
	}
}

.contents {
	position: relative;
	z-index: 0;
}
.contents > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 120px 40px 120px;
}
@media screen and (max-width: 959px) {
	.contents > div {
		padding: 60px 20px 60px;
	}
}
@media screen and (max-width: 767px) {
	.contents > div {
		padding: 60px 15px 60px;
	}
}
.contents.stack > div {
	padding-top: 0;
}
.contents h2 {
	position: relative;
	margin: 0px 0px 40px;
	padding: 0px;
	font-size: min(2.734375vw * var(--fontratio, 1), 35px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contents h2 {
		font-size: min(3.4146341463vw * var(--fontratio, 1), 28px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents h2 {
		font-size: min(5.608815427vw * var(--fontratio, 1), 21.0330578512px * var(--fontratio, 1));
	}
}
.contents h2:last-child {
	margin-bottom: 0;
}
.contents h2.en {
	margin-bottom: clamp(40px, 5.46875vw, 70px);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	letter-spacing: 0.1em;
	font-family: "Marcellus", serif;
	text-transform: uppercase;
}
@media screen and (max-width: 959px) {
	.contents h2.en {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents h2.en {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents h2.en span {
	padding-bottom: 5px;
	border-bottom: 1px solid #0077B6;
}
.contents h2[data-en], .contents h2[data-enlarge] {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 30px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.contents h2[data-en], .contents h2[data-enlarge] {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents h2[data-en], .contents h2[data-enlarge] {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.contents h2[data-en]:before {
	content: attr(data-en);
	display: block;
	padding-bottom: 5px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Marcellus", serif;
	text-transform: uppercase;
	border-bottom: 1px solid #0077B6;
}
@media screen and (max-width: 959px) {
	.contents h2[data-en]:before {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents h2[data-en]:before {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents h2[data-enlarge]:before {
	content: attr(data-enlarge);
	display: block;
	font-size: min(4.765625vw * var(--fontratio, 1), 61px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #A8BDCC;
	font-family: "Marcellus", serif;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}
@media screen and (max-width: 959px) {
	.contents h2[data-enlarge]:before {
		font-size: min(5.9512195122vw * var(--fontratio, 1), 48.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents h2[data-enlarge]:before {
		font-size: min(7.9672947658vw * var(--fontratio, 1), 29.8773553719px * var(--fontratio, 1));
	}
}
.contents > div > h2:not(.en):not([data-en]), .contents .morecontents > .body > h2:not(.en):not([data-en]), .contents .text > h2:not(.en):not([data-en]) {
	padding-left: 10px;
	border-left: 10px solid #0077B6;
}
.library.collection .contents > div > h2:not(.en):not([data-en]),
.library.collection .contents .morecontents > .body > h2:not(.en):not([data-en]),
.library.collection .contents .text > h2:not(.en):not([data-en]) {
	border-left-color: #E4DC8A;
}
.contents * + h2 {
	margin-top: 120px;
}
.contents .teacherprofile h2, .contents .teacherfilter dt, .teacherfilter .contents dt, .contents .examfilter dt, .examfilter .contents dt, .contents h3 {
	position: relative;
	display: flex;
	align-items: center;
	gap: 20px;
	margin: 0px 0px 40px;
	padding: 0px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contents .teacherprofile h2, .contents .teacherfilter dt, .teacherfilter .contents dt, .contents .examfilter dt, .examfilter .contents dt, .contents h3 {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teacherprofile h2, .contents .teacherfilter dt, .teacherfilter .contents dt, .contents .examfilter dt, .examfilter .contents dt, .contents h3 {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.library.collection .contents .teacherprofile h2, .library.collection .contents .teacherfilter dt, .teacherfilter .library.collection .contents dt, .library.collection .contents .examfilter dt, .examfilter .library.collection .contents dt,
.library.collection .contents h3 {
	color: #1A1311;
	background: linear-gradient(to right, #e4dc8a 0%, #e4dc8a 60%, rgba(228, 220, 138, 0) 95%);
}
.library .contents .teacherprofile h2, .library .contents .teacherfilter dt, .teacherfilter .library .contents dt, .library .contents .examfilter dt, .examfilter .library .contents dt, .library .contents h3 {
	min-height: 70px;
	margin-bottom: 20px;
	padding: 5px 15% 7px 20px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(to right, #0077b6 0%, #0077b6 60%, rgba(0, 119, 182, 0) 95%);
}
@media screen and (max-width: 767px) {
	.library .contents .teacherprofile h2, .library .contents .teacherfilter dt, .teacherfilter .library .contents dt, .library .contents .examfilter dt, .examfilter .library .contents dt, .library .contents h3 {
		min-height: 50px;
	}
}
.contents .teacherprofile h2.course, .contents .teacherfilter dt.course, .teacherfilter .contents dt.course, .contents .examfilter dt.course, .examfilter .contents dt.course, .contents h3.course {
	padding: 10px 15px 0;
	font-size: min(2.34375vw * var(--fontratio, 1), 30px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.contents .teacherprofile h2.course, .contents .teacherfilter dt.course, .teacherfilter .contents dt.course, .contents .examfilter dt.course, .examfilter .contents dt.course, .contents h3.course {
		font-size: min(2.9268292683vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teacherprofile h2.course, .contents .teacherfilter dt.course, .teacherfilter .contents dt.course, .contents .examfilter dt.course, .examfilter .contents dt.course, .contents h3.course {
		font-size: min(5.0732782369vw * var(--fontratio, 1), 19.0247933884px * var(--fontratio, 1));
	}
}
.contents .teacherprofile h2.course:after, .contents .teacherfilter dt.course:after, .teacherfilter .contents dt.course:after, .contents .examfilter dt.course:after, .examfilter .contents dt.course:after, .contents h3.course:after {
	display: none;
}
.contents .teacherprofile h2:after, .contents .teacherfilter dt:after, .teacherfilter .contents dt:after, .contents .examfilter dt:after, .examfilter .contents dt:after, .contents h3:after {
	content: "";
	display: block;
	flex-grow: 1;
	width: max(40px, 0%);
	height: 1px;
	background: #CDD6DD;
}
.library .contents .teacherprofile h2:after, .library .contents .teacherfilter dt:after, .teacherfilter .library .contents dt:after, .library .contents .examfilter dt:after, .examfilter .library .contents dt:after, .library .contents h3:after {
	display: none;
}
.contents *:not(h1, h2) + h3 {
	margin-top: 120px;
}
.contents h4 {
	position: relative;
	margin: 0px 0px 20px;
	padding: 0px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contents h4 {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents h4 {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.library .contents h4 {
	display: flex;
	align-items: center;
	gap: 20px;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.library .contents h4 {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library .contents h4 {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.library .contents h4:after {
	content: "";
	display: block;
	flex-grow: 1;
	width: max(40px, 0%);
	height: 1px;
	background: #CDD6DD;
}
.contents h4 a {
	color: #0077B6;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.contents h4 a:hover {
	opacity: 0.7;
}
.contents *:not(h1, h2, h3) + h4 {
	margin-top: 80px;
}
.contents .stack {
	margin-top: 0px !important;
}
.contents .block {
	margin-top: 80px !important;
}
@media screen and (max-width: 767px) {
	.contents .block {
		margin-top: 60px !important;
	}
}
.contents .section {
	margin-top: 120px !important;
}
@media screen and (max-width: 767px) {
	.contents .section {
		margin-top: 90px !important;
	}
}
.contents .paragraph {
	margin-top: 20px !important;
}
.contents .halfparagraph {
	margin-top: 7px !important;
}
.contents .narrow {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	max-width: 950px;
}
.contents .lead {
	font-family: "Noto Serif JP", serif;
}
.contents .lead p {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
}
@media screen and (max-width: 959px) {
	.contents .lead p {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .lead p {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.contents .lead p.center {
	text-align: center;
}
.contents .lead p.small {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	font-weight: 500;
}
@media screen and (max-width: 959px) {
	.contents .lead p.small {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .lead p.small {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents > div:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents > div:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents > div:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents > div:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents > div:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents figure,
.contents .image {
	text-align: center;
}
@media screen and (max-width: 767px) {
	.contents figure.spsize,
	.contents .image.spsize {
		overflow-x: auto;
	}
	.contents figure.spsize img,
	.contents .image.spsize img {
		min-width: var(--spsize);
	}
}
.contents figure img,
.contents .image img {
	margin: auto;
}
.contents figure figcaption,
.contents figure p,
.contents .image figcaption,
.contents .image p {
	margin: min(20px, 1.5625vw) auto 0px;
	text-align: left;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
}
@media screen and (max-width: 959px) {
	.contents figure figcaption,
	.contents figure p,
	.contents .image figcaption,
	.contents .image p {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents figure figcaption,
	.contents figure p,
	.contents .image figcaption,
	.contents .image p {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
* + .contents figure figcaption, * +
.contents figure p, * +
.contents .image figcaption, * +
.contents .image p {
	margin-top: 8px;
}
.contents figure figcaption a,
.contents figure p a,
.contents .image figcaption a,
.contents .image p a {
	color: #0077B6;
	position: relative;
	display: inline-block;
}
.contents figure figcaption a:before,
.contents figure p a:before,
.contents .image figcaption a:before,
.contents .image p a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.15em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #000000;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents figure figcaption a:hover:before,
.contents figure p a:hover:before,
.contents .image figcaption a:hover:before,
.contents .image p a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.15em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents figure figcaption.center,
.contents figure p.center,
.contents .image figcaption.center,
.contents .image p.center {
	text-align: center;
}
.contents figure figcaption.center img,
.contents figure p.center img,
.contents .image figcaption.center img,
.contents .image p.center img {
	margin-left: auto;
}
.contents figure figcaption.right,
.contents figure p.right,
.contents .image figcaption.right,
.contents .image p.right {
	text-align: right;
}
.contents figure figcaption.right img,
.contents figure p.right img,
.contents .image figcaption.right img,
.contents .image p.right img {
	margin-left: auto;
	margin-right: 0;
}
.contents figure figcaption img,
.contents figure p img,
.contents .image figcaption img,
.contents .image p img {
	margin-left: 0;
}
.contents figure.left,
.contents .image.left {
	text-align: left;
}
.contents figure.left img,
.contents .image.left img {
	margin-left: 0px;
}
.contents figure.left p,
.contents .image.left p {
	margin-left: 0px;
}
.contents figure.right,
.contents .image.right {
	text-align: right;
}
.contents figure.right img,
.contents .image.right img {
	margin-right: 0px;
}
.contents figure.right p,
.contents .image.right p {
	margin-right: 0px;
}
.contents figure > a,
.contents .image > a {
	display: inline-block;
	max-width: 100%;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.contents figure > a:hover,
.contents .image > a:hover {
	opacity: 0.7;
}
.contents figure > a p,
.contents .image > a p {
	color: #000000;
}
.contents .imagebox {
	display: flex;
	justify-content: flex-start;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.contents .imagebox.spcol1 {
		flex-direction: column;
		gap: 20px;
	}
	.contents .imagebox.spcol1 > * {
		width: auto !important;
	}
	.contents .imagebox.spcol1 > .image > img,
	.contents .imagebox.spcol1 > .image > a {
		width: auto;
	}
}
.contents .imagebox > * {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-top: 0px !important;
}
.contents .imagebox > *:not(.image):not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .imagebox > *:not(.image):not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .imagebox > *:not(.image):not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .imagebox > *:not(.image):not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .imagebox > *:not(.image):not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .imagebox.center {
	align-items: center;
}
.contents .imagebox.reverse {
	direction: rtl;
}
.contents .imagebox.reverse > * {
	direction: ltr;
}
.contents .imagebox > .image {
	position: relative;
	flex-shrink: 0;
	width: auto;
	margin-bottom: auto;
}
@media screen and (max-width: 959px) {
	.contents .imagebox > .image {
		max-width: 50%;
	}
}
@media screen and (max-width: 767px) {
	.contents .imagebox > .image {
		max-width: 100%;
	}
}
.contents .imagebox > .image > img,
.contents .imagebox > .image > a {
	display: block;
	width: 100%;
}
.contents .column {
	display: flex;
	flex-wrap: wrap;
	gap: min(60px, 4.6875vw) min(40px, 3.125vw);
	margin-right: -4px;
}
@media screen and (max-width: 767px) {
	.contents .column {
		gap: 40px 20px;
	}
}
.contents .column > * {
	margin-top: 0px !important;
}
.contents .column > *:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .column > *:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .column > *:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .column > *:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .column > *:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .column > *.center {
	align-self: center;
}
.contents .column.col1 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 0 - 4px) / 1);
}
.contents .column.col1 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 0 - 4px) / 1) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col1 > *.size1 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 0 - 4px) / 1) * 1 + min(40px, 40/1280*100vw) * 0);
}
@media screen and (max-width: 767px) {
	.contents .column.col1 > * {
		width: calc((100% - 20px * 0 - 4px) / 1);
	}
	.contents .column.col1 > *.spsize2 {
		width: calc(((100% - 20px * 0 - 4px) / 1) * 2 + 20px * 1);
	}
	.contents .column.col1 > *.spsize1 {
		width: calc(((100% - 20px * 0 - 4px) / 1) * 1 + 20px * 0);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol1 > * {
		width: calc((100% - 20px * 0 - 4px) / 1) !important;
	}
}
.contents .column.col2 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 1 - 4px) / 2);
}
.contents .column.col2 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 1 - 4px) / 2) * 2 + min(40px, 40/1280*100vw) * 1);
}
@media screen and (max-width: 767px) {
	.contents .column.col2 > * {
		width: calc((100% - 20px * 1 - 4px) / 2);
	}
	.contents .column.col2 > *.spsize2 {
		width: calc(((100% - 20px * 1 - 4px) / 2) * 2 + 20px * 1);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol2 > * {
		width: calc((100% - 20px * 1 - 4px) / 2) !important;
	}
}
.contents .column.col3 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 2 - 4px) / 3);
}
.contents .column.col3 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 2 - 4px) / 3) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col3 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 2 - 4px) / 3) * 3 + min(40px, 40/1280*100vw) * 2);
}
@media screen and (max-width: 767px) {
	.contents .column.col3 > * {
		width: calc((100% - 20px * 2 - 4px) / 3);
	}
	.contents .column.col3 > *.spsize2 {
		width: calc(((100% - 20px * 2 - 4px) / 3) * 2 + 20px * 1);
	}
	.contents .column.col3 > *.spsize3 {
		width: calc(((100% - 20px * 2 - 4px) / 3) * 3 + 20px * 2);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol3 > * {
		width: calc((100% - 20px * 2 - 4px) / 3) !important;
	}
}
.contents .column.col4 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 3 - 4px) / 4);
}
.contents .column.col4 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 3 - 4px) / 4) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col4 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 3 - 4px) / 4) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col4 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 3 - 4px) / 4) * 4 + min(40px, 40/1280*100vw) * 3);
}
@media screen and (max-width: 767px) {
	.contents .column.col4 > * {
		width: calc((100% - 20px * 3 - 4px) / 4);
	}
	.contents .column.col4 > *.spsize2 {
		width: calc(((100% - 20px * 3 - 4px) / 4) * 2 + 20px * 1);
	}
	.contents .column.col4 > *.spsize3 {
		width: calc(((100% - 20px * 3 - 4px) / 4) * 3 + 20px * 2);
	}
	.contents .column.col4 > *.spsize4 {
		width: calc(((100% - 20px * 3 - 4px) / 4) * 4 + 20px * 3);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol4 > * {
		width: calc((100% - 20px * 3 - 4px) / 4) !important;
	}
}
.contents .column.col5 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 4 - 4px) / 5);
}
.contents .column.col5 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 4 - 4px) / 5) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col5 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 4 - 4px) / 5) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col5 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 4 - 4px) / 5) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col5 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 4 - 4px) / 5) * 5 + min(40px, 40/1280*100vw) * 4);
}
@media screen and (max-width: 767px) {
	.contents .column.col5 > * {
		width: calc((100% - 20px * 4 - 4px) / 5);
	}
	.contents .column.col5 > *.spsize2 {
		width: calc(((100% - 20px * 4 - 4px) / 5) * 2 + 20px * 1);
	}
	.contents .column.col5 > *.spsize3 {
		width: calc(((100% - 20px * 4 - 4px) / 5) * 3 + 20px * 2);
	}
	.contents .column.col5 > *.spsize4 {
		width: calc(((100% - 20px * 4 - 4px) / 5) * 4 + 20px * 3);
	}
	.contents .column.col5 > *.spsize5 {
		width: calc(((100% - 20px * 4 - 4px) / 5) * 5 + 20px * 4);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol5 > * {
		width: calc((100% - 20px * 4 - 4px) / 5) !important;
	}
}
.contents .column.col6 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 5 - 4px) / 6);
}
.contents .column.col6 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 5 - 4px) / 6) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col6 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 5 - 4px) / 6) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col6 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 5 - 4px) / 6) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col6 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 5 - 4px) / 6) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col6 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 5 - 4px) / 6) * 6 + min(40px, 40/1280*100vw) * 5);
}
@media screen and (max-width: 767px) {
	.contents .column.col6 > * {
		width: calc((100% - 20px * 5 - 4px) / 6);
	}
	.contents .column.col6 > *.spsize2 {
		width: calc(((100% - 20px * 5 - 4px) / 6) * 2 + 20px * 1);
	}
	.contents .column.col6 > *.spsize3 {
		width: calc(((100% - 20px * 5 - 4px) / 6) * 3 + 20px * 2);
	}
	.contents .column.col6 > *.spsize4 {
		width: calc(((100% - 20px * 5 - 4px) / 6) * 4 + 20px * 3);
	}
	.contents .column.col6 > *.spsize5 {
		width: calc(((100% - 20px * 5 - 4px) / 6) * 5 + 20px * 4);
	}
	.contents .column.col6 > *.spsize6 {
		width: calc(((100% - 20px * 5 - 4px) / 6) * 6 + 20px * 5);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol6 > * {
		width: calc((100% - 20px * 5 - 4px) / 6) !important;
	}
}
.contents .column.col7 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7);
}
.contents .column.col7 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col7 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col7 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col7 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col7 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7) * 6 + min(40px, 40/1280*100vw) * 5);
}
.contents .column.col7 > *.size7 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 6 - 4px) / 7) * 7 + min(40px, 40/1280*100vw) * 6);
}
@media screen and (max-width: 767px) {
	.contents .column.col7 > * {
		width: calc((100% - 20px * 6 - 4px) / 7);
	}
	.contents .column.col7 > *.spsize2 {
		width: calc(((100% - 20px * 6 - 4px) / 7) * 2 + 20px * 1);
	}
	.contents .column.col7 > *.spsize3 {
		width: calc(((100% - 20px * 6 - 4px) / 7) * 3 + 20px * 2);
	}
	.contents .column.col7 > *.spsize4 {
		width: calc(((100% - 20px * 6 - 4px) / 7) * 4 + 20px * 3);
	}
	.contents .column.col7 > *.spsize5 {
		width: calc(((100% - 20px * 6 - 4px) / 7) * 5 + 20px * 4);
	}
	.contents .column.col7 > *.spsize6 {
		width: calc(((100% - 20px * 6 - 4px) / 7) * 6 + 20px * 5);
	}
	.contents .column.col7 > *.spsize7 {
		width: calc(((100% - 20px * 6 - 4px) / 7) * 7 + 20px * 6);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol7 > * {
		width: calc((100% - 20px * 6 - 4px) / 7) !important;
	}
}
.contents .column.col8 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8);
}
.contents .column.col8 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col8 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col8 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col8 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col8 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 6 + min(40px, 40/1280*100vw) * 5);
}
.contents .column.col8 > *.size7 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 7 + min(40px, 40/1280*100vw) * 6);
}
.contents .column.col8 > *.size8 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 7 - 4px) / 8) * 8 + min(40px, 40/1280*100vw) * 7);
}
@media screen and (max-width: 767px) {
	.contents .column.col8 > * {
		width: calc((100% - 20px * 7 - 4px) / 8);
	}
	.contents .column.col8 > *.spsize2 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 2 + 20px * 1);
	}
	.contents .column.col8 > *.spsize3 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 3 + 20px * 2);
	}
	.contents .column.col8 > *.spsize4 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 4 + 20px * 3);
	}
	.contents .column.col8 > *.spsize5 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 5 + 20px * 4);
	}
	.contents .column.col8 > *.spsize6 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 6 + 20px * 5);
	}
	.contents .column.col8 > *.spsize7 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 7 + 20px * 6);
	}
	.contents .column.col8 > *.spsize8 {
		width: calc(((100% - 20px * 7 - 4px) / 8) * 8 + 20px * 7);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol8 > * {
		width: calc((100% - 20px * 7 - 4px) / 8) !important;
	}
}
.contents .column.col9 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9);
}
.contents .column.col9 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col9 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col9 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col9 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col9 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 6 + min(40px, 40/1280*100vw) * 5);
}
.contents .column.col9 > *.size7 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 7 + min(40px, 40/1280*100vw) * 6);
}
.contents .column.col9 > *.size8 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 8 + min(40px, 40/1280*100vw) * 7);
}
.contents .column.col9 > *.size9 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 8 - 4px) / 9) * 9 + min(40px, 40/1280*100vw) * 8);
}
@media screen and (max-width: 767px) {
	.contents .column.col9 > * {
		width: calc((100% - 20px * 8 - 4px) / 9);
	}
	.contents .column.col9 > *.spsize2 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 2 + 20px * 1);
	}
	.contents .column.col9 > *.spsize3 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 3 + 20px * 2);
	}
	.contents .column.col9 > *.spsize4 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 4 + 20px * 3);
	}
	.contents .column.col9 > *.spsize5 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 5 + 20px * 4);
	}
	.contents .column.col9 > *.spsize6 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 6 + 20px * 5);
	}
	.contents .column.col9 > *.spsize7 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 7 + 20px * 6);
	}
	.contents .column.col9 > *.spsize8 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 8 + 20px * 7);
	}
	.contents .column.col9 > *.spsize9 {
		width: calc(((100% - 20px * 8 - 4px) / 9) * 9 + 20px * 8);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol9 > * {
		width: calc((100% - 20px * 8 - 4px) / 9) !important;
	}
}
.contents .column.col10 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10);
}
.contents .column.col10 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col10 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col10 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col10 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col10 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 6 + min(40px, 40/1280*100vw) * 5);
}
.contents .column.col10 > *.size7 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 7 + min(40px, 40/1280*100vw) * 6);
}
.contents .column.col10 > *.size8 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 8 + min(40px, 40/1280*100vw) * 7);
}
.contents .column.col10 > *.size9 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 9 + min(40px, 40/1280*100vw) * 8);
}
.contents .column.col10 > *.size10 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 9 - 4px) / 10) * 10 + min(40px, 40/1280*100vw) * 9);
}
@media screen and (max-width: 767px) {
	.contents .column.col10 > * {
		width: calc((100% - 20px * 9 - 4px) / 10);
	}
	.contents .column.col10 > *.spsize2 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 2 + 20px * 1);
	}
	.contents .column.col10 > *.spsize3 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 3 + 20px * 2);
	}
	.contents .column.col10 > *.spsize4 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 4 + 20px * 3);
	}
	.contents .column.col10 > *.spsize5 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 5 + 20px * 4);
	}
	.contents .column.col10 > *.spsize6 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 6 + 20px * 5);
	}
	.contents .column.col10 > *.spsize7 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 7 + 20px * 6);
	}
	.contents .column.col10 > *.spsize8 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 8 + 20px * 7);
	}
	.contents .column.col10 > *.spsize9 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 9 + 20px * 8);
	}
	.contents .column.col10 > *.spsize10 {
		width: calc(((100% - 20px * 9 - 4px) / 10) * 10 + 20px * 9);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol10 > * {
		width: calc((100% - 20px * 9 - 4px) / 10) !important;
	}
}
.contents .column.col11 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11);
}
.contents .column.col11 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col11 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col11 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col11 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col11 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 6 + min(40px, 40/1280*100vw) * 5);
}
.contents .column.col11 > *.size7 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 7 + min(40px, 40/1280*100vw) * 6);
}
.contents .column.col11 > *.size8 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 8 + min(40px, 40/1280*100vw) * 7);
}
.contents .column.col11 > *.size9 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 9 + min(40px, 40/1280*100vw) * 8);
}
.contents .column.col11 > *.size10 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 10 + min(40px, 40/1280*100vw) * 9);
}
.contents .column.col11 > *.size11 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 10 - 4px) / 11) * 11 + min(40px, 40/1280*100vw) * 10);
}
@media screen and (max-width: 767px) {
	.contents .column.col11 > * {
		width: calc((100% - 20px * 10 - 4px) / 11);
	}
	.contents .column.col11 > *.spsize2 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 2 + 20px * 1);
	}
	.contents .column.col11 > *.spsize3 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 3 + 20px * 2);
	}
	.contents .column.col11 > *.spsize4 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 4 + 20px * 3);
	}
	.contents .column.col11 > *.spsize5 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 5 + 20px * 4);
	}
	.contents .column.col11 > *.spsize6 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 6 + 20px * 5);
	}
	.contents .column.col11 > *.spsize7 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 7 + 20px * 6);
	}
	.contents .column.col11 > *.spsize8 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 8 + 20px * 7);
	}
	.contents .column.col11 > *.spsize9 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 9 + 20px * 8);
	}
	.contents .column.col11 > *.spsize10 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 10 + 20px * 9);
	}
	.contents .column.col11 > *.spsize11 {
		width: calc(((100% - 20px * 10 - 4px) / 11) * 11 + 20px * 10);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol11 > * {
		width: calc((100% - 20px * 10 - 4px) / 11) !important;
	}
}
.contents .column.col12 > * {
	width: calc((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12);
}
.contents .column.col12 > *.size2 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 2 + min(40px, 40/1280*100vw) * 1);
}
.contents .column.col12 > *.size3 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 3 + min(40px, 40/1280*100vw) * 2);
}
.contents .column.col12 > *.size4 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 4 + min(40px, 40/1280*100vw) * 3);
}
.contents .column.col12 > *.size5 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 5 + min(40px, 40/1280*100vw) * 4);
}
.contents .column.col12 > *.size6 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 6 + min(40px, 40/1280*100vw) * 5);
}
.contents .column.col12 > *.size7 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 7 + min(40px, 40/1280*100vw) * 6);
}
.contents .column.col12 > *.size8 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 8 + min(40px, 40/1280*100vw) * 7);
}
.contents .column.col12 > *.size9 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 9 + min(40px, 40/1280*100vw) * 8);
}
.contents .column.col12 > *.size10 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 10 + min(40px, 40/1280*100vw) * 9);
}
.contents .column.col12 > *.size11 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 11 + min(40px, 40/1280*100vw) * 10);
}
.contents .column.col12 > *.size12 {
	width: calc(((100% - min(40px, 40/1280*100vw) * 11 - 4px) / 12) * 12 + min(40px, 40/1280*100vw) * 11);
}
@media screen and (max-width: 767px) {
	.contents .column.col12 > * {
		width: calc((100% - 20px * 11 - 4px) / 12);
	}
	.contents .column.col12 > *.spsize2 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 2 + 20px * 1);
	}
	.contents .column.col12 > *.spsize3 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 3 + 20px * 2);
	}
	.contents .column.col12 > *.spsize4 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 4 + 20px * 3);
	}
	.contents .column.col12 > *.spsize5 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 5 + 20px * 4);
	}
	.contents .column.col12 > *.spsize6 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 6 + 20px * 5);
	}
	.contents .column.col12 > *.spsize7 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 7 + 20px * 6);
	}
	.contents .column.col12 > *.spsize8 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 8 + 20px * 7);
	}
	.contents .column.col12 > *.spsize9 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 9 + 20px * 8);
	}
	.contents .column.col12 > *.spsize10 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 10 + 20px * 9);
	}
	.contents .column.col12 > *.spsize11 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 11 + 20px * 10);
	}
	.contents .column.col12 > *.spsize12 {
		width: calc(((100% - 20px * 11 - 4px) / 12) * 12 + 20px * 11);
	}
}
@media screen and (max-width: 767px) {
	.contents .column.spcol12 > * {
		width: calc((100% - 20px * 11 - 4px) / 12) !important;
	}
}
.contents .table {
	position: relative;
	overflow-x: auto;
	overflow-y: hidden !important;
}
.contents .table > table {
	position: relative;
	width: 100%;
	margin: 0px;
	border-spacing: 0px;
	empty-cells: show;
	background: #fff;
	border-collapse: collapse;
}
.contents .table > table > thead > tr > th {
	padding: 12px 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	vertical-align: middle;
	text-align: center;
	background: #0077B6;
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.contents .table > table > thead > tr > th {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > thead > tr > th {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > thead > tr > th {
		padding: 8px 12px;
	}
}
.contents .table > table > thead > tr > td {
	background: #7D8E9E;
}
.contents .table > table > tbody > tr > th {
	padding: 12px 20px;
	vertical-align: middle;
	text-align: center;
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.7;
	font-weight: 400;
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.contents .table > table > tbody > tr > th {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > tbody > tr > th {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .table > table > tbody > tr > th:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .table > table > tbody > tr > th:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > tbody > tr > th:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .table > table > tbody > tr > th:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .table > table > tbody > tr > th:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
@media screen and (max-width: 767px) {
	.contents .table > table > tbody > tr > th {
		padding: 8px 12px;
	}
}
.contents .table > table > tr > td,
.contents .table > table > tbody > tr > td {
	padding: 12px 20px;
	vertical-align: middle;
	text-align: left;
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.7;
	font-weight: 400;
	border: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.contents .table > table > tr > td,
	.contents .table > table > tbody > tr > td {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > tr > td,
	.contents .table > table > tbody > tr > td {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > tr > td,
	.contents .table > table > tbody > tr > td {
		padding: 8px 12px;
	}
}
.contents .table > table > tr > td:not(.d):not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .table > table > tr > td:not(.d):not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > tr > td:not(.d):not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .table > table > tr > td:not(.d):not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .table > table > tr > td:not(.d):not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .table > table > tbody > tr > td:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .table > table > tbody > tr > td:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .table > table > tbody > tr > td:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .table > table > tbody > tr > td:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .table > table > tbody > tr > td:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .table > table .left {
	text-align: left;
}
.contents .table > table .right {
	text-align: right;
}
.contents .table > table .center {
	text-align: center;
}
.contents .table > table .top {
	vertical-align: top;
}
.contents .table > table .bottom {
	vertical-align: bottom;
}
.contents .table > table .middle {
	vertical-align: middle;
}
.contents .youtube {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}
.contents .youtube > div {
	position: relative;
	padding-top: 56.25%;
}
.contents .youtube > div > iframe,
.contents .youtube > div > video {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	border: 0px;
}
.contents .morebutton {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
@media screen and (max-width: 767px) {
	.contents .morebutton {
		align-items: center;
	}
}
.contents .morebutton a {
	display: flex;
	align-items: center;
	width: fit-content;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.contents .morebutton a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .morebutton a {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .morebutton a {
		display: inline-flex;
		height: 24px;
	}
}
.contents .morebutton a:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.contents .morebutton a:after {
		width: 24px;
		height: 24px;
	}
}
.contents .morebutton a span {
	position: relative;
	display: inline-block;
}
.contents .morebutton a span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.contents .morebutton a span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.contents .morebutton a:hover span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.contents .morebutton a:hover span:after {
	animation: wheel ease-in-out 600ms;
}
.contents .box {
	padding: min(39px, 3.046875vw);
	background: rgba(0, 119, 182, 0.05);
	border: 1px solid #CDD6DD;
	border-radius: 10px;
}
.contents .box:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .box:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .box:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .box:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .box:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .anchorlink {
	padding: 25px 20px;
	background: #CDD6DD;
	border-radius: 10px;
}
.contents .anchorlink ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: space-evenly;
}
.contents .anchorlink a {
	position: relative;
	margin-right: 34px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	font-family: "Noto Serif JP", serif;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .anchorlink a {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .anchorlink a {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.contents .anchorlink a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .anchorlink a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .anchorlink a:after {
	content: "";
	display: block;
	position: absolute;
	width: 34px;
	height: 100%;
	right: -34px;
	top: 0;
	background: url(../images/triangleb.svg) no-repeat center center;
	background-size: 12px auto;
}
.contents .teachertitle h1 {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 5px 0px;
	margin-top: 15px;
	margin-bottom: 40px;
	padding-bottom: 40px;
	font-size: min(4.6875vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	border-bottom: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.contents .teachertitle h1 {
		font-size: min(5.8536585366vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teachertitle h1 {
		font-size: min(7.8898071625vw * var(--fontratio, 1), 29.5867768595px * var(--fontratio, 1));
	}
}
.contents .teachertitle h1 span {
	display: inline-block;
	font-size: min(2.34375vw * var(--fontratio, 1), 30px * var(--fontratio, 1));
	line-height: 1.3;
}
@media screen and (max-width: 959px) {
	.contents .teachertitle h1 span {
		font-size: min(2.9268292683vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teachertitle h1 span {
		font-size: min(5.0732782369vw * var(--fontratio, 1), 19.0247933884px * var(--fontratio, 1));
	}
}
.contents .teachertitle dl {
	display: flex;
	flex-direction: column;
	gap: 20px;
	font-family: "Noto Serif JP", serif;
}
.contents .teachertitle dl dt {
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #7D8E9E;
}
@media screen and (max-width: 959px) {
	.contents .teachertitle dl dt {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teachertitle dl dt {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.contents .teachertitle dl dd {
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.contents .teachertitle dl dd {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teachertitle dl dd {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.contents .teachermessage {
	position: relative;
	padding-top: min(40px, 3.125vw);
	z-index: 0;
}
.contents .teachermessage:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 250px;
	top: 0;
	left: 0;
	background: linear-gradient(to bottom, #ecf4f8 0%, rgba(236, 244, 248, 0) 100%);
	z-index: -1;
}
.contents .teachermessage h2 {
	margin-left: 20px;
}
.contents .teachermessage .text {
	max-width: 960px;
	margin-left: auto;
	margin-right: 0;
	--fontratio: 17 / 16;
	font-family: "Noto Serif JP", serif;
}
.contents .teacherprofile h2 {
	margin-bottom: 20px;
}
.contents .teacherprofile h3 {
	margin-bottom: 15px;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.contents .teacherprofile h3 {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teacherprofile h3 {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.contents .teacherprofile h3:after {
	display: none;
}
.contents .teacherprofile h4 {
	margin-bottom: 10px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.contents .teacherprofile h4 {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .teacherprofile h4 {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .morecontents {
	position: relative;
	overflow-y: clip;
	height: var(--height, 0px);
	min-height: 44px;
	transition: height 600ms;
}
.contents .morecontents.mcopened {
	height: auto !important;
}
.contents .morecontents.mcopen:before {
	opacity: 0;
}
.contents .morecontents.mcopen > .switch a:before {
	transform: rotateX(180deg);
}
.contents .morecontents:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 180px;
	bottom: 0;
	left: 0;
	background: linear-gradient(to top, white 44px, rgba(255, 255, 255, 0) 100%);
	z-index: 150;
	transition: opacity 600ms;
	pointer-events: none;
}
.contents .morecontents > .body {
	padding-bottom: 80px;
}
.contents .morecontents > .switch {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	text-align: center;
	z-index: 200;
}
.contents .morecontents > .switch a {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: auto;
	padding: 5px 60px;
	min-width: min(330px, 25.78125vw);
	max-width: 90%;
	height: 44px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	background: #A8BDCC;
	border-radius: 22px;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.contents .morecontents > .switch a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .morecontents > .switch a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .morecontents > .switch a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.contents .morecontents > .switch a {
		padding: 5px 40px;
		min-width: 220px;
	}
}
.contents .morecontents > .switch a:before {
	content: "";
	display: block;
	position: absolute;
	width: 60px;
	height: 100%;
	right: 0;
	top: 0;
	background: url(../images/triangleb.svg) no-repeat center center;
	background-size: 12px;
	filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(1695%) hue-rotate(63deg) brightness(117%) contrast(100%);
	transition: transform 600ms;
}
@media screen and (max-width: 767px) {
	.contents .morecontents > .switch a:before {
		width: 40px;
		background-size: 10px;
	}
}
.contents .morecontents > .switch a span {
	text-overflow: ellipsis;
	display: -webkit-box;
	overflow: hidden;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.contents .imagelink.noblur a:before {
	display: none;
}
.contents .imagelink a {
	position: relative;
	display: block;
	width: fit-content;
	margin: auto;
}
.contents .imagelink a .image {
	position: relative;
	margin: 0;
	overflow: hidden;
	z-index: -1;
}
.contents .imagelink a .image img {
	transition: transform 400ms;
}
.contents .imagelink a .title {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	padding: 20px;
	top: 0;
	left: 0;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: bold;
	color: #fff;
	text-align: center;
}
@media screen and (max-width: 959px) {
	.contents .imagelink a .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .imagelink a .title {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.contents .imagelink a:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(3px) brightness(0.82);
	transition: backdrop-filter 400ms;
}
.contents .imagelink a:hover:before {
	backdrop-filter: blur(0px) brightness(1);
}
.contents .imagelink a:hover img {
	transform: scale(1.15);
}
.contents .banner {
	display: flex;
	flex-direction: column;
	gap: min(40px, 3.125vw);
}
.contents .banner ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.contents .banner ul {
		gap: 15px;
	}
}
.contents .banner li {
	width: calc((100% - min(40px, 3.125vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.contents .banner li {
		width: calc((100% - 15px) / 2);
	}
}
.contents .banner a {
	display: block;
	width: fit-content;
	margin: auto;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.contents .banner a:hover {
	opacity: 0.7;
}
.contents .banner img {
	margin: auto;
}
.contents .accordionmenu {
	background: #0077B6;
	border: 1px solid #CDD6DD;
	transition: background 400ms;
}
.contents .accordionmenu:has(dt.open) {
	background: transparent;
}
.contents .accordionmenu dt {
	position: relative;
	overflow: hidden;
}
.contents .accordionmenu dt > * {
	display: flex;
	align-items: center;
	min-height: 70px;
	padding: 5px 10px 5px min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #fff;
	transition: color 400ms;
}
@media screen and (max-width: 959px) {
	.contents .accordionmenu dt > * {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .accordionmenu dt > * {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .accordionmenu dt > * {
		min-height: 60px;
	}
}
.contents .accordionmenu dt a {
	transition: opacity 0.2s, background 0.2s, color 400ms;
	cursor: pointer;
}
.contents .accordionmenu dt a:hover {
	opacity: 0.7;
}
.contents .accordionmenu dt.open > * {
	color: #1A1311;
}
.contents .accordionmenu dt:has(+ dd) {
	padding-right: 54px;
	cursor: pointer;
	user-select: none;
}
@media screen and (max-width: 767px) {
	.contents .accordionmenu dt:has(+ dd) {
		padding-right: 44px;
	}
}
.contents .accordionmenu dt:has(+ dd).open:before {
	transform: rotateZ(90deg) rotateY(180deg);
}
.contents .accordionmenu dt:has(+ dd):before {
	content: "";
	display: block;
	position: absolute;
	width: 54px;
	height: 100%;
	right: 0;
	top: 0;
	background: url(../images/arrow2.svg) no-repeat center center;
	background-size: auto 8px;
	filter: brightness(0) saturate(100%) invert(30%) sepia(99%) saturate(1221%) hue-rotate(175deg) brightness(92%) contrast(104%);
	transform: rotateZ(90deg) rotateY(0deg);
	z-index: 2;
	transition: opacity 400ms, transform 400ms;
}
@media screen and (max-width: 767px) {
	.contents .accordionmenu dt:has(+ dd):before {
		width: 44px;
	}
}
.contents .accordionmenu dt:has(+ dd):after {
	content: "";
	display: block;
	position: absolute;
	width: 34px;
	height: 34px;
	right: 10px;
	top: calc(50% - 17px);
	background: #fff;
	border-radius: 50%;
	z-index: 1;
	transition: opacity 400ms;
}
@media screen and (max-width: 767px) {
	.contents .accordionmenu dt:has(+ dd):after {
		width: 24px;
		height: 24px;
		top: calc(50% - 12px);
	}
}
.contents .accordionmenu dt:has(+ dd):hover:before, .contents .accordionmenu dt:has(+ dd):hover:after {
	opacity: 0.8;
}
.contents .accordionmenu dt:has(+ dd):has(a:hover):before, .contents .accordionmenu dt:has(+ dd):has(a:hover):after {
	opacity: 1;
}
.contents .accordionmenu dd {
	display: none;
	margin-top: 10px;
	padding: 0 10px 20px min(35px, 2.734375vw);
}
.contents .accordionmenu dd a {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .accordionmenu dd a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .accordionmenu dd a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .accordionmenu dd a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.05em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: 1.3 #1A1311;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .accordionmenu dd a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.05em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .accordionmenu ul {
	display: flex;
	flex-direction: column;
	gap: min(25px, 1.953125vw);
}
.contents .collectionheading {
	width: fit-content;
	padding: 20px;
	border: 1px solid #CDD6DD;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.contents .collectionheading {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .collectionheading {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.contents .form {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
}
.contents .form > dl, .contents .form > form > dl {
	display: flex;
	flex-direction: column;
	padding-bottom: 20px;
	border-bottom: 1px solid #CDD6DD;
}
.contents .form > dl > dt, .contents .form > form > dl > dt {
	padding-top: 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	border-top: 1px solid #CDD6DD;
}
@media screen and (max-width: 959px) {
	.contents .form > dl > dt, .contents .form > form > dl > dt {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form > dl > dt, .contents .form > form > dl > dt {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form > dl > dt, .contents .form > form > dl > dt {
		padding-top: 15px;
	}
}
.contents .form > dl > dt.required:after, .contents .form > form > dl > dt.required:after {
	content: "【必須】";
	display: inline-block;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #FF0000;
}
@media screen and (max-width: 959px) {
	.contents .form > dl > dt.required:after, .contents .form > form > dl > dt.required:after {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form > dl > dt.required:after, .contents .form > form > dl > dt.required:after {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .form > dl > dt.required.en:after, .contents .form > form > dl > dt.required.en:after {
	content: "[required]";
	padding-left: 3px;
}
.contents .form > dl > dt.noborder, .contents .form > form > dl > dt.noborder {
	border-top: 0;
	padding-top: 0;
}
@media screen and (max-width: 767px) {
	.contents .form > dl > dt.noborder, .contents .form > form > dl > dt.noborder {
		padding-top: 15px;
	}
}
.contents .form > dl > dd + dt, .contents .form > form > dl > dd + dt {
	margin-top: 20px;
}
.contents .form > dl > dd, .contents .form > form > dl > dd {
	padding-top: 20px;
}
.contents .form > dl > dd:not(.image) > a, .contents .form > form > dl > dd:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.contents .form > dl > dd:not(.image) > a, .contents .form > form > dl > dd:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form > dl > dd:not(.image) > a, .contents .form > form > dl > dd:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .form > dl > dd:not(.image) > a:before, .contents .form > form > dl > dd:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.contents .form > dl > dd:not(.image) > a:hover:before, .contents .form > form > dl > dd:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.contents .form > dl > dd > dl, .contents .form > form > dl > dd > dl {
	display: flex;
	align-items: center;
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.contents .form > dl > dd > dl, .contents .form > form > dl > dd > dl {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form > dl > dd > dl, .contents .form > form > dl > dd > dl {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contents .form > dl > dd > dl > dt, .contents .form > form > dl > dd > dl > dt {
	flex-shrink: 0;
	width: 4.5em;
	margin-right: 5px;
}
.contents .form > dl > dd > dl > dd + dt, .contents .form > form > dl > dd > dl > dd + dt {
	margin-left: min(40px, 3.125vw);
}
.contents .form input[type="text"], .contents .form input[type="email"], .contents .form input[type="tel"], .contents .form input[type="url"], .contents .form input[type="number"] {
	width: 100%;
	height: 2.823529411764706em;
	padding: 0 min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 2.7058823529;
	font-weight: 400;
	border: 1px solid #CDD6DD;
	border-radius: 3px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
@media screen and (max-width: 959px) {
	.contents .form input[type="text"], .contents .form input[type="email"], .contents .form input[type="tel"], .contents .form input[type="url"], .contents .form input[type="number"] {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form input[type="text"], .contents .form input[type="email"], .contents .form input[type="tel"], .contents .form input[type="url"], .contents .form input[type="number"] {
		font-size: min(4.2666666667vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
.contents .form input[type="text"].short, .contents .form input[type="email"].short, .contents .form input[type="tel"].short, .contents .form input[type="url"].short, .contents .form input[type="number"].short {
	width: 14.7em;
}
@media screen and (max-width: 767px) {
	.contents .form input[type="text"].short, .contents .form input[type="email"].short, .contents .form input[type="tel"].short, .contents .form input[type="url"].short, .contents .form input[type="number"].short {
		width: 7em;
	}
}
.contents .form input[type="text"][required], .contents .form input[type="email"][required], .contents .form input[type="tel"][required], .contents .form input[type="url"][required], .contents .form input[type="number"][required] {
	background: #FFFAFA;
}
.contents .form input[type="text"]:focus, .contents .form input[type="email"]:focus, .contents .form input[type="tel"]:focus, .contents .form input[type="url"]:focus, .contents .form input[type="number"]:focus {
	outline: none;
}
.contents .form textarea {
	width: 100%;
	height: 15em;
	padding: min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	border: 1px solid #CDD6DD;
	border-radius: 3px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
@media screen and (max-width: 959px) {
	.contents .form textarea {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form textarea {
		font-size: min(4.2666666667vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form textarea {
		height: 10em;
	}
}
.contents .form textarea[required] {
	background: #FFFAFA;
}
.contents .form textarea:focus {
	outline: none;
}
.contents .form select {
	height: 2.823529411764706em;
	padding: 0px 40px 0px min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 2.7058823529;
	font-weight: 400;
	border: 1px solid #CDD6DD;
	border-radius: 3px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url(../images/triangleb.svg) no-repeat right 15px center #fff;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.contents .form select {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form select {
		font-size: min(4.2666666667vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
.contents .form select:focus {
	outline: none;
}
.contents .form select::-ms-expand {
	display: none;
}
.contents .form .forms {
	display: flex;
	flex-wrap: wrap;
	gap: 5px min(30px, 2.34375vw);
}
.contents .form .forms.vertical {
	flex-direction: column;
}
.contents .form .forms label {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	min-height: 34px;
	padding: 5px 0px 5px 28px;
	cursor: pointer;
}
.contents .form .forms label p {
	width: 100%;
	margin-top: 5px;
	margin-bottom: 5px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
}
@media screen and (max-width: 959px) {
	.contents .form .forms label p {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form .forms label p {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.contents .form .forms input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.contents .form .forms input[type="checkbox"] + span:before {
	content: "";
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
	top: 50%;
	left: -28px;
	margin-top: -9px;
	background: #fff;
	border: 1px solid #CDD6DD;
	border-radius: 3px;
	transition: 200ms;
}
.contents .form .forms input[type="checkbox"]:checked + span:before {
	background: #0077B6;
}
.contents .form .forms input[type="checkbox"] + span {
	position: relative;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	user-select: none;
}
@media screen and (max-width: 959px) {
	.contents .form .forms input[type="checkbox"] + span {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form .forms input[type="checkbox"] + span {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .form .forms input[type="checkbox"] + span:after {
	content: "";
	display: block;
	position: absolute;
	width: 18px;
	height: 18px;
	top: 50%;
	left: -28px;
	margin-top: -9px;
	background: url(../images/check.svg) no-repeat center center;
	background-size: 10px auto;
	transform: scale(0);
	transition: 200ms;
}
.contents .form .forms input[type="checkbox"]:checked + span:after {
	transform: scale(1);
}
.contents .form .forms input[type="radio"]:disabled + span {
	opacity: 0.4;
}
.contents .form .forms input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.contents .form .forms input[type="radio"] + span:before {
	content: "";
	display: block;
	position: absolute;
	width: 22px;
	height: 22px;
	top: 50%;
	left: 0px;
	margin-top: -12px;
	background: transparent;
	border: 1px solid #000;
	border-radius: 50%;
}
.contents .form .forms input[type="radio"] + span {
	margin-left: 6px;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 500;
	user-select: none;
}
@media screen and (max-width: 959px) {
	.contents .form .forms input[type="radio"] + span {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form .forms input[type="radio"] + span {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.contents .form .forms input[type="radio"] + span:after {
	content: "";
	display: block;
	position: absolute;
	width: 12px;
	height: 12px;
	top: 50%;
	left: 12px;
	margin-top: -6px;
	margin-left: -6px;
	background: #0077B6;
	border-radius: 50%;
	transform: scale(0);
	transition: 200ms;
}
.contents .form .forms input[type="radio"]:checked + span:after {
	transform: scale(1);
}
.contents .form .buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: min(40px, 3.125vw);
	margin-top: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.contents .form .buttons {
		margin-top: 30px;
	}
}
.contents .form .buttons button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 18em;
	height: 50px;
	padding: 5px min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	background: #0077B6;
	border-radius: 10px;
	border: 0;
	pointer: cursor;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.contents .form .buttons button {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .form .buttons button {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .form .buttons button:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.contents .form .buttons button {
		width: 13.5em;
		padding-left: 15px;
	}
}
.contents .form .buttons button[name="in_back"], .contents .form .buttons button[type="reset"] {
	height: 48px;
	color: #0077B6;
	background-color: #fff;
	border: 1px solid #0077B6;
}
.contents .snslink ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
.contents .snslink a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 5px 15px;
	min-height: 55px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
	border: 1px solid #CDD6DD;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.contents .snslink a {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .snslink a {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.contents .snslink a:hover {
	opacity: 0.7;
}
.contents .snslink .line a:before {
	content: "";
	display: block;
	flex-shrink: 0;
	width: 30px;
	height: 30px;
	background: url(../images/line.svg) no-repeat center center;
	background-size: 100%;
}
.contents .snslink .instagram a:before {
	content: "";
	display: block;
	flex-shrink: 0;
	width: 30px;
	height: 30px;
	background: url(../images/instagram.png) no-repeat center center;
	background-size: 100%;
}
.contents .pageselector select {
	display: block;
	height: 2em;
	padding: 0px 40px 0px 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 2;
	font-weight: 400;
	border: 1px solid #CDD6DD;
	border-radius: 17px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url(../images/triangleb.svg) no-repeat right 15px center #fff;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.contents .pageselector select {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contents .pageselector select {
		font-size: min(4.2666666667vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
.contents .pageselector select:focus {
	outline: none;
}
.contents .pageselector select::-ms-expand {
	display: none;
}
.contents .pageselector.right select {
	margin-left: auto;
	margin-right: 0;
}

.headdingmenu {
	display: flex;
	flex-wrap: wrap;
	gap: min(120px, 9.375vw) min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.headdingmenu {
		flex-direction: column;
		gap: 60px 30px;
	}
}
.headdingmenu > div {
	width: 100%;
}
.headdingmenu > div.half {
	width: calc((100% - min(40px, 40/1280*100vw)) / 2);
}
@media screen and (max-width: 767px) {
	.headdingmenu > div.half {
		width: 100%;
	}
}
.headdingmenu > div.half .image {
	width: calc(50% - min(20px, 20/1280*100vw));
}
.headdingmenu > div.reverse .image {
	order: -1;
}
@media screen and (max-width: 767px) {
	.headdingmenu > div.equal > a {
		flex-wrap: wrap;
	}
}
.headdingmenu > div.equal .image {
	width: calc(50% - min(20px, 20/1280*100vw));
	order: -1;
}
@media screen and (max-width: 767px) {
	.headdingmenu > div.equal .image {
		width: 100%;
		order: 2;
	}
}
.headdingmenu > div.bg {
	position: relative;
}
.headdingmenu > div.bg.large > a {
	align-items: center;
	aspect-ratio: 1280 / 442;
}
.headdingmenu > div.bg.nega * {
	color: #fff;
}
.headdingmenu > div.bg.nega *:before {
	border-color: #fff;
}
.headdingmenu > div.bg.nega .more span:before {
	background-color: #fff;
}
.headdingmenu > div.bg.nega:before {
	content: "";
	display: block;
	position: absolute;
	width: 50%;
	height: 100%;
	left: 0;
	top: 0;
	background: linear-gradient(to left, transparent 0%, var(--covercolor, #0077B6) 100%);
	opacity: 0.8;
	z-index: -1;
}
.headdingmenu > div.bg > a {
	padding: min(50px, 3.90625vw);
	min-height: 290px;
}
.headdingmenu > div.bg .image {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -2;
}
.headdingmenu > div.bg .image img {
	height: 100%;
}
@media screen and (max-width: 767px) {
	.headdingmenu > div:not(.bg):not(.half) > a {
		flex-direction: column;
	}
	.headdingmenu > div:not(.bg):not(.half) > a .image {
		width: 100%;
		order: 2;
	}
}
.headdingmenu > div > a {
	display: flex;
	align-items: flex-start;
	height: 100%;
	color: #1A1311;
	gap: 20px min(40px, 3.125vw);
}
.headdingmenu > div > a > div {
	width: 100%;
}
.headdingmenu > div > a > div:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.headdingmenu > div > a > div:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.headdingmenu > div > a > div:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.headdingmenu > div > a > div:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.headdingmenu > div > a > div:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.headdingmenu > div > a .image {
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4 * 3 + min(40px, 40/1280*100vw) * 2);
	overflow: hidden;
	order: 2;
	flex-shrink: 0;
}
.headdingmenu > div > a .image img {
	width: 100%;
	transition: transform 400ms;
	object-fit: cover;
}
.headdingmenu > div > a h2 {
	margin-bottom: min(20px, 1.5625vw);
}
.headdingmenu > div > a h2 + .info {
	margin-top: min(30px, 2.34375vw);
}
.headdingmenu > div > a .info {
	margin-top: min(40px, 3.125vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 500;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.headdingmenu > div > a .info {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.headdingmenu > div > a .info {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.headdingmenu > div > a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin-top: min(40px, 3.125vw);
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.headdingmenu > div > a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.headdingmenu > div > a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.headdingmenu > div > a .more {
		height: 24px;
	}
}
.headdingmenu > div > a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100% auto;
}
@media screen and (max-width: 767px) {
	.headdingmenu > div > a .more:after {
		width: 24px;
		height: 24px;
	}
}
.headdingmenu > div > a .more span {
	position: relative;
	display: inline-block;
}
.headdingmenu > div > a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.headdingmenu > div > a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
	clip-path: circle(7.5px);
}
.headdingmenu > div > a:hover .image img {
	transform: scale(1.1);
}
.headdingmenu > div > a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.headdingmenu > div > a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

.contentsmenu {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.contentsmenu {
		flex-direction: column;
		gap: 30px 15px;
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.col4 {
		flex-direction: row;
	}
}
.contentsmenu.col4 > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.contentsmenu.col4 > div {
		width: calc((100% - 15px) / 2);
	}
}
.contentsmenu.col1 > div {
	width: 100% !important;
}
.contentsmenu > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 767px) {
	.contentsmenu > div {
		width: 100%;
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher {
		flex-direction: column;
	}
	.contentsmenu.teacher > div {
		width: 100%;
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher > div > a {
		padding-left: 115px;
		min-height: 105px;
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher > div > a .image {
		position: absolute;
		width: 105px;
		left: 0;
	}
}
.contentsmenu.teacher > div > a .image img {
	aspect-ratio: 1 / 1;
}
.contentsmenu.teacher > div > a .course {
	margin-top: min(20px, 1.5625vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contentsmenu.teacher > div > a .course {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher > div > a .course {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher > div > a .course {
		margin-top: 0px;
	}
}
.contentsmenu.teacher > div > a .name {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 5px 0px;
	margin-top: 5px;
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contentsmenu.teacher > div > a .name {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher > div > a .name {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
.contentsmenu.teacher > div > a .name span {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
}
@media screen and (max-width: 959px) {
	.contentsmenu.teacher > div > a .name span {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu.teacher > div > a .name span {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contentsmenu > div > a {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	color: #1A1311;
}
.contentsmenu > div > a .image {
	overflow: hidden;
}
.contentsmenu > div > a .image img {
	width: 100%;
	aspect-ratio: 400 / 283;
	transition: transform 400ms;
	object-fit: cover;
}
.contentsmenu > div > a .number {
	position: absolute;
	top: -0.22em;
	left: 0;
	font-size: min(4.6875vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contentsmenu > div > a .number {
		font-size: min(5.8536585366vw * var(--fontratio, 1), 48px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .number {
		font-size: min(16vw * var(--fontratio, 1), 60px * var(--fontratio, 1));
	}
}
.contentsmenu > div > a .title {
	margin-top: min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.contentsmenu > div > a .title {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .title {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .title {
		margin-top: 10px;
		margin-bottom: 10px;
		text-align: center;
	}
}
.contentsmenu > div > a .title:has(+ .more) {
	margin-bottom: min(20px, 1.5625vw);
}
.contentsmenu > div > a .info {
	margin-top: min(20px, 1.5625vw);
	margin-bottom: min(20px, 1.5625vw);
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.contentsmenu > div > a .info {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .info {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.contentsmenu > div > a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin-top: auto;
	margin-bottom: 0;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.contentsmenu > div > a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .more {
		height: 24px;
	}
}
.contentsmenu > div > a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100% auto;
}
@media screen and (max-width: 767px) {
	.contentsmenu > div > a .more:after {
		width: 24px;
		height: 24px;
	}
}
.contentsmenu > div > a .more span {
	position: relative;
	display: inline-block;
}
.contentsmenu > div > a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.contentsmenu > div > a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.contentsmenu > div > a:hover .image img {
	transform: scale(1.1);
}
.contentsmenu > div > a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.contentsmenu > div > a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

@media screen and (max-width: 767px) {
	.categoryselector.admission ul a {
		height: 20px;
	}
}
.categoryselector.admission ul a:before {
	background: linear-gradient(to right bottom, #018efc 0%, #03a8ea 21%, #2fd1d8 47%, #80e9cf 100%);
}
.categoryselector ul {
	display: flex;
	gap: 1px;
}
@media screen and (max-width: 767px) {
	.categoryselector ul {
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
		padding: 10px;
		background: #fff;
		border: 1px solid #CDD6DD;
	}
}
.categoryselector ul li {
	min-width: 100px;
}
@media screen and (max-width: 1279px) {
	.categoryselector ul li {
		min-width: 0px;
	}
}
@media screen and (max-width: 767px) {
	.categoryselector ul li {
		min-width: 80px;
	}
}
.categoryselector ul a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0px 25px;
	height: 34px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #1A1311;
	transition: opacity 0.2s, color 0.2s, background 0.2s;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.categoryselector ul a {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.categoryselector ul a {
		font-size: min(2.9333333333vw * var(--fontratio, 1), 11px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.categoryselector ul a {
		padding: 0px 15px;
	}
}
@media screen and (max-width: 767px) {
	.categoryselector ul a {
		height: 18px;
		padding: 0px 5px;
	}
}
.categoryselector ul a:after {
	content: "";
	display: none;
	position: absolute;
	left: 50%;
	top: 0px;
	width: 100%;
	height: 18px;
	background: #fff;
	border: 1px solid #CDD6DD;
	border-radius: 10px;
	z-index: -2;
	transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
	.categoryselector ul a:after {
		display: block;
	}
}
.categoryselector ul a:before {
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	top: 1px;
	width: 0%;
	min-width: 32px;
	height: 32px;
	background: #0077B6;
	border-radius: 16px;
	z-index: -1;
	transform: translateX(-50%) scale(0);
	opacity: 0;
	transition: width 0ms 300ms, transform linear 0ms 300ms, opacity 300ms;
}
@media screen and (max-width: 767px) {
	.categoryselector ul a:before {
		min-width: 18px;
		height: 18px;
	}
}
.categoryselector ul a.on {
	color: #fff;
}
.categoryselector ul a.on:before {
	width: 100%;
	opacity: 1;
	transform: translateX(-50%) scale(1);
	transition: width 400ms 100ms, transform linear 200ms, opacity 200ms;
}

.datelist {
	transition: opacity 500ms;
}
.datelist.change {
	opacity: 0;
}
.datelist.libraryevent > ul > li .title {
	display: block;
	width: fit-content;
	margin-top: 10px;
}
.datelist.libraryevent > ul > li .schedule {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	padding-left: 24px;
	margin-top: 10px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #7D8E9E;
	background: url(../images/schedule.svg) no-repeat left center;
}
@media screen and (max-width: 959px) {
	.datelist.libraryevent > ul > li .schedule {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist.libraryevent > ul > li .schedule {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist.libraryevent > ul > li .schedule {
		display: flex;
	}
}
.datelist.libraryevent > ul > li .place {
	display: inline-flex;
	align-items: center;
	padding-left: 24px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #7D8E9E;
}
@media screen and (max-width: 959px) {
	.datelist.libraryevent > ul > li .place {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist.libraryevent > ul > li .place {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.datelist.libraryevent > ul > li .title + place {
	margin-top: 10px;
}
.datelist > ul {
	width: 100%;
	border-top: 1px solid #CDD6DD;
}
.datelist > ul > li {
	display: block;
	padding: 20px;
	border-bottom: 1px solid #CDD6DD;
}
@media screen and (max-width: 767px) {
	.datelist > ul > li {
		padding: 20px 0px;
	}
}
.datelist > ul > li > div,
.datelist > ul > li > a {
	display: flex;
	gap: 20px;
}
.datelist > ul > li > div > div,
.datelist > ul > li > a > div {
	position: relative;
}
.datelist > ul > li > a:hover .image img {
	transform: scale(1.1);
}
.datelist > ul > li > a:hover .title:before {
	bottom: -2px;
	opacity: 1;
	transform: scale(1);
	transition: opacity 200ms, transform 400ms, bottom 0ms;
}
.datelist > ul > li .image {
	flex-shrink: 0;
	width: min(146px, 11.40625vw);
	margin-left: -20px;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.datelist > ul > li .image {
		display: none;
	}
}
.datelist > ul > li .image img {
	width: 100%;
	transition: transform 400ms;
}
.datelist > ul > li .date {
	display: flex;
	align-items: center;
	height: 22px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #7D8E9E;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.datelist > ul > li .date {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist > ul > li .date {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.library .datelist > ul > li .date {
	height: 32px;
	font-family: "Noto Sans JP", sans-serif;
}
.datelist > ul > li .category {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 7em;
	height: 22px;
	top: 0px;
	left: 9.5em;
	padding: 0 10px;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
	border: 1px solid #0077B6;
	border-radius: 16px;
}
@media screen and (max-width: 959px) {
	.datelist > ul > li .category {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist > ul > li .category {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}
.datelist > ul > li .category.important {
	color: #FF0000;
	border-color: #FF0000;
}
.library .datelist > ul > li .category {
	min-width: 7.4285714286em;
	height: 32px;
	left: 8.7em;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.library .datelist > ul > li .category {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.library .datelist > ul > li .category {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.datelist > ul > li .category:has(> span) {
	padding: 0;
	border: 0;
	border-radius: 0;
}
.datelist > ul > li .category:has(> span) span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 7em;
	height: 22px;
	padding: 0 10px;
	white-space: nowrap;
	border: 1px solid #0077B6;
	border-radius: 16px;
}
@media screen and (max-width: 767px) {
	.datelist > ul > li .category {
		left: 8em;
	}
}
.datelist > ul > li .title {
	position: relative;
	display: inline-block;
	margin-top: min(25px, 1.953125vw);
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #1A1311;
}
@media screen and (max-width: 959px) {
	.datelist > ul > li .title {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist > ul > li .title {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.datelist > ul > li .title {
		margin-top: 10px;
	}
}
.datelist > ul > li .title:before {
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	left: 0px;
	width: 100%;
	height: 1px;
	background: #1A1311;
	opacity: 0;
	transform-origin: left;
	transition: opacity 400ms, transform 0ms 400ms, bottom 400ms;
	transform: scale(0);
}
.datelist > ul > li .tags {
	margin-top: 10px;
}
.datelist > ul > li .tags ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.datelist > ul > li .tags ul li {
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #7D8E9E;
}
@media screen and (max-width: 959px) {
	.datelist > ul > li .tags ul li {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.datelist > ul > li .tags ul li {
		font-size: min(2.926369146vw * var(--fontratio, 1), 10.9738842975px * var(--fontratio, 1));
	}
}

.linklist.col2 {
	columns: 2;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.linklist.col2 {
		columns: 1;
	}
}
.linklist.col2 li {
	break-inside: avoid;
}
.linklist ul {
	display: flex;
	flex-direction: column;
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.linklist ul {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.linklist ul {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.linklist ul li {
	display: flex;
	align-items: center;
	padding: 10px 0px;
	min-height: min(60px, 4.6875vw);
	margin-bottom: -1px;
	border-top: 1px solid #CDD6DD;
	border-bottom: 1px solid #CDD6DD;
}
.linklist ul a {
	position: relative;
	display: flex;
	align-items: center;
	margin: -10px 0px;
	padding: 10px 45px 10px 0px;
	width: 100%;
	min-height: min(60px, 4.6875vw);
	color: #1A1311;
}
.linklist ul a[target="_blank"]:before {
	background-image: url(../images/blank.svg);
}
.linklist ul a[href$=".pdf"]:before {
	background-image: url(../images/pdf.svg);
}
.linklist ul a[href$=".doc"]:before, .linklist ul a[href$=".docx"]:before {
	background-image: url(../images/doc.svg);
}
.linklist ul a[href$=".ppt"]:before, .linklist ul a[href$=".pptx"]:before {
	background-image: url(../images/ppt.svg);
}
.linklist ul a[href$=".xls"]:before, .linklist ul a[href$=".xlsx"]:before {
	background-image: url(../images/xls.svg);
}
.linklist ul a:before {
	content: "";
	display: block;
	position: absolute;
	width: 35px;
	height: 100%;
	left: auto;
	right: 5px;
	top: 0px;
	bottom: auto;
	background: url(../images/arrow.svg) no-repeat center center;
}
.linklist ul a:hover > span:before {
	bottom: -2px;
	opacity: 1;
	transform: scale(1);
	transition: opacity 200ms, transform 400ms, bottom 0ms;
}
.linklist ul a > span {
	position: relative;
	display: inline-block;
}
.linklist ul a > span:before {
	content: "";
	display: block;
	position: absolute;
	bottom: -6px;
	left: 0px;
	width: 100%;
	height: 1px;
	background: #1A1311;
	opacity: 0;
	transform-origin: left;
	transition: opacity 400ms, transform 0ms 400ms, bottom 400ms;
	transform: scale(0);
}

.faqlist dl {
	display: flex;
	flex-direction: column;
	border-bottom: 1px solid #CDD6DD;
}
.faqlist dl dt {
	position: relative;
	display: flex;
	align-items: center;
	padding: 10px 55px 10px 0px;
	min-height: min(60px, 4.6875vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	border-top: 1px solid #CDD6DD;
	cursor: pointer;
	overflow: hidden;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	user-select: none;
}
@media screen and (max-width: 959px) {
	.faqlist dl dt {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.faqlist dl dt {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
.faqlist dl dt:hover {
	opacity: 0.7;
}
.faqlist dl dt.open:before {
	top: 100%;
}
.faqlist dl dt.open:after {
	top: 0%;
}
.faqlist dl dt:before {
	content: "";
	display: block;
	position: absolute;
	width: 55px;
	height: 100%;
	top: 0%;
	right: 0;
	background: url(../images/plus.svg) no-repeat center center;
	transition: top 400ms;
	filter: invert(1);
	pointer-events: none;
}
.faqlist dl dt:after {
	content: "";
	display: block;
	position: absolute;
	width: 55px;
	height: 100%;
	top: -100%;
	right: 0;
	background: url(../images/minus.svg) no-repeat center center;
	transition: top 400ms;
	filter: invert(1);
	pointer-events: none;
}
.faqlist dl dd {
	display: none;
	padding: 10px 0px 20px;
}
.faqlist dl dd:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.faqlist dl dd:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.faqlist dl dd:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.faqlist dl dd:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.faqlist dl dd:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}

.boxlink {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.boxlink {
		gap: 20px min(40px, 3.125vw);
	}
}
.boxlink.exam {
	gap: 20px;
}
.boxlink.exam > div.s {
	width: 100%;
}
.boxlink > div {
	width: calc((100% - min(40px, 40/1280*100vw)) / 2);
}
@media screen and (max-width: 767px) {
	.boxlink > div {
		width: 100%;
	}
}
.boxlink > div.m {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 767px) {
	.boxlink > div.m {
		width: 100%;
	}
}
.boxlink > div.s {
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
}
@media screen and (max-width: 767px) {
	.boxlink > div.s {
		width: calc((100% - min(40px, 40/1280*100vw)) / 2);
	}
}
.boxlink > div.s a {
	justify-content: center;
	min-height: 70px;
	padding: 5px min(19px, 1.484375vw);
}
.boxlink > div.s a .title,
.boxlink > div.s a h2 {
	margin-right: 35px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
}
@media screen and (max-width: 959px) {
	.boxlink > div.s a .title,
	.boxlink > div.s a h2 {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink > div.s a .title,
	.boxlink > div.s a h2 {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink > div.s a .title,
	.boxlink > div.s a h2 {
		margin-right: 30px;
	}
}
.boxlink > div.s a p {
	display: none;
}
.boxlink > div.s a .more {
	top: 50%;
	right: 9px;
	color: #fff;
	transform: translateY(-50%);
}
.boxlink > div.s a .more span:before {
	display: none;
}
.boxlink a {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: min(20px, 1.5625vw);
	height: 100%;
	padding: min(19px, 1.484375vw);
	color: #1A1311;
	background: #fff;
	border: 1px solid #CDD6DD;
	z-index: 0;
}
@media screen and (max-width: 767px) {
	.boxlink a {
		gap: 10px;
		padding: 10px;
	}
}
.boxlink a .title,
.boxlink a h2 {
	margin-right: 4.5em;
	margin-bottom: 0;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.boxlink a .title,
	.boxlink a h2 {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink a .title,
	.boxlink a h2 {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink a .title,
	.boxlink a h2 {
		margin-right: 30px;
	}
}
.boxlink a p {
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.boxlink a p {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink a p {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink a p {
		margin-right: 35px;
	}
}
.boxlink a .more {
	position: absolute;
	display: flex;
	align-items: center;
	height: 34px;
	top: min(19px, 1.484375vw);
	right: min(19px, 1.484375vw);
	margin-top: auto;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
	pointer-events: none;
	user-select: none;
	z-index: -1;
}
@media screen and (max-width: 959px) {
	.boxlink a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.boxlink a .more {
		top: 50%;
		color: #fff;
		transform: translateY(-50%);
	}
}
.boxlink a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.boxlink a .more:after {
		width: 24px;
		height: 24px;
	}
}
.boxlink a .more span {
	position: relative;
	display: inline-block;
}
.boxlink a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
@media screen and (max-width: 767px) {
	.boxlink a .more span:before {
		display: none;
	}
}
.boxlink a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.boxlink a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.boxlink a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

.admissionpoint ol {
	display: flex;
	flex-wrap: wrap;
	gap: 60px min(40px, 3.125vw);
	padding-top: 40px;
	counter-reset: number;
}
@media screen and (max-width: 767px) {
	.admissionpoint ol {
		flex-direction: column;
		align-items: center;
		gap: 40px;
	}
}
.admissionpoint li {
	position: relative;
	display: flex;
	flex-direction: column;
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
	background: #E8ECEB;
	--fontratio: 1.2;
}
@media screen and (max-width: 767px) {
	.admissionpoint li {
		width: 100%;
		max-width: 400px;
	}
}
.admissionpoint li:before {
	content: "POINT";
	position: absolute;
	top: -1.9166666667em;
	left: 50%;
	font-size: min(0.9375vw * var(--fontratio, 1), 12px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	transform: translateX(-50%);
	z-index: 1;
}
@media screen and (max-width: 959px) {
	.admissionpoint li:before {
		font-size: min(1.1707317073vw * var(--fontratio, 1), 9.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li:before {
		font-size: min(2.9333333333vw * var(--fontratio, 1), 11px * var(--fontratio, 1));
	}
}
.admissionpoint li:after {
	counter-increment: number;
	content: counter(number);
	position: absolute;
	display: block;
	top: 0;
	left: 50%;
	width: 2.206896551724138em;
	height: 1.3793103448em;
	padding-top: 0.8275862068965517em;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	text-align: center;
	background: #0077B6;
	transform: translate(-50%, -50%);
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 959px) {
	.admissionpoint li:after {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li:after {
		font-size: min(6.4vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	}
}
.admissionpoint li .image {
	overflow: hidden;
}
.admissionpoint li .image img {
	width: 100%;
	aspect-ratio: 400 / 240;
	object-fit: cover;
}
.admissionpoint li .title {
	padding: min(20px, 1.5625vw) 10px min(30px, 2.34375vw);
	font-size: min(1.5625vw * var(--fontratio, 1), 20px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	text-align: left;
	align-self: center;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .title {
		font-size: min(1.9512195122vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .title {
		font-size: min(3.9228650138vw * var(--fontratio, 1), 14.7107438017px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .title {
		padding: 15px 10px 20px;
	}
}
.admissionpoint li .info {
	padding: 0 min(20px, 1.5625vw) min(20px, 1.5625vw);
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .info {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .info {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .info {
		padding: 0 15px 15px;
	}
}
.admissionpoint li .info p {
	font-family: "Noto Serif JP", serif;
}
.admissionpoint li .info p + p {
	margin-top: 15px;
}
.admissionpoint li .info a {
	color: #0077B6;
	position: relative;
	display: inline-block;
}
.admissionpoint li .info a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.4em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.admissionpoint li .info a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.4em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.admissionpoint li .body {
	position: relative;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	padding: 0 min(20px, 1.5625vw) min(20px, 1.5625vw);
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .body {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body {
		padding: 0 15px 15px;
	}
}
.admissionpoint li .body .point {
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	color: #0077B6;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .body .point {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body .point {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.admissionpoint li .body p {
	font-family: "Noto Serif JP", serif;
}
.admissionpoint li .body .point + p,
.admissionpoint li .body p + p {
	margin-top: 15px;
}
.admissionpoint li .body a {
	color: #0077B6;
	position: relative;
	display: inline-block;
}
.admissionpoint li .body a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.4em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.admissionpoint li .body a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.4em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.admissionpoint li .body:has(.point):before {
	visibility: visible;
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body:has(.point):before {
		display: block;
	}
}
.admissionpoint li .body:has(.point):after {
	display: block;
}
.admissionpoint li .body:before {
	content: "評価のPOINT";
	position: relative;
	margin-bottom: min(20px, 1.5625vw);
	padding: 0 18px;
	align-self: center;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	color: #0077B6;
	font-family: "Noto Serif JP", serif;
	text-align: center;
	background: #E8ECEB;
	z-index: 2;
	visibility: hidden;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .body:before {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body:before {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body:before {
		display: none;
		margin-bottom: 15px;
	}
}
.admissionpoint li .body:after {
	content: "";
	display: none;
	position: absolute;
	width: 100%;
	height: 1px;
	top: 0.65em;
	left: 0;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	background: #0077B6;
	z-index: 1;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .body:after {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .body:after {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.admissionpoint li .more {
	margin-top: auto;
	margin-bottom: 0;
	padding-top: 15px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 500;
}
@media screen and (max-width: 959px) {
	.admissionpoint li .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionpoint li .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
.admissionpoint li .button,
.admissionpoint li .morebutton {
	margin-top: auto;
	margin-bottom: 0;
	padding: 15px min(20px, 1.5625vw) min(20px, 1.5625vw);
}
@media screen and (max-width: 767px) {
	.admissionpoint li .button,
	.admissionpoint li .morebutton {
		padding: 15px;
	}
}

.teacherfilter form {
	display: block;
}
.teacherfilter dt {
	margin-bottom: 10px !important;
}
.teacherfilter * + dt {
	margin-top: 20px !important;
}
.teacherfilter dd {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 959px) {
	.teacherfilter dd {
		gap: 20px;
	}
}
@media screen and (max-width: 767px) {
	.teacherfilter dd {
		gap: 10px;
	}
}
.teacherfilter dd > div {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px;
	width: 100%;
	max-width: 620px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
	background: #E8ECEB;
}
@media screen and (max-width: 959px) {
	.teacherfilter dd > div {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.teacherfilter dd > div {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.teacherfilter dd > div {
		padding: 10px;
	}
}
.teacherfilter label {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: calc((100% - min(40px, 40/1280*100vw) * 5) / 6);
	padding: 65px 5px 10px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 600;
	font-family: "Noto Serif JP", serif;
	text-align: center;
	background: #E8ECEB;
	border: 1px solid #E8ECEB;
	overflow: hidden;
	cursor: pointer;
	user-select: none;
	transition: background 400ms, border 400ms;
}
@media screen and (max-width: 959px) {
	.teacherfilter label {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.teacherfilter label {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.teacherfilter label {
		width: calc((100% - 20px * 5) / 6);
	}
}
@media screen and (max-width: 767px) {
	.teacherfilter label {
		width: calc((100% - 10px) / 2);
		min-height: 40px;
		padding: 5px 5px 5px 45px;
	}
}
.teacherfilter label:before {
	content: "";
	position: absolute;
	display: block;
	width: 30px;
	height: 30px;
	top: 20px;
	left: 50%;
	margin-left: -15px;
	background: url(../images/check.svg) no-repeat center center #CDD6DD;
	background-size: 0px auto;
	transition: background-size 200ms 100ms, background-color 400ms;
}
@media screen and (max-width: 767px) {
	.teacherfilter label:before {
		top: 50%;
		left: 20px;
		margin-top: -15px;
	}
}
.teacherfilter label:has(input:checked) {
	background: #fff;
	border-color: #0077B6;
}
.teacherfilter label:has(input:checked):before {
	background-size: 20px auto;
	background-color: #0077B6;
}
.teacherfilter label input {
	position: absolute;
	top: -100px;
	left: -100px;
}
.teacherfilter input[type="text"] {
	padding: 0px 15px;
	width: 100%;
	height: 50px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 50px;
	font-weight: 400;
	border: 0;
}
@media screen and (max-width: 959px) {
	.teacherfilter input[type="text"] {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.teacherfilter input[type="text"] {
		font-size: min(4.2666666667vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
		line-height: 35px;
	}
}
.teacherfilter input[type="text"]:focus {
	outline: 0;
}
@media screen and (max-width: 767px) {
	.teacherfilter input[type="text"] {
		height: 35px;
	}
}

.examfilter {
	padding: min(30px, 2.34375vw) min(20px, 1.5625vw) min(40px, 3.125vw);
	background: #ECF4F8;
}
.examfilter form {
	display: block;
}
.examfilter dt {
	gap: min(80px, 6.25vw) !important;
	white-space: nowrap;
}
.examfilter dt:before {
	content: "";
	display: block;
	flex-grow: 1;
	width: 100%;
	height: 1px;
	background: #CDD6DD;
}
.examfilter dt:after {
	width: 100% !important;
}
.examfilter * + dt {
	margin-top: min(40px, 3.125vw) !important;
}
@media screen and (max-width: 767px) {
	.examfilter * + dt {
		margin-top: 30px !important;
	}
}
.examfilter dd {
	display: flex;
	flex-wrap: wrap;
	gap: min(20px, 1.5625vw) min(30px, 2.34375vw);
	margin-top: -10px;
	padding: 0 min(20px, 1.5625vw);
}
@media screen and (max-width: 1279px) {
	.examfilter dd {
		gap: 20px min(10px, 1.5625vw);
	}
}
@media screen and (max-width: 767px) {
	.examfilter dd {
		gap: 10px;
		margin-top: -25px;
	}
}
.examfilter label {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: calc((100% - min(30px, 30/1280*100vw) * 5) / 6);
	height: 32px;
	padding: 4px 2px;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	text-align: center;
	background: #fff;
	border: 1px solid #CDD6DD;
	border-radius: 16px;
	overflow: hidden;
	cursor: pointer;
	user-select: none;
	transition: color 400ms, background 400ms;
}
@media screen and (max-width: 959px) {
	.examfilter label {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examfilter label {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 1279px) {
	.examfilter label {
		width: calc((100% - min(10px, 20/1280*100vw) * 5) / 6);
	}
}
@media screen and (max-width: 767px) {
	.examfilter label {
		width: calc((100% - 10px) / 2);
	}
}
.examfilter label:has(input:checked) {
	color: #fff;
	background: #0077B6;
}
.examfilter label input {
	position: absolute;
	top: -100px;
	left: -100px;
}

.examlist {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
	padding-top: min(40px, 3.125vw);
	border-top: 1px solid #0077B6;
}
.examlist > div {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
	padding-top: 16px;
}
@media screen and (max-width: 767px) {
	.examlist > div {
		width: 100%;
	}
}
.examlist a {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: #1A1311;
	border: 2px solid #0077B6;
}
.examlist a .date {
	position: relative;
	order: -1;
	align-self: center;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 130/17em;
	height: 32px;
	margin-top: -18px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 700;
	color: #0077B6;
	text-align: center;
	background: #fff;
	border: 1px solid #0077B6;
	border-radius: 16px;
	z-index: 5;
}
@media screen and (max-width: 959px) {
	.examlist a .date {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .date {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.examlist a .title {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: -16px;
	padding: 15px 5px 10px;
	min-height: min(100px, 8.3333333333vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.2;
	font-weight: 600;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	background: #0077B6;
}
@media screen and (max-width: 959px) {
	.examlist a .title {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .title {
		font-size: min(4.3957245179vw * var(--fontratio, 1), 16.4839669421px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .title {
		min-height: 65px;
	}
}
.examlist a .selection {
	padding: min(30px, 2.34375vw) 10px;
}
@media screen and (max-width: 767px) {
	.examlist a .selection {
		padding: 10px 10px 15px;
	}
}
.examlist a .selection:before {
	content: "選考方法";
	display: block;
	margin-bottom: min(20px, 1.5625vw);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	text-align: center;
}
@media screen and (max-width: 959px) {
	.examlist a .selection:before {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .selection:before {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.examlist a .selection ul {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
@media screen and (max-width: 767px) {
	.examlist a .selection ul {
		gap: 5px;
	}
}
.examlist a .selection li {
	width: min(94px, 7.34375vw);
}
@media screen and (max-width: 767px) {
	.examlist a .selection li {
		width: 45px;
	}
}
.examlist a .point {
	padding-bottom: min(40px, 2.34375vw);
}
.examlist a .point:before {
	content: "POINT";
	display: block;
	margin-bottom: min(20px, 1.5625vw);
	padding: 10px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #0077B6;
	font-family: "Noto Serif JP", serif;
	text-align: center;
	background: rgba(0, 119, 182, 0.2);
}
@media screen and (max-width: 959px) {
	.examlist a .point:before {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .point:before {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .point:before {
		margin-bottom: 10px;
		padding: 5px;
	}
}
.examlist a .point ol {
	display: flex;
	flex-direction: column;
	gap: 0.9em;
	margin: auto;
	padding: 0 20px;
	max-width: 320px;
}
@media screen and (max-width: 767px) {
	.examlist a .point ol {
		padding: 0 10px;
	}
}
.examlist a .point ol li {
	text-indent: calc(-1em - 4px);
	margin-left: calc(1em + 4px);
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.examlist a .point ol li {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .point ol li {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.examlist a .point ol li:before {
	margin-right: 4px;
	color: #0077B6;
}
.examlist a .point ol li:nth-child(1):before {
	content: "❶";
}
.examlist a .point ol li:nth-child(2):before {
	content: "❷";
}
.examlist a .point ol li:nth-child(3):before {
	content: "❸";
}
.examlist a .more {
	display: flex;
	align-items: center;
	height: 34px;
	margin: auto 20px 20px auto;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: #0077B6;
}
@media screen and (max-width: 959px) {
	.examlist a .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.examlist a .more {
		margin-right: 10px;
		margin-bottom: 10px;
		height: 24px;
	}
}
.examlist a .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100% auto;
}
@media screen and (max-width: 767px) {
	.examlist a .more:after {
		width: 24px;
		height: 24px;
	}
}
.examlist a .more span {
	position: relative;
	display: inline-block;
}
.examlist a .more span:before {
	content: "";
	display: block;
	position: absolute;
	width: 0%;
	height: 1px;
	bottom: -3px;
	left: 0px;
	background: #0077B6;
	opacity: 0;
	transition: opacity 200ms, width 0ms 200ms;
}
.examlist a .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}
.examlist a:hover .more span:before {
	width: 100%;
	opacity: 1;
	transition: 300ms 500ms;
}
.examlist a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}

.textblock,
.oldhtml {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
}

.textblock:not(.image) > a {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #0077B6;
	position: relative;
	display: inline-block;
}
@media screen and (max-width: 959px) {
	.textblock:not(.image) > a {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.textblock:not(.image) > a {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.textblock:not(.image) > a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0.25em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.textblock:not(.image) > a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0.25em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}

#searchresult {
	transition: height 600ms;
}
#searchresult .fs-loading {
	display: block;
}
#searchresult .fs-loading img {
	margin: 50px auto;
}

.pagenation {
	text-align: center;
}
.pagenation.first .prev {
	display: none;
}
.pagenation.first li:nth-child(n+7) {
	display: none;
}
.pagenation.first li.next {
	display: block;
}
.pagenation ul {
	position: relative;
	display: inline-flex;
	gap: 5px;
	flex-wrap: wrap;
	padding: 0px 49px;
}
.pagenation li {
	font-size: min(1.25vw * var(--fontratio, 1), 16px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.pagenation li {
		font-size: min(1.5609756098vw * var(--fontratio, 1), 12.8px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.pagenation li {
		font-size: min(3.4330798898vw * var(--fontratio, 1), 12.8740495868px * var(--fontratio, 1));
	}
}
.pagenation .current {
	color: #0077B6;
}
.pagenation .current a {
	color: #0077B6 !important;
}
.pagenation li:not(.next):not(.prev) a {
	display: block;
	width: 1.5em;
	color: #000;
	text-align: center;
	position: relative;
	display: inline-block;
}
.pagenation li:not(.next):not(.prev) a:before {
	content: "";
	display: block;
	position: absolute;
	bottom: calc(0em - 10px);
	right: 55%;
	width: 15%;
	height: 1px;
	background: #0077B6;
	opacity: 0;
	transform: scaleX(3);
	pointer-events: none;
	transform-origin: right;
	transition: transform 0s 0.3s, bottom 0.3s, right 0s 0.3s, width 0s 0.3s, opacity 0.3s;
	pointer-events: none;
}
.pagenation li:not(.next):not(.prev) a:hover:before {
	opacity: 1;
	right: 0%;
	width: 100%;
	bottom: calc(0em - 5px);
	transition: transform 0.3s 0.1s, bottom 0s, right 0.3s, width 0.3s 0.4s, opacity 0.25s;
	transform: scaleX(1);
}
.pagenation .next {
	position: absolute;
	right: 0px;
	top: 50%;
	margin-top: -17px;
}
.pagenation .next a {
	position: relative;
	display: block;
	width: 34px;
	height: 34px;
	text-indent: -10000px;
	background: #0077B6;
	transform: rotate(-90deg);
	border-radius: 50%;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.pagenation .next a:hover {
	opacity: 0.7;
}
.pagenation .next a:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: url(../images/triangleb.svg) no-repeat center center;
	background-size: 8px auto;
	filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(232deg) brightness(109%) contrast(102%);
}
.pagenation .prev {
	position: absolute;
	left: 0px;
	top: 50%;
	margin-top: -17px;
}
.pagenation .prev a {
	display: block;
	width: 34px;
	height: 34px;
	text-indent: -10000px;
	background: #0077B6;
	transform: rotate(90deg);
	border-radius: 50%;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
.pagenation .prev a:hover {
	opacity: 0.7;
}
.pagenation .prev a:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: url(../images/triangleb.svg) no-repeat center center;
	background-size: 8px auto;
	filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(232deg) brightness(109%) contrast(102%);
}

.admissionkeyword {
	position: relative;
	padding-top: min(250px, 15.625vw);
	padding-bottom: min(120px, 7.5vw);
	z-index: 0;
}
.admissionkeyword h2 {
	margin-bottom: min(210px, 13.125vw);
	font-size: min(3.90625vw * var(--fontratio, 1), 50px * var(--fontratio, 1));
	text-align: center;
}
@media screen and (max-width: 959px) {
	.admissionkeyword h2 {
		font-size: min(4.8780487805vw * var(--fontratio, 1), 40px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionkeyword h2 {
		font-size: min(7.0567493113vw * var(--fontratio, 1), 26.4628099174px * var(--fontratio, 1));
	}
}
.admissionkeyword h2:before {
	content: "";
	display: block;
	position: absolute;
	width: min(450px, 35.15625vw);
	top: 50%;
	left: 50%;
	background: url(../images/h2bg.webp) no-repeat center center;
	background-size: 100% auto;
	aspect-ratio: 450 / 390;
	transform: translate(-40%, -50%);
	opacity: 0.15;
	z-index: -1;
}
.admissionkeyword h3 {
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	font-weight: 400;
}
@media screen and (max-width: 959px) {
	.admissionkeyword h3 {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionkeyword h3 {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
.admissionkeyword h3:after {
	display: none;
}
.admissionkeyword .list ul {
	display: flex;
	gap: min(40px, 3.125vw);
	flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
	.admissionkeyword .list ul {
		gap: 15px;
	}
}
.admissionkeyword .list li {
	width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
}
@media screen and (max-width: 767px) {
	.admissionkeyword .list li {
		width: calc((100% - 15px) / 2);
	}
}
.admissionkeyword .list a {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	min-height: min(100px, 7.8125vw);
	padding: 5px min(75px, 5.859375vw) 5px min(70px, 5.46875vw);
	font-size: min(1.875vw * var(--fontratio, 1), 24px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	font-family: "Noto Serif JP", serif;
	border-radius: 20px;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	.admissionkeyword .list a {
		font-size: min(2.3414634146vw * var(--fontratio, 1), 19.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.admissionkeyword .list a {
		font-size: min(3.7333333333vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	}
}
.admissionkeyword .list a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	.admissionkeyword .list a {
		min-height: 40px;
		padding: 5px 40px 5px 30px;
		border-radius: 10px;
	}
}
.admissionkeyword .list a:before {
	content: "#";
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: calc(min(70px, 70/1280*100vw) - 0.5em);
	height: 100%;
	left: 0;
}
@media screen and (max-width: 767px) {
	.admissionkeyword .list a:before {
		width: calc(30px - 0.5em);
	}
}
.admissionkeyword .list a:after {
	content: "";
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: min(75px, 5.859375vw);
	height: 100%;
	right: 0;
	background: url(../images/arrow.svg) no-repeat center center;
	transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
	.admissionkeyword .list a:after {
		width: 40px;
	}
}
.admissionkeyword .list a.c1 {
	color: #F281D8;
	background: #FCE8F7;
}
.admissionkeyword .list a.c1:after {
	filter: brightness(0) saturate(100%) invert(82%) sepia(22%) saturate(5851%) hue-rotate(281deg) brightness(103%) contrast(90%);
}
.admissionkeyword .list a.c2 {
	color: #AF8EC8;
	background: #F4EDF8;
}
.admissionkeyword .list a.c2:after {
	filter: brightness(0) saturate(100%) invert(85%) sepia(39%) saturate(2528%) hue-rotate(199deg) brightness(81%) contrast(92%);
}
.admissionkeyword .list a.c3 {
	color: #F79B25;
	background: #FFF0DD;
}
.admissionkeyword .list a.c3:after {
	filter: brightness(0) saturate(100%) invert(69%) sepia(64%) saturate(1643%) hue-rotate(341deg) brightness(99%) contrast(96%);
}
.admissionkeyword .list a.c4 {
	color: #51AA69;
	background: #EDF8F0;
}
.admissionkeyword .list a.c4:after {
	filter: brightness(0) saturate(100%) invert(59%) sepia(42%) saturate(504%) hue-rotate(84deg) brightness(92%) contrast(85%);
}
.admissionkeyword .list a.c5 {
	color: #F6766B;
	background: #FCEBEA;
}
.admissionkeyword .list a.c5:after {
	filter: brightness(0) saturate(100%) invert(65%) sepia(12%) saturate(7491%) hue-rotate(319deg) brightness(104%) contrast(93%);
}
.admissionkeyword .list a.c6 {
	color: #4798D3;
	background: #E5F4FF;
}
.admissionkeyword .list a.c6:after {
	filter: brightness(0) saturate(100%) invert(53%) sepia(48%) saturate(582%) hue-rotate(163deg) brightness(94%) contrast(90%);
}

.admissionkeyword + .admissionkeyword:before {
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 100%;
	top: 0;
	left: calc(50% - 50vw);
	background: #F2F8FB;
	z-index: -1;
}

#popupkeyword {
	display: none;
}

.popupkeyword,
#popupkeyword {
	padding: min(40px, 3.125vw);
}
.popupkeyword > div + div,
#popupkeyword > div + div {
	margin-top: min(40px, 3.125vw);
	padding-top: min(40px, 3.125vw);
	border-top: 1px solid #CDD6DD;
}
.popupkeyword a,
#popupkeyword a {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 20px min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.popupkeyword a,
	#popupkeyword a {
		flex-direction: column;
	}
}
.popupkeyword a > div:not(.image),
#popupkeyword a > div:not(.image) {
	display: flex;
	flex-direction: column;
	align-self: stretch;
	padding-left: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	.popupkeyword a > div:not(.image),
	#popupkeyword a > div:not(.image) {
		padding-left: 0;
	}
}
.popupkeyword a:hover .image img,
#popupkeyword a:hover .image img {
	transform: scale(1.15);
}
.popupkeyword a:hover .more span:after,
#popupkeyword a:hover .more span:after {
	animation: wheel ease-in-out 600ms;
}
.popupkeyword .image,
#popupkeyword .image {
	flex-shrink: 0;
	width: min(360px, 28.125vw);
	margin: 0 !important;
	overflow: hidden;
}
@media screen and (max-width: 767px) {
	.popupkeyword .image,
	#popupkeyword .image {
		width: auto;
		margin: auto !important;
	}
}
.popupkeyword .image img,
#popupkeyword .image img {
	transition: transform 400ms;
}
.popupkeyword .title,
#popupkeyword .title {
	position: relative;
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	width: 16.5em;
	height: 2.1379310345em;
	font-size: min(2.265625vw * var(--fontratio, 1), 29px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #fff;
	font-family: "Noto Serif JP", serif;
	z-index: 0;
}
@media screen and (max-width: 959px) {
	.popupkeyword .title,
	#popupkeyword .title {
		font-size: min(2.8292682927vw * var(--fontratio, 1), 23.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.popupkeyword .title,
	#popupkeyword .title {
		font-size: min(4.9629972452vw * var(--fontratio, 1), 18.6112396694px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.popupkeyword .title,
	#popupkeyword .title {
		width: auto;
		padding-left: 10px;
	}
}
.popupkeyword .title:before,
#popupkeyword .title:before {
	content: "";
	display: block;
	position: absolute;
	width: calc(100% + min(40px, 40/1280*100vw));
	height: 100%;
	left: max(-40px, -3.125vw);
	top: 0;
	z-index: -1;
}
@media screen and (max-width: 767px) {
	.popupkeyword .title:before,
	#popupkeyword .title:before {
		width: 100%;
		left: 0;
	}
}
.popupkeyword .language .title:before,
#popupkeyword .language .title:before {
	background: #4987BD;
}
.popupkeyword .french .title:before,
#popupkeyword .french .title:before {
	background: #45AB93;
}
.popupkeyword .english .title:before,
#popupkeyword .english .title:before {
	background: #C45979;
}
.popupkeyword .juvenile .title:before,
#popupkeyword .juvenile .title:before {
	background: #9AC365;
}
.popupkeyword .psychology .title:before,
#popupkeyword .psychology .title:before {
	background: #C57E40;
}
.popupkeyword .education .title:before,
#popupkeyword .education .title:before {
	background: #EB7191;
}
.popupkeyword p,
#popupkeyword p {
	margin-bottom: 15px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1.5;
	font-weight: 400;
	color: #1A1311;
	font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 959px) {
	.popupkeyword p,
	#popupkeyword p {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.popupkeyword p,
	#popupkeyword p {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.popupkeyword .tags,
#popupkeyword .tags {
	margin-bottom: 20px;
	padding: 10px 20px;
	background: #EFF1F2;
}
@media screen and (max-width: 959px) {
	.popupkeyword .tags,
	#popupkeyword .tags {
		margin-bottom: 0;
	}
}
.popupkeyword .tags ul,
#popupkeyword .tags ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
	font-size: min(1.328125vw * var(--fontratio, 1), 17px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 400;
	color: #1A1311;
}
@media screen and (max-width: 959px) {
	.popupkeyword .tags ul,
	#popupkeyword .tags ul {
		font-size: min(1.6585365854vw * var(--fontratio, 1), 13.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.popupkeyword .tags ul,
	#popupkeyword .tags ul {
		font-size: min(3.5571129477vw * var(--fontratio, 1), 13.3391735537px * var(--fontratio, 1));
	}
}
.popupkeyword .more,
#popupkeyword .more {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 34px;
	margin-top: auto;
	margin-bottom: 0;
	font-size: min(1.09375vw * var(--fontratio, 1), 14px * var(--fontratio, 1));
	line-height: 1;
	font-weight: 500;
	color: transparent;
	pointer-events: none;
}
@media screen and (max-width: 959px) {
	.popupkeyword .more,
	#popupkeyword .more {
		font-size: min(1.3658536585vw * var(--fontratio, 1), 11.2px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	.popupkeyword .more,
	#popupkeyword .more {
		font-size: min(3.1818402204vw * var(--fontratio, 1), 11.9319008264px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 959px) {
	.popupkeyword .more,
	#popupkeyword .more {
		display: none;
	}
}
.popupkeyword .more:after,
#popupkeyword .more:after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	background: url(../images/link.svg) no-repeat center center;
	background-size: 100%;
}
@media screen and (max-width: 767px) {
	.popupkeyword .more:after,
	#popupkeyword .more:after {
		width: 24px;
		height: 24px;
	}
}
.popupkeyword .more span,
#popupkeyword .more span {
	position: relative;
	display: inline-block;
}
.popupkeyword .more span:after,
#popupkeyword .more span:after {
	content: "";
	display: block;
	position: absolute;
	width: 4px;
	height: 20px;
	bottom: 50%;
	right: -29px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, white 50%, white 100%);
	transform-origin: bottom center;
	transform: rotate(0deg);
	transition: 200ms;
	opacity: 0;
}

#librarynavi + main {
	background: #fff;
}

#librarynavi {
	background: #fff;
}
#librarynavi > div {
	position: relative;
	width: 100%;
	max-width: 1360px;
	margin: auto;
	padding: 40px 40px 60px;
}
@media screen and (max-width: 959px) {
	#librarynavi > div {
		padding: 20px 20px 30px;
	}
}
@media screen and (max-width: 767px) {
	#librarynavi > div {
		padding: 20px 15px 30px;
	}
}
#librarynavi ul {
	display: flex;
	flex-wrap: wrap;
	gap: min(40px, 3.125vw);
}
@media screen and (max-width: 767px) {
	#librarynavi ul {
		gap: 10px;
	}
}
#librarynavi li {
	width: calc((100% - min(40px, 40/1280*100vw) * 3) / 4);
}
@media screen and (max-width: 959px) {
	#librarynavi li {
		width: calc((100% - min(40px, 40/1280*100vw) * 2) / 3);
	}
}
@media screen and (max-width: 767px) {
	#librarynavi li {
		width: calc((100% - 10px) / 2);
	}
}
#librarynavi a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 80px;
	height: 100%;
	padding: 5px 5px 5px min(40px, 3.515625vw);
	font-size: min(1.40625vw * var(--fontratio, 1), 18px * var(--fontratio, 1));
	line-height: 1.3;
	font-weight: 400;
	color: #1A1311;
	border: 2px solid #CDD6DD;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
}
@media screen and (max-width: 959px) {
	#librarynavi a {
		font-size: min(1.756097561vw * var(--fontratio, 1), 14.4px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#librarynavi a {
		font-size: min(3.6800881543vw * var(--fontratio, 1), 13.8003305785px * var(--fontratio, 1));
	}
}
#librarynavi a:hover {
	opacity: 0.7;
}
@media screen and (max-width: 767px) {
	#librarynavi a {
		min-height: 60px;
		padding-left: 25px;
	}
}
#librarynavi a:before {
	content: "";
	display: block;
	position: absolute;
	width: 15px;
	height: 20px;
	top: calc(50% - 10px);
	left: min(18px, 1.40625vw);
	background: #CDD6DD;
	clip-path: polygon(0% 0%, 66% 0%, 100% 50%, 66% 100%, 0% 100%, 33% 50%);
}
@media screen and (max-width: 767px) {
	#librarynavi a:before {
		width: 10px;
		height: 15px;
		top: calc(50% - 7.5px);
		left: 8px;
	}
}
#librarynavi li:nth-child(1) a {
	border-color: #4E91CE;
}
#librarynavi li:nth-child(1) a:before {
	background-color: #4E91CE;
}
#librarynavi li:nth-child(2) a {
	border-color: #BE4EB9;
}
#librarynavi li:nth-child(2) a:before {
	background-color: #BE4EB9;
}
#librarynavi li:nth-child(3) a {
	border-color: #DA6300;
}
#librarynavi li:nth-child(3) a:before {
	background-color: #DA6300;
}
#librarynavi li:nth-child(4) a {
	border-color: #61B0CF;
}
#librarynavi li:nth-child(4) a:before {
	background-color: #61B0CF;
}
#librarynavi li:nth-child(5) a {
	border-color: #D0C10B;
}
#librarynavi li:nth-child(5) a:before {
	background-color: #D0C10B;
}
#librarynavi li:nth-child(6) a {
	border-color: #98B454;
}
#librarynavi li:nth-child(6) a:before {
	background-color: #98B454;
}

.gsc-control-cse * {
	box-sizing: content-box;
}
.gsc-control-cse .gsc-input-box {
	border-color: #CDD6DD !important;
}
.gsc-control-cse img {
	display: inline;
}

/**
 * Swiper 11.1.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2024 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: March 28, 2024
 */
/* FONT_START */
@font-face {
	font-family: 'swiper-icons';
	src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
	font-weight: 400;
	font-style: normal;
}
/* FONT_END */
:root {
	--swiper-theme-color: #007aff;
	/*
	--swiper-preloader-color: var(--swiper-theme-color);
	--swiper-wrapper-transition-timing-function: initial;
	*/
}

:host {
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
	z-index: 1;
}

.swiper {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	overflow: hidden;
	list-style: none;
	padding: 0;
	/* Fix of Webkit flickering */
	z-index: 1;
	display: block;
}

.swiper-vertical > .swiper-wrapper {
	flex-direction: column;
}

.swiper-wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: flex;
	transition-property: transform;
	transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
	box-sizing: content-box;
}

.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
	transform: translate3d(0px, 0, 0);
}

.swiper-horizontal {
	touch-action: pan-y;
}

.swiper-vertical {
	touch-action: pan-x;
}

.swiper-slide {
	flex-shrink: 0;
	width: 100%;
	height: 100%;
	position: relative;
	transition-property: transform;
	display: block;
}

.swiper-slide-invisible-blank {
	visibility: hidden;
}

/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
	height: auto;
}

.swiper-autoheight .swiper-wrapper {
	align-items: flex-start;
	transition-property: transform, height;
}

.swiper-backface-hidden .swiper-slide {
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
	perspective: 1200px;
}

.swiper-3d .swiper-wrapper {
	transform-style: preserve-3d;
}

.swiper-3d {
	perspective: 1200px;
}

.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
	transform-style: preserve-3d;
}

/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
	overflow: auto;
	scrollbar-width: none;
	/* For Firefox */
	-ms-overflow-style: none;
	/* For Internet Explorer and Edge */
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
	display: none;
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
	scroll-snap-align: start start;
}

.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
	scroll-snap-type: x mandatory;
}

.swiper-css-mode.swiper-vertical > .swiper-wrapper {
	scroll-snap-type: y mandatory;
}

.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
	scroll-snap-type: none;
}

.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
	scroll-snap-align: none;
}

.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
	content: '';
	flex-shrink: 0;
	order: 9999;
}

.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
	scroll-snap-align: center center;
	scroll-snap-stop: always;
}

.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
	margin-inline-start: var(--swiper-centered-offset-before);
}

.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
	height: 100%;
	min-height: 1px;
	width: var(--swiper-centered-offset-after);
}

.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
	margin-block-start: var(--swiper-centered-offset-before);
}

.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
	width: 100%;
	min-width: 1px;
	height: var(--swiper-centered-offset-after);
}

/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 10;
}

.swiper-3d .swiper-slide-shadow {
	background: rgba(0, 0, 0, 0.15);
}

.swiper-3d .swiper-slide-shadow-left {
	background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-right {
	background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-top {
	background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-bottom {
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}

.swiper-lazy-preloader {
	width: 42px;
	height: 42px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -21px;
	margin-top: -21px;
	z-index: 10;
	transform-origin: 50%;
	box-sizing: border-box;
	border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
	border-radius: 50%;
	border-top-color: transparent;
}

.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
	animation: swiper-preloader-spin 1s infinite linear;
}

.swiper-lazy-preloader-white {
	--swiper-preloader-color: #fff;
}

.swiper-lazy-preloader-black {
	--swiper-preloader-color: #000;
}

@keyframes swiper-preloader-spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
/* Slide styles end */
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox {
	overflow: visible !important;
}

#colorbox, #cboxOverlay, #cboxWrapper {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
	-webkit-transform: translate3d(0, 0, 0);
}

#cboxWrapper {
	max-width: none;
}

#cboxOverlay {
	position: fixed;
	width: 100%;
	height: 100%;
}

#cboxMiddleLeft, #cboxBottomLeft {
	clear: left;
}

#cboxContent {
	position: relative;
}

#cboxLoadedContent {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

#cboxTitle {
	margin: 0;
}

#cboxLoadingOverlay, #cboxLoadingGraphic {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
	cursor: pointer;
}

.cboxPhoto {
	float: left;
	margin: auto;
	border: 0;
	display: block;
	max-width: none;
	-ms-interpolation-mode: bicubic;
}

.cboxIframe {
	width: 100%;
	height: 100%;
	display: block;
	border: 0;
	padding: 0;
	margin: 0;
}

#colorbox, #cboxContent, #cboxLoadedContent {
	box-sizing: content-box;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
}

/*
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay {
	background: #333;
	opacity: 0.8;
	filter: alpha(opacity=80);
}

#colorbox {
	outline: 0;
}

#cboxContent {
	background: #fff;
}

.cboxIframe {
	background: #000000;
}

#cboxError {
	padding: 50px;
	border: 1px solid #ccc;
}

#cboxLoadedContent {
	border: 0px solid #000;
	background: #fff;
}

#cboxTitle {
	position: absolute;
	top: -20px;
	left: 0;
	color: #ccc;
}

#cboxLoadingGraphic {
	background: url(../images/loading.png) no-repeat center center;
}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {
	border: 0;
	padding: 0;
	margin: 0;
	overflow: visible;
	width: auto;
	background: none;
}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {
	outline: 0;
}

#cboxSlideshow {
	position: absolute;
	top: -20px;
	right: 90px;
	color: #fff;
}

#cboxClose {
	position: absolute;
	display: block;
	top: -20px;
	right: -20px;
	width: 40px;
	height: 40px;
	text-indent: -9999px;
	background: #0077B6;
	border-radius: 50%;
	transition: opacity 0.2s, background 0.2s;
	cursor: pointer;
	-webkit-transition: 400ms;
	transition: 400ms;
	opacity: 0;
	z-index: 10;
}
#cboxClose:hover {
	opacity: 0.7;
}
#cboxClose.view {
	opacity: 1;
}
#cboxClose:before {
	content: "";
	position: absolute;
	display: block;
	width: 20px;
	height: 2px;
	top: 19px;
	left: 10px;
	background: #ffffff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
#cboxClose:after {
	content: "";
	position: absolute;
	display: block;
	width: 2px;
	height: 20px;
	top: 10px;
	left: 19px;
	background: #ffffff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

#colorbox #waiting {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: rgba(255, 255, 255, 0.7);
	z-index: 5;
}
#colorbox #waiting > div {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 0px;
	padding: 20px;
	font-size: min(1.71875vw * var(--fontratio, 1), 22px * var(--fontratio, 1));
	line-height: 1.7;
	text-align: center;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
@media screen and (max-width: 959px) {
	#colorbox #waiting > div {
		font-size: min(2.1463414634vw * var(--fontratio, 1), 17.6px * var(--fontratio, 1));
	}
}
@media screen and (max-width: 767px) {
	#colorbox #waiting > div {
		font-size: min(4.1614104683vw * var(--fontratio, 1), 15.6052892562px * var(--fontratio, 1));
	}
}
#colorbox #waiting > div span {
	display: block;
	margin: auto;
	width: 16px;
	height: 16px;
	background: url(../images/loading.png) no-repeat center center;
}

#cboxLoadedContent .contents > div {
	padding: 20px;
}
@media screen and (max-width: 767px) {
	#cboxLoadedContent .contents > div {
		padding: 10px;
	}
}

.library:not(.collection) .contents > div * {
	font-family: "Noto Sans JP", sans-serif;
}

.library.collection .contents > div * {
	font-family: "Noto Serif JP", serif;
}