@charset "utf-8";
/*	===============================================================
	● ヘッダ/フッターCSSファイル
	---------------------------------------------------------------
	Release 2024.10.04                               Powerd by TDR
	=============================================================== */

	/*============================
		ヘッダ/グローバルメニュー
	============================*/
	header
	{
		z-index: 99;
		position: sticky;
		top: 0;
		left: 50%;
		width: 100%;
		height: 99px;
		background: #b1d149;
		padding: 0px 30px 0;
		box-shadow: 0px 10px 15px rgba(0, 0, 0, .1);
	}
	header .container
	{
		max-width:1250px;
		margin: 0 auto 0px;
		padding:0px 0px;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap:20px;
	}
	header .container > a
	{
		text-decoration: none;
		flex: 0 1 auto;
		border: none;
	}
	header h1.logo
	{
		max-width:412px;
		width:100%;
		display: flex;
		align-items: center;
	}
	header h1.logo img
	{
		width:100%;
	}
	header .btn_g_navi
	{
		display: none;
	}
	header .g_navi
	{
		width: 70%;
		flex: 1 1 auto;
	}
	header .g_navi ul
	{
		display:flex;
		flex-wrap:wrap;
		justify-content: space-between;
		align-items: center;
		gap: 10px 1em;
		padding-bottom:0px;
	}
	header .g_navi div.menu
	{
		display: none;
	}
	header .g_navi ul li
	{
		position: relative;
		text-align: center;
		line-height: 1.3;
		padding-left:0;
		margin-left:0;
	}
	header .g_navi ul li a
	{
		text-decoration: none;
		position: relative;
		padding:0 0;
		color:#000;
		border: none;
		text-shadow: 1px 1px 1px #fff;
	}
	header .g_navi ul li a:after
	{
		position: absolute;
		bottom: -10px;
		left: 0%;
		content: '';
		width: 100%;
		height: 2px;
		border-radius: 1px;
		background: #a9c057;
		transform: scale(0, 1);
		transform-origin: center top;
		/* transition: transform .3s; */
		transition: transform 0s;
	}
	header .g_navi ul li a:hover
	{
		color:#666;
	}
	header .g_navi ul li a:hover:after
	{
		transform: scale(1, 1);
	}

	@media screen and (max-width: 1024px)
	{
		header
		{
			height: 55px;
			padding: 0px 0 0 8px;
			box-shadow: 0px 5px 7px rgba(0, 0, 0, .1);
			/* overflow: hidden; */
		}
		header .container
		{
			height: 100%;
			gap:20px;
		}
		header .container > a
		{
			text-decoration: none;
			width: 255px;
			flex: 0 1 auto;
			align-items: center;
			border: none;
			height:100%;
			overflow: hidden;
		}
		header h1.logo
		{
			display: flex;
			align-items: center;
		}
		header .btn_g_navi
		{
			display: block;
			font-weight: bold;
			font-size: 1rem;
			background: #a3c143;
			transition: .5s;
			margin: 0 0 0 10px;
			width: 55px;
			height: 55px;
			padding: 20px 0;
			position:absolute;
			top:0;
			right:0;
			z-index: 999;
		}
		header .btn_g_navi p
		{
			width: 30px;
			height: 15px;
			margin: 0 auto;
			cursor: pointer;
			position: relative;
		}
		header .btn_g_navi span
		{
			height: 2px;
			background: #fff;
			width: 100%;
			left: 0;
			position: absolute;
		}
		header .btn_g_navi span:nth-child(1)
		{
			top: 0;
			transition: .5s;
		}
		header .btn_g_navi span:nth-child(2)
		{
			bottom: 0;
        	transition: .5s;
		}
		header .g_navi
		{
			width: 90vw;
			padding: 0px 0 10px;
			margin: 55px auto 0;
			position: fixed;
			top: 0;
			right: -120%;
			height: 100vh;
			min-width: 50vw;
			width:100%;
			transition: all .5s;
			background-color: rgba(255, 255, 255, 1);
			overflow: auto;
			overflow-y: scroll;
		}
		header .g_navi.open
		{
			right: 0;
		}
		header:has(.open) .btn_g_navi span:nth-child(1)
		{
			transform: translateY(6px) rotate(45deg);
		}
		header:has(.open) .btn_g_navi span:nth-child(2)
		{
			transform: translateY(-6px) rotate(-45deg);
		}
		header .g_navi ul
		{
			padding: 0;
			width: 100%;
			height: auto;
			display: flex;
			flex-wrap: wrap;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			gap:10px;
			padding-top:20px;
		}
		header .g_navi ul li
		{
			width: 100%;
			text-align: center;
		}
		header .g_navi ul li a
		{
			display: block;
			padding: 15px;
			border-bottom: #006a9b 1px solid;
		}
		header .g_navi ul li a:after
		{
			content:none;
		}

		header .g_navi div.menu
		{
			display: block;
			margin-bottom:30px;
		}
		header .g_navi ul:nth-child(2) li
		{
			width:calc((100% - 20px) / 2);
		}
	}

	/*============================
		menu
	============================*/
	section.contents_wrap .side_menu
	{
		width: 250px;
		padding:60px 38px 60px 25px;
		/* border-left:1px solid #e5e5e5; */
		border-right:1px solid #e5e5e5;
		/* background: #f7f7f7; */
		/* background: linear-gradient(#f6f6f6 80%, #fff 100%); */
		background: #fff;
		position: sticky;
		top:100px;
		/* height:100vh */
		height:100%;
	}
	section.contents_wrap .contents
	{
		max-width: calc( 100% - 250px );
		width: 100%;
		padding:60px 0px 60px 37px;
		border-left:1px solid #e5e5e5;
		position: relative;
		left:-1px;
	}

	.side_menu h2
	{
		font-size:2rem;
		font-weight: 400;
		text-align: center;
		letter-spacing: 0;
		white-space: nowrap;
	}
	.side_menu h2 span
	{
		display:block;
		font-size:1.3rem;
		margin:10px auto 45px;
		padding-top:7px;
		border-top:1px solid #ccc;
		color:#808080;
		position: relative;
	}
/*
	.side_menu h2 span::after
	{
		content: "";
		position: absolute;
		left: 0;
		top: -2px;
		height: 3px;
		width: 50px;
		background: #92b6fb;
	}
*/
	.side_menu > ul > li,
	.side_menu > ul > li > span
	{
		display: block;
		margin-bottom: 10px;
		font-size: 1.4rem;
	}
	.side_menu > ul > li.line
	{
		width: calc(100% - 20px);
		height: 0px;
		line-height: 1;
		border-top:1px dashed #ccc;
		margin:20px 0 20px auto;
	}
	.side_menu > ul > li > :is( a, span )
	{
		position: relative;
		display: inline-block;
		color:#222;
		text-decoration: none;
		padding-left:20px;
		transition: 0.3s;
	}
	.side_menu > ul > li > :is( a, span )::before
	{
		content:"";
		position: absolute;
		left:0;
		display: block;
		margin-top: 0.5em;
		width:10px;
		height:10px;
		background-color: #dad6cb;
		mask-repeat: no-repeat;
		mask-position: center;
		mask-size: 100%;
		mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>');
		transform: scale(1,0.75);
		transition: 0.1s;
	}
	.side_menu > ul > li > a.outside::after
	{
		content:"";
		position: absolute;
		top:0;
		right:-20px;
		display: block;
		margin-top: 0.5em;
		width:10px;
		height:10px;
		background-color: #dad6cb;
		mask-repeat: no-repeat;
		mask-position: center;
		mask-size: 100%;
		mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M73 39c-14.8-9.1-33.4-9.4-48.5-.9S0 62.6 0 80V432c0 17.4 9.4 33.4 24.5 41.9s33.7 8.1 48.5-.9L361 297c14.3-8.7 23-24.2 23-41s-8.7-32.2-23-41L73 39z"/></svg>');
		transform: scale(0.8,0.8);
	}
	.side_menu > ul > li a:hover
	{
		color:#ffaaaa;
	}
	.side_menu > ul > li > a:hover::before
	{
		left:2px;
	}
	.side_menu > ul > li :is( a, span ).active
	{
		color:#ffaaaa;
		font-weight: 900;
	}

	.side_menu .sub_menu
	{
		font-size:1.3rem;
		padding-left:20px;
		margin-left: 1em;
		list-style-type: disc;
	}
	.side_menu .sub_menu li
	{
		margin-bottom: 10px;
		line-height: 1.3;
	}
	.side_menu .sub_menu li::marker
	{
		color:#ccc;
	}
	.side_menu .sub_menu li > a
	{
		color:#222;
		text-decoration: none;
		transition: 0.3s;
	}


	@media screen and (max-width: 1024px)
	{
		.side_menu
		{
			display:none;
		}
		section.contents_wrap .contents
		{
			max-width: 100%;
			width: 100%;
			padding:30px 15px 30px 15px;
		}
	}

	/*============================
		フッター
	============================*/
	footer .ft_info
	{
		background: #b1d149;
		padding:45px 0px 45px;
	}
	footer .ft_info .container
	{
		position: relative;
		padding:0 30px;
		z-index: 10;
	}
	.ft_wrap
	{
		display: flex;
		justify-content: space-between;
		gap:90px;
	}
	.ft_wrap .ft_name
	{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		width:490px;
	}
	.ft_wrap .ft_name > a
	{
		display: block;
		width: 100%;
		flex-grow: 2;
	}
	.ft_wrap .ft_name h2
	{
		font-size: 2.8rem;
		background: url(/images/cmn/logo_ft.png) no-repeat;
		background-position: right top 15px;
		background-size: auto 25px;
	}
	.ft_wrap .ft_name h2 span
	{
		font-size: 1.5rem;
		display: block;
		margin-top:5px;
		padding-top:5px;
		border-top:2px solid #fff;
	}
	.ft_wrap .ft_name ul
	{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-end;
		gap:10px;
	}
	.ft_wrap .ft_name ul li
	{
		width:calc((100% - 10px * 2) / 2);
		height:50px;
		background:#fff;
		padding:5px;
		margin-left:0;
		border-radius: 8px;
	}
	.ft_wrap .ft_name ul li img
	{
		width:100%;
		height:100%;
		object-fit: contain;
	}
	.ft_wrap .address
	{
		width:calc(100% - 490px - 90px );
		padding:25px 30px;
		border-radius: 15px;
		background: #cfe28f;
	}
	.ft_wrap .address dl
	{
		display: flex;
		gap:1em;
		justify-content: flex-start;
		margin:0;
	}
	.ft_wrap .address dl dt
	{
		width:4.5em;
	}
	.ft_wrap .address a
	{
		font-size: 1.5rem;
		margin-top:0.5em;
		display: inline-block;
		text-decoration: underline;
		text-underline-offset: .3em;
		text-decoration-color: #0f88bc;
		transition: 0.1s;
	}
	.ft_wrap .address a::before
	{
		content: "";
		display: inline-block;
		width: 1em;
		height: 1em;
		margin-right: 0.5em;
		background-color: #70a5ff;
		mask-repeat: no-repeat;
		mask-position: center;
		mask-size: 100%;
		mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M256 0c4.6 0 9.2 1 13.4 2.9L457.7 82.8c22 9.3 38.4 31 38.3 57.2c-.5 99.2-41.3 280.7-213.6 363.2c-16.7 8-36.1 8-52.8 0C57.3 420.7 16.5 239.2 16 140c-.1-26.2 16.3-47.9 38.3-57.2L242.7 2.9C246.8 1 251.4 0 256 0zm0 66.8l0 378.1C394 378 431.1 230.1 432 141.4L256 66.8s0 0 0 0z"/></svg>');
	}


	footer > p
	{
		text-align: center;
		color:#a9c057;
		font-size:1.2rem;
		padding:0.3em;
	}


	@media screen and (max-width: 768px)
	{
		footer .ft_info
		{
			padding:30px 0px;
		}
		footer .ft_info .container
		{
			padding:0 15px;
		}
		.ft_wrap
		{
			display: block;
		}
		.ft_wrap .ft_name
		{
			display: block;
			width:100%;
		}
		.ft_wrap .ft_name > a
		{
			display: block;
			width: 100%;
			margin-bottom:30px;
		}
		.ft_wrap .ft_name h2
		{
			font-size: 2rem;
			background-position: right 2px bottom 3px;
			background-size: auto 15px;
		}
		.ft_wrap .ft_name h2 span
		{
			font-size: 1.2rem;
			display: block;
			margin-top:5px;
			padding-top:5px;
			border-top:2px solid #fff;
		}
		.ft_wrap .ft_name ul li
		{
			width:80%;
			height:50px;
			background:#fff;
			padding:5px;
			margin:auto;
			border-radius: 8px;
		}
		.ft_wrap .address
		{
			width:100%;
			margin-top: 30px;
			padding:15px 20px;
			border-radius: 10px;
			font-size: 1.3rem;
		}
		.ft_wrap .address a
		{
			font-size: 1.2rem;
		}
	}