:root {
	--fwr: 400;
	--fwm: 500;
	--fwb: 700;
}
html {
	--10px: 0.625rem;
	--13px: 0.813rem;
	--14px: 0.875rem;
	--15px: 0.9375rem;
	--16px: 1rem;
	--18px: 1.125rem;
	--24px: 1.5rem;
	--28px: 1.75rem;
	--32px: 2rem;
	--36px: 2.25rem;
	--52px: 3.25rem;
	--72px: 4.5rem;
	scroll-behavior: smooth;
	scroll-padding-top: 6rem;

}
body {
	font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-size: var(--16px);
	line-height: 1.8;
	font-weight: var(--fwr);
	color: #000;
	position: relative;
	z-index: 1;
}

img {
	max-width: 100%;
	height: auto;
}

.bg {
	background: #dfedea;
	background: linear-gradient(to bottom,  #1ba398 0%,#dfedea 15%,#dfedea 85%,#1ba398 100%);
;
}

section {
	width: 90%;
	max-width: 1200px;
	margin: 0 auto 3rem;
	h1 {
		background: #1ba398;
		box-shadow: 0px 0px 0px 5px #1ba398;
		border: 1px dashed #fff;
		padding: .2rem .5rem .3rem;
 		font-size: var(--28px);
		font-weight: var(--fwb);
		color: #fff;
		margin-bottom: 1rem;
	}
}

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


/*--------------------------------------------------------------
	header
---------------------------------------------------------------- */
header.main-tool-bar {
	z-index: 100;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	transition: ease 0.2s;
}
header .headerWrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 1000px;
	margin: 0 auto;
	padding: .8rem 1rem .5rem;
	.nav {
		width: 90%;
	}
	nav ul {
		display: flex;
		justify-content: space-around;
		/*color: #fff;
		text-shadow: 1px 1px 1px #000;*/
		font-size: var(--16px);
		font-weight: var(--fwb);
		padding-top: .5rem;
		a {
			color: #333;
			text-shadow: 1px 1px 1px #acacac;
			&:hover {
				color: #878787;
			}
		}
	}
	img {
		max-width: 65px;
	}
}
/* スクロール後 */
header.main-tool-bar.is-active {
	background: rgb(43,177,161,0.8);
	.headerWrap {
		padding-top: 1%;
		padding-bottom: 1%;
	}
}

@media screen and (min-width: 768px) {
	.miniMenu {
		display: none;
	}
}


/*--------------------------------------------------------------
	header --767
---------------------------------------------------------------- */
@media screen and (max-width: 767px) {
	.miniMenu {
		position: fixed;
		top: 0;
		left: 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: .8rem 1rem .5rem;
		color: #fff;
		z-index: 999;
		width: 100%;
		img {
			max-width: 50px;
		}
	}
	.menu-btn {
		position: fixed;
		top: 4px;
		right: 10px;
		display: flex;
		height: 60px;
		width: 60px;
		justify-content: center;
		align-items: center;
		z-index: 90;
	}
	.menu-btn span,
	.menu-btn span:before,
	.menu-btn span:after {
		content: '';
		display: block;
		height: 3px;
		width: 25px;
		border-radius: 3px;
		background: #fff;
		transition: 0.5s ease;
		position: absolute;
	}
	.menu-btn span:before {
		bottom: 8px;
	}
	.menu-btn span:after {
		top: 8px;
	}
	#menu-btn-check:checked ~ .menu-btn span {
		background-color: rgba(255, 255, 255, 0);
		&::before {
			bottom: 0;
			transform: rotate(45deg);
		}
		&::after {
			top: 0;
			transform: rotate(-45deg);
		}
	}
	#menu-btn-check {
	    display: none;
	}
	.menu-content {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 100%;
		z-index: 80;
		background: #1ba398;
		transition: all 0.5s;
		ul {
			padding: 70px 1rem 0;
			li {
				border-bottom: solid 1px #fff;
				list-style: none;
				padding: .5rem;
				a {
					display: block;
					width: 100%;
					font-size: 15px;
					box-sizing: border-box;
					color:#fff;
					text-decoration: none;
					padding: 9px 0 10px;
					position: relative;
				}
				&:last-child {
					border: none;
					padding-top: 1.5rem;
					font-size: var(--18px);
					a {
						display: inline;
						font-size: var(--18px);
					}
				}
			}
		}
	}
	#menu-btn-check:checked ~ .menu-content {
	    left: 0;
	}

	/* スクロール後 */
	.miniMenu.is-active {
		background: rgba(43,177,161,0.8);
	}

	/* 768以上の設定を上書き */
	header .headerWrap {
		display: none;
	}
	header.main-tool-bar.is-active {
		display: none;
	}
}


/*--------------------------------------------------------------
	intro
---------------------------------------------------------------- */
#intro {
	position:relative;
	/*z-index: 100;*/
	width: 100%;
	height:100vh;
	/*background: url(../images/pht_main.jpg) center center no-repeat;
	background-size: cover;
	opacity: 0;
	animation: view_movie 1s linear 1s both;*/
	text-align: center;
	font-size: var(--18px);
	font-weight: var(--fwb);
	display: grid;
	place-items: center;
	.cntUnit {
		 p {
			margin-bottom: .5rem;
			animation: view 1s linear 1s both;
		}
		.logoTxtsvg {
			svg {
				width: 100%;
			}
		}
		.yearTxt {
			font-size: var(--72px);
			color: #263789;
			text-shadow: 1px 1px 1px #fff;
			h2 {
				font-size: var(--52px);
				margin-top: -1.5rem;
			}
		}
		.txtUnit {
			dl {
				margin-top: 1rem;
				font-size: var(--16px);
				dt,dd {
					font-weight: var(--fwr);
				}
			}
		}
	}
	.cntUnit > p img {
		max-height: 22vh;
	}
}

@keyframes view {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}


@media screen and (max-width: 767px) {
	#intro {
		.logoTxtsvg {
			margin-right: 1rem;
			margin-left: 1rem;
		}
		.cntUnit {
			.yearTxt {
				font-size: var(--36px);
				h2 {
					font-size: var(--28px);
					margin-top: -.8rem;
				}
			}
		}
	}
}


/* closeUnit
----------------------------------------- */
.closeUnit {
	position: absolute;
	top: 0;
	width: 100vw;
	height: 100%;
	background: rgba(25, 134, 59, 0.8);
	p {
		padding-top: 40vh;
		font-size: var(--24px);
		color: #fff;
		text-shadow: 1px 1px 1px #000;
	}
}

@media screen and (min-width: 961px) {
	.closeUnit {
		width: calc(100vw - 17px);
		padding-top: 7vh;
	}
}


/* chevron
----------------------------------------- */
.chevron {
	text-align: center;
	position: absolute;
	cursor: pointer;
	/* margin: auto; */
	bottom: 2%;
	left: 50%;
	transform: translate(-50%, 0);
}

.pulse {
	animation: pulse 2s infinite;
}
@keyframes pulse {
	0% {
		transform: translate(0, 0);
	}
 	50% {
		transform: translate(0, 10px);
	}
	100% {
		transform: translate(0, 0);
	}
}


/*--------------------------------------------------------------
	leadUnit
---------------------------------------------------------------- */
#leadUnit {
	text-align: center;
	font-size: var(--18px);
	font-weight: var(--fwb);
	#Lead {
		text-shadow: 1px 1px 1px #333;
		p {
			font-size: var(--28px);
			color: #1ba398;
			&:nth-of-type(2) {
				font-size: var(--32px);
				line-height: 1.2;
			}
		}`
	}

	/* 1文字づつのy方向を有効にする */
	.lead_text span {
		/* transformプロパティを有効にするため */
		display: inline-block;
	}

	.figWrap {
		margin: 3rem;
		ul {
			margin-bottom: 3rem;
			display: grid;
			gap: 50px;
			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
			align-items: flex-end;
			li {
				min-height: calc(150px + 5rem);
				img {
					max-width: 100%;
					height: auto;
				}
			}
		}
		div, li {
			background: #f9da92;
			border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%;
		}
		p {
			color: #fff;
			font-size: var(--32px);
			margin-bottom: .5em;
			text-shadow: rgb(52, 136, 69) 2px 0px 0px, rgb(52, 136, 69) 1.75517px 0.958851px 0px, rgb(52, 136, 69) 1.0806px 1.68294px 0px, rgb(52, 136, 69) 0.141474px 1.99499px 0px, rgb(52, 136, 69) -0.832294px 1.81859px 0px, rgb(52, 136, 69) -1.60229px 1.19694px 0px, rgb(52, 136, 69) -1.97998px 0.28224px 0px, rgb(52, 136, 69) -1.87291px -0.701566px 0px, rgb(52, 136, 69) -1.30729px -1.5136px 0px, rgb(52, 136, 69) -0.421592px -1.95506px 0px, rgb(52, 136, 69) 0.567324px -1.91785px 0px, rgb(52, 136, 69) 1.41734px -1.41108px 0px, rgb(52, 136, 69) 1.92034px -0.558831px 0px;
		}
	}
}

/*--------------------------------------------------------------
	event
---------------------------------------------------------------- */
#event {
	.map p {
		border: none;
	}
	ol {
		margin-top: 1rem;
		li {
			border-bottom: 1px dashed #000;
			padding: 1rem 1rem 0;
			&:last-child {
				border: none;
			}
			span {
				padding: 0 1rem;
				margin-right: .5rem;
				color: #fff;
				font-size: var(--18px);
				font-weight: var(--fwb);
			}
		}
	}
	div {
		&:nth-child(1) span {
			background: #df1d26;
		}
		&:nth-child(2) span {
			background: #3d7abd;
		}
	}
}


/*--------------------------------------------------------------
	panf
---------------------------------------------------------------- */
.panf {
	text-align: center;
	img {
		max-width: 800px;
		width: 100%;
		margin: 2rem 0;
		border: 1px solid #ccc;
	}
	.yearBtn {
		text-align: center;
		a {
			border: 2px solid #6cc3af;
			border-radius: 8px;
			color: #1ba398;
			font-weight: var(--fwb);
			padding: .5rem;
			&:hover {
				background: #6cc3af;
				color: #fff;
			}
		}
	}
}


/*--------------------------------------------------------------
	flyer
---------------------------------------------------------------- */
.paper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	img {
		max-width: 320px;
		width: 100%;
		margin: 2rem 0;
		border: 1px solid #ccc;
	}
	.yearBtn {
		text-align: center;
		a {
			border: 2px solid #6cc3af;
			border-radius: 8px;
			color: #1ba398;
			font-weight: var(--fwb);
			padding: .5rem;
			&:hover {
				background: #6cc3af;
				color: #fff;
			}
		}
	}
}


/*--------------------------------------------------------------
	access
---------------------------------------------------------------- */
.map {
	display: flex;
	gap: 30px;
	flex-wrap: wrap;
	justify-content: center;
	div {
		flex-basis: calc((100% - 30px) / 2);
		min-width: 300px;
		margin-top: 2rem;
		p {
			border: 1px solid #ccc;
		}
		iframe {
			width: 100%;
			height: 400px;
		}
	}
	h1 {
		background: none;
		border: 3px double #000;
		border-right: none;
		border-left: none;
		box-shadow: none;
		padding: .5rem;
		font-size: var(--24px);
		font-weight: var(--fwm);
		text-align: center;
		color: #000;
	}
	dl {
		margin-bottom: 1rem;
	}
}
@media screen and (max-width: 767px) {
	.map {
		display: block;
	}
}


/*--------------------------------------------------------------
	Links
---------------------------------------------------------------- */
#Links {
	padding-bottom: 3rem;
	ul {
		display: flex;
		flex-wrap: wrap;
	}
	li {
		width: 25%;
		padding: 1rem;
		text-align: center;
	}
	li:nth-of-type(7) {
		width: 50%;
	}
	li:nth-of-type(1) img, li:nth-of-type(7) img, li:nth-of-type(8) img, li:nth-of-type(10) img {
		border: 1px solid #acacac;
	}
}
@media screen and (max-width: 767px) {
	#Links {
		li {
			width: 50%;
		}
		li:nth-of-type(7) {
			width: 100%;
		}
	}
}
@media screen and (max-width: 375px) {
	#Links {
		li {
			width: 100%;
		}
	}
}


/*--------------------------------------------------------------
	footer
---------------------------------------------------------------- */
footer {
	padding-top: 1rem;
	background: #55c1b4;
	color: #fff;
	font-size: var(--14px);
	line-height: 1.6;
	section {
		margin-bottom: 0;
	}
	dl {
		/*max-width: 900px;
		margin: auto;*/
		margin-bottom: .5rem;
		padding: 0 2rem;
	}
	ul {
		background: #1ba398;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 1.5rem;
	}
}

@media screen and (max-width: 767px) {
	footer {
		font-size: var(--13px);

	}
}
footer .sns_link { padding: 20px 0; }
footer .sns_link li { margin-right: 2.54%; }
footer .sns_link li a { width: 5.34vw; height: 5.34vw; display: block; }
footer .sns_link li.facebook a { background: url(../images/facebook.svg) no-repeat center center; background-size: 100% 100%; }
footer .sns_link li.twitter a { background: url(../images/logo_x.svg) no-repeat center center; background-size: 100% 100%; width: 3.2vw; }
@media (min-width: 1025px) {
	footer .sns_link li a { width: 40px; height: 40px; }
}


/*--------------------------------------------------------------
	pagetop
---------------------------------------------------------------- */
.pagetop {
	display: none;
	position: fixed;
	bottom: 30px;
	right: 30px;
	a {
		display: block;
		background: rgba(51, 51, 51, 0.5);
		color: #fff;
		text-align: center;
		font-size: var(--16px);
		padding: 1rem;
		border-radius: 10px;
		&:hover {
			background: rgba(43, 177, 161, 0.5);
		}
	}
}