﻿@charset "utf-8";
/* head,text */
/* Link */

:root .btn {
	font-size: 1rem;
	display:flex;
	align-items:center;
	justify-content:center;
	width:fit-content;
	max-width: 100%;
	min-height: 3em;
	--basecolor:var(--key01);
	--subcolor:#fff;
	color:var(--subcolor);
	background:var(--basecolor);
	border:solid 1px var(--basecolor);
	padding:0.5em 4.5em;
	margin-block:2em;
	transition:var(--hover);
	cursor:pointer;
	position:relative;
	z-index:2;
	font-weight:600;
	pointer-events: auto;
	border-radius: 3em;
	text-decoration: none !Important;
	line-height:1.2;
	gap:1em;
	border:solid 1px var(--subcolor);
}
:root :is(.btn,.slick-arrow) i{
	display:flex;
	align-items:center;
	background:var(--subcolor);
	aspect-ratio:1 / 1;
	height: 1.75em;
	border-radius:50%;
	position:absolute;
	right:1.25em;
	z-index:1;
}
:root :is(.btn,.slick-arrow) i:before,
:root :is(.btn,.slick-arrow) i:after{
	content:"";
	display:block;
	color:var(--basecolor);
	margin:auto;
	position:absolute;
	right: 0.35em;
	z-index: -1;
	transition:var(--hover);
	top:0.9em;
}
:root :is(.btn,.slick-arrow) i:before{
	height:3px;
	width:1.15em;
	background:var(--basecolor);
}
:root :is(.btn,.slick-arrow) i:after{
	height:0.5em;
	width:0.5em;
	clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
	background:var(--basecolor);
	top:0.55em;
	bottom:auto;
	right:0.25em;

}
:root .end-area{
	margin-block:4em 0;
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:2em;
}
:root .slick-arrow{
	--basecolor:var(--key);
	--subcolor:#fff;
	color:var(--subcolor);
	opacity:1;
	background:var(--basecolor);
	border:solid 1px var(--basecolor);
	inset:0 0 0 auto;
	transition:var(--hover);
	overflow:hidden;
	text-indent:999em;
	margin:auto;
	transform:none;
}
:root .slick-prev{
	inset:0 auto 0 0;
	transform:scaleX(-1);
}
:root .slick-arrow:is(:hover,:focus){
	opacity:1;
	background:var(--subcolor);
	color:var(--basecolor);	
}
:root .slick-arrow:after{
	right:1.25em;
}
:root .slick-arrow:is(:hover,:focus):before{
	background:var(--basecolor);	
}
:root .slick-arrow:is(:hover,:focus):after{
	color:var(--basecolor);	
}

@media (hover: hover) and (pointer: fine),
(hover: none) and (pointer: coarse) {
	:root .btn:hover {
		--basecolor: #fff;
		--subcolor:var(--key01);
	}
	:root .btn:hover {

	}
}
@media screen and (max-width: 767px) {
	:root .btn {
		min-height:4em;
		margin-block: 1.5em;
	}
	:root .end-area{
		margin-block:2em 0;
	}
}

.flex-columns{
	display:flex;
	--gap:4em;
	gap:var(--gap);
	flex-wrap:wrap;
}
.flex-columns:has( > .flex-column:nth-child(2):last-child){
	flex-wrap:nowrap;
}
.flex-columns .flex-column{
	flex-grow:1;
}
.flex-columns .flex-column:has(> img:first-child:last-child){
	flex-grow:inherit;
}
.flex-columns.grid-sort{
	display:grid;
	grid-template-columns: auto 1fr;
	gap:calc(var(--gap) * 0.5) var(--gap);
}
.left-middle {
	grid-column: 1;
	grid-row: 1 / 3;
}
.right-top {
	grid-column: 2;
	grid-row: 1; 
}
.right-bottom {
	grid-column: 2; 
	grid-row: 2;
}
@media screen and (max-width: 1200px) {
	.flex-columns{
		--gap:2em;
	}
}
@media screen and (max-width: 767px) {
	.flex-columns{
		--gap:2em;
		flex-direction:column;
	}
	.flex-columns.grid-sort{
		display:flex;
		--gap:2em;
	}
}


.captions small{
	display:block;
	font-size:1rem;
	font-weight:400;
	margin-block:0.5em;
	text-indent:-1em;
	margin-left:1em;
}
/* table */
.table_wrap table {
	width: 100%;
}
.table_wrap table tr{
	font-size:1.125rem;
	border-bottom:1px solid #c5c5c5;
}
.table_wrap table tr > *{
	padding-block:1em;
	line-height:1.6;
}
.table_wrap table tr th{
	width:12em;
	font-weight:bold;
	padding-inline:2em;
	vertical-align:text-top;
}
@media screen and (max-width:767px) {
	.table_wrap table tr{
		display:block;
		padding-block:0.5em;
	}
	.table_wrap table tr > *{
		display:block;
		padding-block:0;
	}
	.table_wrap table tr th{
		width:100%;
		padding-inline:0;
	}
}
/* list */
.news-items{
		border-top: 1px solid #d3d3d3;
}
.news-items .news-item a {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 1.5em;
	font-size: 1rem;
	text-decoration-color: transparent;
	padding: 1.5em;
	border-bottom: 1px solid #d3d3d3;
	background:#fff;
}
.news-items .news-item a time{
	line-height:2;
}
.news-items .news-item .arrow{
	display:flex;
	background:var(--key);
	height:2em;
	color:#fff;
	justify-content:center;
	align-items:center;
	border-radius:50%;
	aspect-ratio:1 / 1;
}
.news-items .news-item p{
	flex-grow:1;
	padding-top:0.25em;
	line-height:1.25;
	text-decoration:underline solid 1px transparent;
	transition:text-decoration .4s;
}
.news-items .news-item a:hover {
	background:var(--bg);
}
.news-items .news-item a:hover p{
	text-decoration-color:var(--fontcolor);
}
.news-items.card-style {
	display:flex;
	flex-wrap:wrap;
	gap:1.5em 3.5%;
	border:none;
}
.news-items.card-style.slick-slider{
	gap:0;
}
.news-items.card-style .news-item{
	flex-basis:31%;
}
.news-items.card-style .news-item a{ 
	flex-direction:column;
	border:none;
	border-radius:1rem;
	padding:1.5em 1.5em 1em;;
}
.news-items.card-style .news-item p{
	line-height:1.8;
	padding: 0;
}
.news-items.card-style .news-item time{
	font-size:0.875rem;
	line-height:inherit;
}
.news-items.card-style .news-info{
	display:flex;
	margin-bottom:1em;
	font-size:0.875rem;	
}
.news-items mark{
	display:inline-flex;
	padding:0.25em 2em;
	background:var(--key);
	color:#fff;
	border-radius:1rem;
}
.img-fit{
	overflow:hidden;
}
.img-fit img{
	object-fit:cover;
}
a:hover .img-fit img{
	transform:scale(1.1);
}
.news-items .img-fit{
	aspect-ratio:33 / 22;
	border-radius:0.5rem;
}
.news-items .img-fit img{
	aspect-ratio:33 / 22;
}





@media screen and (max-width:767px) {
.news-items .news-item a {
		padding:1em 2.5em 1em 0em;
		position:relative;
		z-index:1;
		flex-direction:column;
		gap:0em;
	}
	.news-items .news-item a time{
		line-height:inherit;
	}
	.news-items .news-item .arrow{
		position:absolute;
		inset:0 0em 0 auto;
		margin:auto;
	}
	.news-items .news-item p{
		line-height:1.8;
	}
	.news-items.card-style {
		gap:1.5em 2%;
	}
	.news-items.card-style .news-item{
		flex-basis:100%;
	}
	.news-items.card-style .news-item a{ 
		border-radius:0.75rem;
		padding:1.0em 1.0em 1.0em;
		gap:1em;
	}
	.news-items.card-style .news-item img{
		width:100%;
	}
	
	.news-items.card-style .news-item time{
		font-size:0.875rem;
		line-height:inherit;
	}
	.news-items.card-style .news-info{
		margin-block:0em 0.5em;
		font-size:0.857rem;	
	}
}

/*	GoogleMAP・動画埋め込み	*/
.map_wrap iframe {
	width: 100%;
}
.movie_wrap {
	position: relative;
	width: 100%;
	aspect-ratio: 16/9;
}
.movie_wrap iframe,
.movie_wrap video {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
/*	パンくずリスト	*/
#pan {
	position: relative;
	z-index: 2;
	margin-top: 2.125rem;
	margin-bottom: 4.125rem;
	overflow: hidden;
}
#pan ol {
	display: flex;
	align-items: center;
	padding: 0;
	margin: 0;
	font-size: 0;
	overflow-y: hidden;
	overflow-x: auto;
}
#pan li,
#pan li * {
	display: inline-block;
	vertical-align: middle;
	font-size: 0.875rem;
	text-transform: uppercase;
	white-space: nowrap;
}
#pan li::after {
	display: inline-block;
	vertical-align: middle;
	content: "\003E";
	margin-left:1em;
}
#pan li:not(:last-child) {
	margin-right: 1em;
}
#pan li:last-child::after {
	display: none;
}
#pan li * {
	display: inline-flex;
	justify-content: flex-start;
	align-items: center;
	color: var(--black);
}
#pan li a {
	font-weight: bold;
	text-decoration: underline;
	text-underline-offset: 0.25em;
}
@media (hover: hover) and (pointer: fine),
(hover: none) and (pointer: coarse) {
	#pan li a:hover {
		text-decoration: none;
	}
}
@media only screen and (max-width: 767px) {
	#pan {
		position: relative;
		z-index: 10;
		margin-top: 1em;
		margin-bottom: 2.5em;
		overflow: hidden;
	}
	#pan:after,
	#pan li:last-child:after {
		position: absolute;
		z-index: 10;
		content: "";
		display: block;
		top: 0;
		bottom: 0;
		right: 0;
		width: 0.75em;
		background: var(--black);
		background: linear-gradient(-90deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 50%);
	}
	#pan a {
		text-decoration: underline;
	}
	#pan li:last-child {
		position: relative;
		padding-right: 0.75em;
		margin-right: 0;
		flex-grow: 1;
	}
	#pan li:last-child:after {
		z-index: 20;
		top: -1em;
		bottom: -1em;
		background: var(--white);
	}
}
/*	ページャー	*/
.navigation {
	margin-block: 4.625em;
}
ul.page-numbers {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0;
	padding: 0;
	margin: 0;
}
ul.page-numbers li {
	margin: 0;
}
ul.page-numbers li :is(a,span.page-numbers) {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 2.5em;
	aspect-ratio: 1/1;
	font-size: 1rem;
	font-weight: bold;
	line-height: 1;
	color: var(--black);
	background: var(--white);
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	text-decoration: none;
}
ul.page-numbers li a:is(.prev,.next) {
	justify-content:space-between;
	flex-direction: row;
	width: 6.16666666667em;
	aspect-ratio: 111/40;
	font-size: 1.125em;
	font-weight:normal;
	background: #f2f2f2;
	border:1px solid #999999;
	text-transform:uppercase;
	padding:0.25em 0.5em;
	margin-left:0.5em;
}
ul.page-numbers li a:is(.prev,.next) i {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width:1.75em;
	aspect-ratio:1/1;
	font-size: 0.75em;
	line-height:0.5;
	background:var(--white);
	border:1px solid #999999;
	border-radius:100%;
	overflow: clip;
}
ul.page-numbers li a:is(.prev,.next) i::before {
	content: "→";
	font-weight:bold;
	color:var(--main_color);
	scale: 1 1;
	transform-origin: left;
	transition: scale .3s;
}
ul.page-numbers li a.prev {
	flex-direction:row-reverse;
	margin-left:auto;
	margin-right:0.5em;
}
ul.page-numbers li a.prev i::before {
	content: "←";
		transform-origin: right;
}
ul.page-numbers li span.page-numbers.current {
	background: #f2f2f2;
}
@media (hover: hover) and (pointer: fine),
(hover: none) and (pointer: coarse) {
	ul.page-numbers li a:hover {
		background: #f2f2f2;
	}
	ul.page-numbers li a:is(.prev,.next):hover i::before {
		scale: 0 1;
		transform-origin: right;
	}
	ul.page-numbers li a.prev:hover i::before {
		transform-origin: left;
	}
}
@media screen and (max-width:767px) {
	.navigation {
		margin-block: 3em;
	}
	ul.page-numbers li :is(a,span.page-numbers) {
		width: 2em;
	}
	ul.page-numbers li a:is(.prev,.next) {
		justify-content:center;
		flex-direction:column;
		text-indent: -9999px;
		aspect-ratio:1/1;
		padding:0;
	}
	ul.page-numbers li a:is(.prev,.next) span{
		display:none;
	}
	ul.page-numbers li a:is(.prev,.next) i {
		text-indent: 1px;
		width:auto;
		font-size:1em;
		background:none;
		border:none;
	}
	ul.page-numbers li a:is(.prev,.next) i::before{
		color:var(--black);
	}
}
