/* CSS Document */
@import url('//fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');
/* Noto JP
font-family: 'Noto Sans JP', sans-serif;
font-weight: 400;
font-weight: 700;
*/

/* Adobe fonts
font-family: "fot-tsukuardgothic-std", sans-serif;
font-weight: 700;
font-family: sofia-pro, sans-serif;
font-weight: 900;
font-family: toppan-bunkyu-midashi-go-std, sans-serif;
font-weight: 900;
*/


:root{
	--color: #231916;
	--color-rgb: 35, 25, 22;
	--color-theme: #00b4ec;
	--color-theme-rgb: 0, 180, 236;
	--color-point: #f2e841;
	--wrap: calc(100vw - 36px);
	}
	@media (min-width: 576px) {
	:root{
		--wrap: min(calc(100vw - 48px), 1100px);
		}
	}

html{}
	html:focus-within{
		scroll-behavior: smooth;
		}

body{
	color: var(--color);
	font-size: 16px;
	font-family: 'Noto Sans JP', sans-serif;
	/*font-family: 'LINE Seed JP', 'BIZ UDPGothic', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', sans-serif;*/
	/*font-feature-settings: "palt";*/
	/*text-align: justify; 英文では解除*/
	overflow-wrap: break-word;
	line-height: 1;
	}
	body.nav{
		overflow: hidden;
		}
	::selection{
		background: var(--color-theme);
		color: #fff;
		}
	::-moz-selection{
		background: var(--color-theme);
		color: #fff;
		}
	_::content, _:future, body:not(*:root) {
		/* Chromeのハック */
		/*フォント細いって言われたとき
		font-weight: 500;
		*/
		}
	_::-webkit-full-page-media, _:future, :root body{
		/* safariのハック */
		}
	@-moz-document url-prefix(){
		/* Firefoxのハック */
		.xxx{
		
			}
		}

a{
	color: inherit;
	word-break: break-word;
	}
	.done a{
		transition-property: color,text-decoration,background,background-color,background-size,border,border-color,box-shadow,filter,opacity;
		transition-duration: 0.2s;
		transition-timing-function: ease-out;
		}

main{}
	main a{
		color:var(--color-theme);
		}
		main a:where(:hover,:focus){
			text-decoration: underline;
			}
	main p{
		line-height: 1.65;
		}

:where(input,textarea,select){
	accent-color: var(--theme-color);
	}
	:where(input,textarea,select):focus{
		border: 1px solid var(--theme-color);
		}

:where(input[type="radio"],input[type="checkbox"]){}
	:where(input[type="radio"],input[type="checkbox"])+label{}
		:where(input[type="radio"],input[type="checkbox"])+label:before{
			color: rgba(var(--color-rgb),0.2);
			}
	:where(input[type="radio"],input[type="checkbox"]):checked+label{}
		:where(input[type="radio"],input[type="checkbox"]):checked+label:before{
			animation: checked 0.2s forwards;
			color: var(--color-theme);
			}
		@keyframes checked{
			30% {box-shadow: 0 0 0 1em rgba(var(--color-theme-rgb),0.5);}
			}

#wrapper{
	display: grid;
	}
	#wrapper #header{
		padding-left: 18px;
		z-index: 110;
		}
	#wrapper #nav{
		z-index: 120;
		}
	@media (min-width: 768px) {
	#wrapper{
		grid-template-columns: 1fr;
		grid-template-areas: 'header';
		}
		#wrapper #header{
			grid-area: header;
			}
		#wrapper #nav{
			grid-area: header;
			align-self: center;
			justify-self: end;
			padding-right: 18px;
			}
		}
	@media (min-width: 1200px) {
		#wrapper #header{
			padding-left: 48px;
			}
		#wrapper #nav{
			padding-right: 48px;
			}
		}

#header{
	position: sticky;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 48px;
	background: #fff;
	}
	@media (min-width: 768px) {
		#header{
			height: 80px;
			}
		#header #navButton{
			display: none;
			}
		}

#siteName{}
	#siteName a{
		display: block;
		height: 36px;
		background: url('../images/logo.svg') center no-repeat;
		background-size: contain;
		font-size: 0;
		aspect-ratio: 1 / 0.3;
		}
	@media (min-width: 768px) {
		#siteName a{
			height: 56px;
			}
		}

#navButton{
	display: grid;
	align-content: center;
	justify-content: center;
	grid-gap: 5px;
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	color: inherit;
	text-align: center;
	box-sizing: border-box;
	overflow: hidden;
	pointer-events: all;
	cursor: pointer;
	}
	#navButton i{
		width: 22px;
		height: 2px;
		background: currentColor;
		border-radius: 1px;
		animation-duration: 0.75s;
		animation-fill-mode: forwards;
		transition: transform 0.75s;
		}
	#navButton.on{}
		#navButton.on i{}
			#navButton.on i:nth-of-type(1){
				animation-name: navButton-bar01_on;
				}
			#navButton.on i:nth-of-type(2){
				animation-delay: 0.375s;
				animation-duration: 0.1875s;
				animation-name: navButton-bar02_on;
				}
			#navButton.on i:nth-of-type(3){
				animation-name: navButton-bar03_on;
				}
	#navButton.off{}
		#navButton.off i{}
			#navButton.off i:nth-of-type(1){
				animation-name: navButton-bar01_off;
				}
			#navButton.off i:nth-of-type(2){
				animation-name: navButton-bar02_off;
				}
			#navButton.off i:nth-of-type(3){
				animation-name: navButton-bar03_off;
				}
	@keyframes navButton-bar01_on{
		0% {
			transform: translateY(0);
			}
		50% {
			transform: translateY(7px) rotate(0);
			}
		100% {
			transform: translateY(7px) rotate(45deg);
			}
		}
	@keyframes navButton-bar01_off{
		0% {
			transform: translateY(7px) rotate(45deg);
			}
		50% {
			transform: translateY(7px) rotate(0);
			}
		100% {
			transform: translateY(0);
			}
		}
	@keyframes navButton-bar02_on{
		0% {
			transform: scaleX(1);
			}
		100% {
			transform: scaleX(0);
			}
		}
	@keyframes navButton-bar02_off{
		0% {
			transform: scaleX(0);
			}
		100% {
			transform: scaleX(1);
			}
		}
	@keyframes navButton-bar03_on{
		0% {
			transform: translateY(0);
			}
		50% {
			transform: translateY(-7px) rotate(0);
			}
		100% {
			transform: translateY(-7px) rotate(-45deg);
			}
		}
	@keyframes navButton-bar03_off{
		0% {
			transform: translateY(-7px) rotate(-45deg);
			}
		50% {
			transform: translateY(-7px) rotate(0);
			}
		100% {
			transform: translateY(0);
			}
		}

#nav{}
	#nav ul{
		list-style: none;
		}
	#nav li{}
	#nav a{
		display: grid;
		grid-template-columns: 20px auto;
		align-items: center;
		grid-gap: 11px;
		font-weight: bold;
		text-align: center;
		}
		#nav a:before{
			content: "";
			width: 20px;
			height: 25px;
			background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 25"><path fill="%23fff000" d="m11.88.75s-.08,0-.12,0h0s-2.73,0-2.73,0c-.08.03-.17.05-.27.05-.03,0-.06,0-.09,0-.18-.02-.36-.04-.54-.04C4.06.75.75,6.02.75,12.5s3.31,11.75,7.38,11.75c.18,0,.36-.02.54-.04.02,0,.05,0,.07,0,.08,0,.17.02.25.05h2.77s.08,0,.12,0c4.07,0,7.38-5.27,7.38-11.75S15.94.75,11.88.75Z"/><path fill="%23231916" d="m15.56,11.5h-3.4c-.55,0-1,.45-1,1s.45,1,1,1h2.37c-.22,3.26-1.48,5.29-2.37,5.29-.98,0-2.4-2.45-2.4-6.29s1.42-6.29,2.4-6.29c.56,0,1.22.79,1.69,2.01.2.52.78.77,1.29.57.51-.2.77-.78.57-1.29-.81-2.09-2.1-3.29-3.56-3.29-2.51,0-4.4,3.56-4.4,8.29s1.89,8.29,4.4,8.29,4.4-3.56,4.4-8.29c0-.55-.45-1-1-1ZM12.5.05v-.05h-3.75v.05c-.21-.02-.41-.05-.62-.05C3.64,0,0,5.6,0,12.5s3.64,12.5,8.12,12.5c.21,0,.42-.02.62-.05v.05h3.75v-.05c4.19-.49,7.5-5.87,7.5-12.45S16.69.54,12.5.05ZM1.5,12.5C1.5,6.61,4.46,1.63,8,1.51,5.47,3.63,3.75,7.76,3.75,12.5s1.72,8.87,4.25,10.99c-3.54-.12-6.5-5.1-6.5-10.99Zm10.38,11c-3.59,0-6.62-5.04-6.62-11S8.28,1.5,11.88,1.5s6.62,5.04,6.62,11-3.03,11-6.62,11Z"/></svg>');
			}
	@media (max-width: 767.98px) {
		#nav{
			position: fixed;
			top: 48px;
			left: 100%;
			width: min(100%, 480px);
			height: calc(100% - 48px);
			padding: 40px 0;
			background: #fff;
			overflow-y: auto;
			overscroll-behavior-y: none;
			transition: transform 0.2s ease-out;
			}
			.nav #nav{
				transform: translateX(-100%);
				}
			#nav h2{
				color: var(--color-theme);
				font-size: 40px;
				font-weight: bold;
				letter-spacing: 0.065em;
				text-align: center;
				text-transform: uppercase;
				}
			#nav ul{
				margin-top: 16px;
				background: var(--color-theme);
				color: #fff;
				}
			#nav li+li{
				border-top: 1px dashed #fff;
				}
			#nav a{
				height: 140px;
				padding: 0 calc(50% - 90px);
				color: inherit;
				}
		}
	@media (min-width: 768px) {
		#nav{
			position: sticky;
			top: 0;
			}
		#nav h2{
			display: none;
			}
		#nav ul{
			display: flex;
			align-items: center;
			grid-gap: 36px;
			height: 80px;
			}
		}
	@media (min-width: 1200px) {
		#nav ul{
			grid-gap: 48px;
			}
		}

#pagePath{
	margin: calc(var(--space) / 2) 0;
	}
	#pagePath ul{
		display: flex;
		flex-wrap: wrap;
		grid-gap: 0.5em;
		width: var(--wrap);
		margin: auto;
		}
	#pagePath li{
		line-height: 1.4;
		}
		#pagePath li:last-child{
			font-weight: bold;
			}
	#pagePath li+li{
		display: grid;
		grid-template-columns: 1em auto;
		grid-gap: 0.5em;
		}
		#pagePath li+li:before{
			content: "";
			width: 1em;
			height: 1em;
			-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.163 4.516c0.418 0.408 4.502 4.695 4.502 4.695 0.223 0.219 0.335 0.504 0.335 0.789s-0.112 0.57-0.335 0.787c0 0-4.084 4.289-4.502 4.695-0.418 0.408-1.17 0.436-1.615 0-0.446-0.434-0.481-1.041 0-1.574l3.747-3.908-3.747-3.908c-0.481-0.533-0.446-1.141 0-1.576s1.197-0.409 1.615 0z" /></svg>') center no-repeat;
			-webkit-mask-size: contain;
			background: currentColor;
			transform: translateY(0.15em);
			opacity: 0.5;
			}

#pageTop{
	display: none;
	}

#floatingNav{
	position: sticky;
	right: 0;
	bottom: 24px;
	display: flex;
	justify-content: end;
	order: 10;
	z-index: 10;
	}
	#floatingNav a{
		display: grid;
		grid-template-columns: 20px 7em;
		align-items: center;
		grid-gap: 11px;
		min-height: 64px;
		padding: 4px 16px;
		background: #fff;
		border: 4px solid var(--color-theme);
		border-right: none;
		border-radius: 64px 0 0 64px;
		font-weight: bold;
		text-align: center;
		line-height: 1.4;
		}
		#floatingNav a:before{
			content: "";
			width: 20px;
			height: 25px;
			background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 25"><path fill="%23fff000" d="m11.88.75s-.08,0-.12,0h0s-2.73,0-2.73,0c-.08.03-.17.05-.27.05-.03,0-.06,0-.09,0-.18-.02-.36-.04-.54-.04C4.06.75.75,6.02.75,12.5s3.31,11.75,7.38,11.75c.18,0,.36-.02.54-.04.02,0,.05,0,.07,0,.08,0,.17.02.25.05h2.77s.08,0,.12,0c4.07,0,7.38-5.27,7.38-11.75S15.94.75,11.88.75Z"/><path fill="%23231916" d="m15.56,11.5h-3.4c-.55,0-1,.45-1,1s.45,1,1,1h2.37c-.22,3.26-1.48,5.29-2.37,5.29-.98,0-2.4-2.45-2.4-6.29s1.42-6.29,2.4-6.29c.56,0,1.22.79,1.69,2.01.2.52.78.77,1.29.57.51-.2.77-.78.57-1.29-.81-2.09-2.1-3.29-3.56-3.29-2.51,0-4.4,3.56-4.4,8.29s1.89,8.29,4.4,8.29,4.4-3.56,4.4-8.29c0-.55-.45-1-1-1ZM12.5.05v-.05h-3.75v.05c-.21-.02-.41-.05-.62-.05C3.64,0,0,5.6,0,12.5s3.64,12.5,8.12,12.5c.21,0,.42-.02.62-.05v.05h3.75v-.05c4.19-.49,7.5-5.87,7.5-12.45S16.69.54,12.5.05ZM1.5,12.5C1.5,6.61,4.46,1.63,8,1.51,5.47,3.63,3.75,7.76,3.75,12.5s1.72,8.87,4.25,10.99c-3.54-.12-6.5-5.1-6.5-10.99Zm10.38,11c-3.59,0-6.62-5.04-6.62-11S8.28,1.5,11.88,1.5s6.62,5.04,6.62,11-3.03,11-6.62,11Z"/></svg>');
			}
	@media (min-width: 576px) {
		#floatingNav a{
			grid-gap: 16px;
			padding: 8px 16px 8px 24px;
			font-size: 20px;
			}
		}
	@media (min-width: 768px) {
		#floatingNav{
			position: fixed;
			}
		}

#footer{
	display: grid;
	grid-template-columns: 1fr var(--wrap) 1fr;
	grid-gap: 40px 0;
	padding: 40px 0;
	border-top: 2px solid var(--color-theme);
	}
	#footer > *{
		grid-column: 2;
		}
	@media (min-width: 992px) {
		#footer{
			grid-gap: 64px 0;
			padding-top: 64px;
			}
		}

#fBanner{
	justify-self: center;
	width: min(90%, 500px);
	}
	#fBanner svg{
		width: 100%;
		height: auto;
		aspect-ratio: 5.24 / 1;
		}

#fNav{}
	#fNav ul{
		display: grid;
		border: 2px solid var(--color-theme);
		border-radius: 24px;
		}
	#fNav li{
		grid-row: 1;
		}
	#fNav li+li{
		border-left: 2px solid var(--color-theme);
		}
	#fNav a{
		display: grid;
		place-items: center;
		height: 44px;
		padding: 8px 24px;
		color: var(--color-theme);
		font-weight: bold;
		}
	@media (min-width: 576px) {
		#fNav{
			display: flex;
			justify-content: center;
			}
		#fNav ul{
			grid-template-columns: 1fr 1fr;
			}
		}

#fAddress{}
	#fAddress p{
		color: var(--color-theme);
		font-weight: bold;
		font-size: min(3.6vw, 16px);
		text-align: center;
		line-height: 1.65;
		}
	@media (min-width: 576px) {
		#fAddress br:nth-child(1){
			display: none;
			}
		#fAddress br:nth-child(4){
			display: none;
			}
		}

#copyright{}
	#copyright p{
		color: var(--color-theme);
		font-size: 12px;
		font-weight: bold;
		text-align: center;
		}

#pagenation{}
	#pagenation :where(ul,ol){
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		grid-gap: 0.5em;
		width: var(--wrap);
		margin: auto;
		list-style: none;
		}
	#pagenation a{
		display: grid;
		place-items: center;
		font-weight: bold;
		text-decoration: none;
		}
		#pagenation a:not([rel]){
			height: 2.6em;
			background: #fff;
			border: 1px solid currentColor;
			border-radius: 100%;
			color: var(--color-theme);
			aspect-ratio: 1;
			}
		#pagenation a[rel]{
			grid-gap: 4px;
			color: inherit;
			}
			#pagenation a[rel]:before{
				width: 1em;
				height: 1em;
				-webkit-mask-repeat: no-repeat;
				-webkit-mask-position: center;
				-webkit-mask-size: contain;
				background: currentColor;
				}
		#pagenation a[rel="prev"]{
			grid-template-columns: 1em auto;
			margin-right: 8px;
			}
			#pagenation a[rel="prev"]:before{
				content: "";
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.163 4.516c0.418 0.408 4.502 4.695 4.502 4.695 0.223 0.219 0.335 0.504 0.335 0.789s-0.112 0.57-0.335 0.787c0 0-4.084 4.289-4.502 4.695-0.418 0.408-1.17 0.436-1.615 0-0.446-0.434-0.481-1.041 0-1.574l3.747-3.908-3.747-3.908c-0.481-0.533-0.446-1.141 0-1.576s1.197-0.409 1.615 0z" /></svg>');
				transform: scale(-1, 1);
				}
		#pagenation a[rel="next"]{
			grid-template-columns: auto 1em;
			margin-left: 8px;
			}
			#pagenation a[rel="next"]:before{
				content: "";
				order: 1;
				-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.163 4.516c0.418 0.408 4.502 4.695 4.502 4.695 0.223 0.219 0.335 0.504 0.335 0.789s-0.112 0.57-0.335 0.787c0 0-4.084 4.289-4.502 4.695-0.418 0.408-1.17 0.436-1.615 0-0.446-0.434-0.481-1.041 0-1.574l3.747-3.908-3.747-3.908c-0.481-0.533-0.446-1.141 0-1.576s1.197-0.409 1.615 0z" /></svg>');
				}
		#pagenation a.lsc-current-page{
			background: var(--color-theme);
			border-color: transparent;
			color: #fff;
			pointer-events: none;
			}
	#pagenation ul{}
		#pagenation ul li{
			display: flex;
			}
		#pagenation ul li+li{}
			#pagenation ul li+li:before{
				content: "｜";
				margin-right: 0.5em;
				}

.anchor{
	scroll-margin: 48px;
	outline: none;
	}
	@media (min-width: 768px) {
		.anchor{
			scroll-margin: 80px;
			}
		}

.infoWin{}
	.infoWin dl{
		display: grid;
		}
	.infoWin dt{
		margin-bottom: 8px;
		font-size: clamp(14px, 2.4vw, 16px);
		font-weight: bold;
		line-height: 1.5;
		z-index: 1;
		}
	.infoWin dd:last-child{
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: clamp(6px, 1.5vw, 10px);
		margin-top: 8px;
		}
	.infoWin dd{}
		.infoWin dd a{
			grid-row: 1;
			display: grid;
			place-items: center;
			height: clamp(24px, 4.8vw, 32px);
			padding: 0 8px;
			border: 1px solid currentColor;
			border-radius: clamp(12px, 2.4vw, 16px);
			color: var(--color-theme);
			font-size: clamp(10px, 2.1vw, 14px);
			font-weight: bold;
			text-align: center;
			text-decoration: none;
			}
			.infoWin dd a:hover{
				background: var(--color-theme);
				border-color: transparent;
				color: #fff;
				}
			.infoWin dd a:only-child{
				grid-column: 1 / 3;
				}

.infoPin{
	width: 30px;
	height: 40px;
	-webkit-mask: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 40"><path d="m15,0C6.72,0,0,6.72,0,15c0,9.64,13.39,17.58,13.39,23.39,0,.89.72,1.61,1.61,1.61s1.61-.72,1.61-1.61c0-5.81,13.39-13.75,13.39-23.39C30,6.72,23.28,0,15,0ZZ"/></svg>') center no-repeat;
	-webkit-mask-size: contain;
	background: var(--color-theme) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 40" fill="white"><path d="m15,1c7.73,0,14,6.27,14,14,0,5.06-4.1,9.77-7.71,13.94-3.05,3.51-5.68,6.54-5.68,9.45,0,.34-.27.61-.61.61s-.61-.27-.61-.61c0-2.91-2.63-5.94-5.68-9.45-3.61-4.17-7.71-8.88-7.71-13.94C1,7.27,7.27,1,15,1m0-1C6.72,0,0,6.72,0,15c0,9.64,13.39,17.58,13.39,23.39,0,.89.72,1.61,1.61,1.61s1.61-.72,1.61-1.61c0-5.81,13.39-13.75,13.39-23.39C30,6.72,23.28,0,15,0Z"/><circle cx="15" cy="15.08" r="5.36" opacity="0.4"/></svg>') center no-repeat;
	}