@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Text:wght@400;500;700&family=Zen+Kaku+Gothic+New:wght@400;500;700&family=Zen+Old+Mincho:wght@400;500;700&display=swap');
html,body,h1,h2,h3,h4,h5,h6,p,span,div,object,iframe,em,ul,ol,li,label,dl,dt,dd,form,label,table,tbody,tr,th,td { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-family:inherit; list-style-type:none; list-style-image:none; } html { font-size:62.5%; overflow-y:scroll; } img { border:none; vertical-align:bottom; line-height:0; font-size:0; user-select:none; -webkit-user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-drag:none; -khtml-user-drag:none; } body { background: #fff; margin:0 !important; font-family:'Wix Madefor Text','Zen Kaku Gothic New',serif; font-size: 1.6rem; line-height:1.6; font-weight: 400; color: #1f4873; letter-spacing:0; } .clearfix { zoom:1; min-height: 1px; } .clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; font-size: 0.1em; line-height: 0; } .clearboth { clear: both; height: 1px; } *html .clearfix{ height: 1px; /*\*//*/ height: auto; overflow: hidden; /**/ }

.nopc { display: none; }
.nosp { display: inline-block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
sup { font-size: 60%; vertical-align: text-top; line-height: 1.0; }
.kome { font-size: 87.5%; padding-left: 1.0em; text-indent: -1.0em; line-height: 1.6; }
* { box-sizing: border-box; }
* img { width: 100%; }
section:focus, article:focus { outline: solid 1px #fff; }

@media screen and (max-width:768px) {
	.nosp { display: none; }
	.nopc { display: inline-block; }
	.kome { font-size: 90%; }
}

/* --------------------------------------------------------------------------
   header / nav
-------------------------------------------------------------------------- */

header {
	position: fixed; top: 0; left: 0; display: flex; padding-left: 30px;
	justify-content: space-between; align-items: center; width: 100%; height: 80px;
	background: rgba(255,255,255,.95); box-shadow: 0 5px 5px rgba(0,0,0,.1); z-index: 999;
}
header h1 { width: auto; height: 80%; }
header h1 a {
	display: block; width: auto; height: 100%; aspect-ratio: 2 / 1;
	background: 0 0/auto 200% no-repeat url(../img/logo.svg);
	text-indent: 200%; white-space: nowrap; overflow: hidden;
}

@media screen and (min-width:769px) {
	header .menubtn { display: none; }
	header nav { display: flex; align-items: center; height: 100%; }
	header nav a {
		position: relative; display: flex; align-items: center; padding: 0 12px; height: 100%;
		font-size: 1.6rem; color: #1f4873; text-align: center; font-weight: 500;
	}
	header nav a::after {
		content: ''; position: absolute; bottom: 16px; left: 50%; display: block;
		width: 0%; border-bottom: solid 2px #1f4873; transition: width .3s ease-in-out;
		transform: translateX(-50%);
	}
	header nav a:last-child { margin-left: 12px; padding: 0 24px; background: #e8ebf0; }
	header nav a:last-child::after { content: none; }
	header nav a:hover::after { width: 30%; }
	header nav a:last-child:hover { background: #1f4873; color: #fff; }
}
@media screen and (max-width:768px) {
	header { display: block; height: 60px; padding-left: 4vw; }
	header h1 { height: 92%; }
	header .menubtn { position: absolute; top: 0; right: 0; width: 60px; height: 60px; }
	header .menubtn i, header .menubtn::before, header .menubtn::after {
		content: ''; position: absolute; top: 50%; left: 50%; width: 50%; height: 3px;
		background: #1f4873; border-radius: 2px; transform: translate(-50%,-50%);
		transition: all .5s ease; text-indent: 200%; white-space: nowrap; overflow: hidden;
	}
	header .menubtn::before { margin-top: -10px; }
	header .menubtn::after { margin-top: 10px; }
	header nav {
		position: absolute; top: 60px; right: -280px; width: 280px; height: 100vh;
		padding: 10px 0; background: rgba(255,255,255,.95); transform: translateX(0);
		transition: transform 0.6s cubic-bezier(0.215,0.61,0.355,1) 0s; z-index: 998;
		overflow-y: auto; white-space: nowrap;
	}
	header nav a {
		display: block; padding-left: 2.0rem; font-size: 1.6rem; color: #1f4873;
		line-height: 3.2; font-weight: 500;
	}
	header nav a:last-child { background: #e8ebf0; }
	.overlay {
		opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
		background: #000; z-index: -1;
	}
	.opened header .menubtn i { opacity: 0; }
	.opened header .menubtn::before { margin: 0; transform: translate(-50%,-50%) rotate(45deg); }
	.opened header .menubtn::after { margin: 0; transform: translate(-50%,-50%) rotate(-45deg); }
	.opened header nav { transform: translateX(-280px); }
	.opened .overlay {
		display: block;
		opacity: .5; transition: opacity 1s cubic-bezier(.215,.61,.355,1) 0s; z-index: 996;
	}
}

/* --------------------------------------------------------------------------
   footer
-------------------------------------------------------------------------- */

footer {
	position: relative; display: flex; align-items: center; width: 100%;
	padding: 48px 0 24px; background: #1f4873; color: #fff;
}
footer.fixed { position: fixed; bottom: 0; left: 0; }
footer .rights { width: 48%; margin-left: 50%; padding: 0 40px; text-align: right; }
footer .links { margin: 0 auto 16px; }
footer .links a { padding: 0 16px }
footer .copy { font-size: 1.4rem; color: #eee; }
footer .nic {
	position: fixed; bottom: 24px; left: 0; width: 600px; padding: 10px 0 10px 40px;
	background: #f6d7fd; border-radius: 0 999px 999px 0; color: #aa4c8f;
	transition: transform .2s ease; 
}
footer .nic::before {
	content: ''; position: absolute; top: 50%; right: 40px; width: 40px; height: 40px;
	background: 40% 0/600% auto no-repeat url(../img/ico.svg); transform: translateY(-50%);
}
footer .nic:hover::before {
	animation: shake 0.4s cubic-bezier(.36,.07,.19,.97) both infinite alternate;
}
footer .nic p { display: flex; align-items: center; font-size: 2.0rem; }
footer .nic p::before {
	content: ''; display: block; width: 120px; margin-right: 10px; aspect-ratio: 1/.5;
	background: 0 100%/auto 200% no-repeat url(../img/logo.svg);
}
footer .totop {
	display: block; position: fixed; bottom: 24px; right: 5%; width: 50px; height: 50px;
	margin: 0; padding: 0; background: 0 0/300% auto no-repeat url(../img/ico.svg);
	text-indent: 200%; white-space: nowrap; overflow: hidden; z-index: 99;
}
footer .totop.stop,footer.fixed .totop { position: absolute; top: -25px; }

@media screen and (max-width:768px) {
	footer { display: block; padding: 24px 5% 80px; }
	footer .rights { width: 100%; margin: 0 auto 24px; padding: 0; text-align: center; }
	footer .links a { display: block; margin: 0 0 16px; }
	footer .nic { display: block; bottom: 20px; width: 76%; padding: 10px 50px 10px 5%; }
	footer .nic::before { right: 10px; width: 30px; height: 30px; }
	footer .nic p { font-size: 1.6rem; line-height: 1.2; }
	footer .nic p::before { width: 80px; }
	footer .totop { bottom: 22px; }
}

/* --------------------------------------------------------------------------
   not found
-------------------------------------------------------------------------- */

#error .cover { height: 200px; background: linear-gradient(0.45turn,#1f4873 50%,#5a7591 70%); }
#error .cover h2 span { font-family: 'Wix Madefor Text'; }
#error section { position: relative; width: 100%; padding: 120px 0; }
#error article { display: flex; align-items: center; width: 800px; margin: 0 auto; }
#error i { display: block; width: 200px; }
#error p { width: 600px; padding: 0 40px; }

@media screen and (max-width:768px) {
	#error .cover { height: 20vh; }
	#error section { padding: 12vh 0; }
	#error article { display: block; width: 90%; }
	#error i { width: 50%; margin: 0 auto 24px; }
	#error p { width: 100%; padding: 0; }
}

/* --------------------------------------------------------------------------
   animations
-------------------------------------------------------------------------- */

.di { opacity: 0; transform: translateY(-30px); }
.di.active {
	transition: transform 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, opacity 1s ease 0s;
	opacity: 1; transform: translateY(0);
}
@keyframes shake {
	0% { transform: translate(0,-50%); }
	100% { transform: translate(5px,-50%); }
}