/*---------------------------------
	buttons start
---------------------------------*/
.buttons{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 1em 1.5em;
	font-size: 100%;
	margin: 0;
	padding: 0;
	
	&.buttons--alignLeft{
		justify-content: flex-start;
	}

	&.buttons--vertically{
		flex-direction: column;
		align-items: center;
	}

	@media(max-width: 1024px) and (min-width: 601px){
		&.buttons--tbAlignLeft{
			justify-content: flex-start;
		}
	}

	@media(max-width: 600px){
		&.buttons--spAlignLeft{
			justify-content: flex-start;
		}
	}

	& a{
		text-decoration: none;
	}

	& input{
		-webkit-box-sizing: content-box;
		-webkit-appearance: button;
		appearance: button;
		box-sizing: border-box;
		cursor: pointer;
		
		&::-webkit-search-decoration{
			display: none;
		}

		&::focus{
			outline-offset: -2px;
		}
	}
}

/*---------------------------------
	buttons end
---------------------------------*/

/*---------------------------------
	standardButton start
---------------------------------*/
.standardButton{
	--p-color: var(--c-hex-theme);
	--p-color-contrast: var(--c-hex-themeContrast);
	--p-borderWidth: 2px;
	--p-paddingX: 2.5em;
	--p-paddingY: 0.5em;
	display: block;
	position: relative;
	max-width: 100%;
	min-width: 15em;
	padding: var(--p-paddingY) var(--p-paddingX) calc(var(--p-paddingY) * 1.2);
	color: var(--p-color-contrast);
	text-align: center;
	font-weight: var(--f-weight-bold);
	text-decoration: none;
	background-color: var(--p-color);
	border:  var(--p-borderWidth) solid var(--p-color);
	border-radius: 2em;
	outline: none !important;
	transition: background-color 0.25s, color 0.25s;
	
	&:hover{
		color: var(--p-color);
		text-decoration: none;
		background-color: var(--p-color-contrast);
	}
	
	&.standardButton--colorContrast{
		--p-color: var(--c-hex-themeContrast);
		--p-color-contrast: var(--c-hex-theme);
	}
	
	&.standardButton--next{
		padding-right: calc(var(--p-paddingX) + 1em);
		
		&:before{
			content: "arrow_forward";
			position: absolute;
			top: 50%;
			right: .75em;
			transform: translateY(-50%);
			display: flex;
			align-items: center;
			justify-content: center;
			width: 1em;
			height: 1em;
			font-family: "Material Symbols Outlined";
			font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 48;
			font-weight: 400;
			font-size: 100%;
			overflow: hidden;
		}
	}
	
	&.standardButton--prev{
		padding-left: calc(var(--p-paddingX) + 1em);
		
		&:before{
			content: "arrow_back";
			position: absolute;
			top: 50%;
			left: .75em;
			transform: translateY(-50%);
			display: flex;
			align-items: center;
			justify-content: center;
			width: 1em;
			height: 1em;
			font-family: "Material Symbols Outlined";
			font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 48;
			font-weight: 400;
			font-size: 100%;
			overflow: hidden;
		}
	}
	
	&.standardButton--external{
		padding-right: calc(var(--p-paddingX) + 1em);
		
		&:before{
			content: "open_in_new";
			position: absolute;
			top: 50%;
			right: .75em;
			transform: translateY(-50%);
			display: flex;
			align-items: center;
			justify-content: center;
			width: 1em;
			height: 1em;
			font-family: "Material Symbols Outlined";
			font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 48;
			font-weight: 400;
			font-size: 100%;
			overflow: hidden;
		}
	}

	&.standardButton--small{
		--p-PaddingX: 1.5em;
		--p-PaddingY: 0.5em;
		font-size: 90%;
	}
	
	&.standardButton--negative{
		--p-color: #666;
		--p-color-contrast: #FFF;
		min-width: 0;
		font-size: 90%;
	}

	&.standardButton--x{
		--p-color: #000;
		--p-color-contrast: #FFF;
	}

	&.standardButton--facebook{
		--p-color: #1877f2;
		--p-color-contrast: #FFF;
	}

	&.standardButton--line{
		--p-color: #06c655;
		--p-color-contrast: #FFF;
	}

	&.standardButton--instagram{
		position: relative;
		padding: calc(var(--p-paddingY) + var(--p-borderWidth)) calc(var(--p-paddingX) + var(--p-borderWidth));
		background: linear-gradient(45deg, rgba(254,212,117,1) 0%,rgba(229,61,93,1) 50%,rgba(194,49,134,1) 70%,rgba(156,56,187,1) 100%);
		color: #FFF;
		border: none;
		
		&:before{
			content: "";
			position: absolute;
			top: 2px;
			left: 2px;
			width: calc(100% - (var(--p-borderWidth) * 2));
			height: calc(100% - (var(--p-borderWidth) * 2));
			background-color: #FFF;
			visibility: hidden;
			opacity: 0;
			transition: all 0.25s;
		}

		&:hover{
			&:before{
				visibility: visible;
				opacity: 1;
			}
			
			& span{
				position: relative;
				background: linear-gradient(45deg, rgba(254,212,117,1) 0%,rgba(229,61,93,1) 50%,rgba(194,49,134,1) 70%,rgba(156,56,187,1) 100%);
				background-clip: text;
				-webkit-background-clip: text;
				color: transparent;
			}
		}
	}
}

/*---------------------------------
	standardButton end
---------------------------------*/

/*---------------------------------
	kentFooter start
---------------------------------*/
.kentFooter{
	text-align: center;
	margin: 0;
	padding: 0.5em 1em;
	font-size: 80%;
	color: var(--c-hex-themeContrast);
	background: var(--bg-hex-theme);
	
	& a,
	& a:hover{
		color: inherit;
	}
}



/*---------------------------------
	kentFooter end
---------------------------------*/

/*---------------------------------
	list start
---------------------------------*/
.list{
	list-style: none;
	margin-bottom: 1em;
	padding: 0;
}

.list li{
	position: relative;
	padding-left: 1.25em;
}

.list li:before{
	content: "・";
	position: absolute;
	top: 0;
	left: 0;
}

/*---------------------------------
	list end
---------------------------------*/

/*---------------------------------
	ordedList start
---------------------------------*/
.ordedList{
	list-style: none;
	counter-reset: list-count;
	margin-bottom: 1em;
	padding: 0;
}

.ordedList li{
	position: relative;
	padding-left: 1.25em;
}

.ordedList li:before{
	counter-increment: list-count;
	content: counter(list-count) ".";
	position: absolute;
	top: 0;
	left: 0;
}

.ordedList--brackets li{
	padding-left: 1.5em;
}

.ordedList--brackets li:before{
	content: "(" counter(list-count) ")";
}

.ordedList--latin li:before{
	content: counter(list-count, lower-latin) ".";
}

/*---------------------------------
	ordedList end
---------------------------------*/

/*---------------------------------
	standardTable start
---------------------------------*/
.standardTable{
	width: 100%;
	table-layout: auto;
}

@media(min-width: 1025px){
	.standardTable th,
	.standardTable td{
		padding: 2em 1em;
		vertical-align: top;
	}
	
	.standardTable th{
		font-size: 110%;
	}
	
	.standardTable tr{
		border-bottom: 1px solid #CCC;
	}
}

@media(max-width: 1024px){
	.standardTable tr{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 1em;
		padding: 1em 0.25em;
		border-bottom: 1px solid #CCC;
	}
	
	.standardTable th,
	.standardTable td{
		display: block;
		width: 100%;
	}
}

/*---------------------------------
	standardTable end
---------------------------------*/

/*---------------------------------
	sideMediaLayout start
---------------------------------*/
.sideMediaLayout{
	--p-gapX: 2em;
	--p-gapY: 3em;
	display: flex;
	align-items: flex-start;
	flex-wrap: nowrap;
	justify-content: space-between;
	gap: 0 var(--p-gapX);
}

.sideMediaLayout_media{
	flex-grow: 0;
	flex-shrink: 0;
	width: calc((100% - var(--p-gapX)) / 2);
}

.sideMediaLayout_content{
	flex-grow: 0;
	flex-shrink: 0;
	width: calc((100% - var(--p-gapX)) / 2);
}

.sideMediaLayout--ratio1to1 .sideMediaLayout_media,
.sideMediaLayout--ratio1to1 .sideMediaLayout_content{
	width: calc((100% - var(--p-gapX)) / 2);
}

.sideMediaLayout--ratio6to4 .sideMediaLayout_media{
	width: calc((100% - var(--p-gapX)) * 0.6);
}

.sideMediaLayout--ratio6to4 .sideMediaLayout_content{
	width: calc((100% - var(--p-gapX)) * 0.4);
}

.sideMediaLayout--ratio7to3 .sideMediaLayout_media{
	width: calc((100% - var(--p-gapX)) * 0.7);
}

.sideMediaLayout--ratio7to3 .sideMediaLayout_content{
	width: calc((100% - var(--p-gapX)) * 0.3);
}

.sideMediaLayout--ratio4to6 .sideMediaLayout_media{
	width: calc((100% - var(--p-gapX)) * 0.4);
}

.sideMediaLayout--ratio4to6 .sideMediaLayout_content{
	width: calc((100% - var(--p-gapX)) * 0.6);
}

.sideMediaLayout--ratio45to55 .sideMediaLayout_media{
	width: calc((100% - var(--p-gapX)) * 0.45);
}

.sideMediaLayout--ratio45to55 .sideMediaLayout_content{
	width: calc((100% - var(--p-gapX)) * 0.55);
}

.sideMediaLayout--ratio3to7 .sideMediaLayout_media{
	width: calc((100% - var(--p-gapX)) * 0.3);
}

.sideMediaLayout--ratio3to7 .sideMediaLayout_content{
	width: calc((100% - var(--p-gapX)) * 0.7);
}

@media(min-width: 1025px){
	& .sideMediaLayout--mediaFirst .sideMediaLayout_media{
		order: 0;
	}

	& .sideMediaLayout--mediaFirst .sideMediaLayout_content{
		order: 1;
	}

	& .sideMediaLayout--contentFirst .sideMediaLayout_media{
		order: 1
	}

	& .sideMediaLayout--contentFirst .sideMediaLayout_content{
		order: 0;
	}
}

@media(max-width: 1024px){
	& .sideMediaLayout{
		flex-direction: column-reverse;
		align-items: center;
		gap: var(--p-gapY) 0;
	}

	& .sideMediaLayout .sideMediaLayout_media{
		width: 100%;
		max-width: 600px;
		margin: 0;
	}

	& .sideMediaLayout .sideMediaLayout_content{
		width: 100%;
	}
}

/*---------------------------------
	sideMediaLayout end
---------------------------------*/

/*---------------------------------
	nColumsContents start
---------------------------------*/
.nColumsContents{
	--p-gapX: 2em;
	--p-gapY: 3em;
	--p-col: 2;
	list-style: none;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: var(--p-gapY) var(--p-gapX);
	padding: 0;
	margin: 0;
	
	& .nColumsContents_item{
		width: calc((100% - var(--p-gapX) * (var(--p-col) - 1) - 1px) / var(--p-col));
	}

	@media(min-width: 1025px){
		&.nColumsContents--pcCol4{
			--p-col: 4;
		}
		
		&.nColumsContents--pcCol3{
			--p-col: 3;
		}
		
		&.nColumsContents--pcCol2{
			--p-col: 2;
		}
		
		&.nColumsContents--pcCol1{
			--p-col: 1;
		}
	}

	@media(max-width: 1024px) and (min-width: 601px){
		&.nColumsContents{
			--p-col: 2;
		}
		
		&.nColumsContents--tbCol4{
			--p-col: 4;
		}
		
		&.nColumsContents--tbCol3{
			--p-col: 3;
		}
		
		&.nColumsContents--tbCol2{
			--p-col: 2;
		}
		
		&.nColumsContents--tbCol1{
			--p-col: 1;
		}
	}

	@media(max-width: 600px){
		&.nColumsContents{
			--p-col: 1;
		}
		
		&.nColumsContents--spCol4{
			--p-col: 4;
		}
		
		&.nColumsContents--spCol3{
			--p-col: 3;
		}
		
		&.nColumsContents--spCol2{
			--p-col: 2;
		}
		
		&.nColumsContents--spCol1{
			--p-col: 1;
		}
	}

	& .nColumsContents_itemLink,
	& .nColumsContents_itemLink:hover{
		display: block;
		text-decoration: none;
		color: inherit;
	}
}

/*---------------------------------
	nColumsContents end
---------------------------------*/

/*---------------------------------
	imageFrame start
---------------------------------*/
.imageFrame{
	position: relative;
	width: 100%;
	padding-top: calc(100% / 4 * 3);
	border-radius: 1em;
	overflow: hidden;
}

.imageFrame--ratio4to3{
	padding-top: calc(100% / 4 * 3);
}

.imageFrame--ratio5to3{
	padding-top: calc(100% / 5 * 3);
}

.imageFrame img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.25s;
}

a:hover .imageFrame img{
	transform: scale(1.1);
}

/*---------------------------------
	imageFrame end
---------------------------------*/

/*---------------------------------
	newsPickup start
---------------------------------*/
.newsPickup{
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
}

.newsPickupItem{
	margin-bottom: 0;
	border-bottom: 2px solid #CCC;
}

.newsPickupItem_link,
.newsPickupItem_link:hover{
	color: inherit;
	text-decoration: none;
}

.newsPickupItem_link:hover{
	text-decoration: underline;
}

.newsPickupItem_inner{
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: nowrap;
}

.newsPickupItem_date{
	flex-grow: 0;
	flex-shrink: 0;
	width: 8em;
	padding: 0.75em 0.5em;
	margin: 0;
	color: #000000;
}

.newsPickupItem_title{
	flex-grow: 1;
	flex-shrink: 1;
	padding: 0.75em 0.5em;
	margin: 0;
}

@media(max-width: 600px){
	.newsPickupItem_inner{
		flex-direction: column;
		padding: 0.5em 0.5em;
	}
	
	.newsPickupItem_date,
	.newsPickupItem_title{
		width: 100%;
		padding: 0;
		margin-bottom: 0.5em;
		
	}
}

/*---------------------------------
	newsPickup end
---------------------------------*/

/*---------------------------------
	gmap start
---------------------------------*/
.gmap{
	position: relative;
	width: 100%;
	height: 20em;
}

.gmap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*---------------------------------
	gmap end
---------------------------------*/

/*---------------------------------
	youtube start
---------------------------------*/
.youtube{
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding-top: 55%;
}

.youtube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*---------------------------------
	youtube end
---------------------------------*/

/*---------------------------------
	simpleImage start
---------------------------------*/
.simpleImage_image{
	display: block;
	max-width: 100%;
	margin: 0 auto;
}

/*---------------------------------
	simpleImage end
---------------------------------*/

/*---------------------------------
	mailform start
---------------------------------*/
.mailform{
	& .mailform_body{
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 2.5em 2.5em;
		width: 100%;
		margin-bottom: 3em;
		
		&.mailform_body--table{
			grid-template-columns: 1fr;
			gap: 0;
			
			@media(max-width: 1024px){
				gap: 1em;
			}
		}
		
		&.mailform_body--col1{
			grid-template-columns: 1fr;
		}
		
		@media(max-width: 1024px){
			grid-template-columns: 1fr;
		}
		
		& .mailform_item{
			display: flex;
			flex-direction: column;
			gap: 1em;
			
			@media(min-width: 1025px){
				&.mailform_item--col1{
					grid-column: 1 / 3;
				}
			}
		}

		&.mailform_body--table .mailform_item{
			border-bottom: 1px solid #CCC;
			
			@media(min-width: 1025px){
				display: grid;
				grid-template-columns: 1fr 2.5fr;
				gap: 1em;
				padding: 1.5em .5em;
			}
			
			@media(max-width: 1024px){
				padding: 0 .5em 1.5em;
			}
		}

		& .mailform_head{
			position: relative;
			width: 100%;
			margin: 0;
			font-weight: var(--f-weight-bold);
			
			&.mailform_head--need:after{
				content: "必須";
				position: absolute;
				top: 0;
				left: 0;
				display: block;
				margin: 0 0 -0.25em;
				padding: 0.6em 1em;
				color: #FFF;
				font-size: 70%;
				line-height: 100%;
				background-color: var(--c-hex-warning);
				border-radius: 3px;
			}
		}
		
		&:has(.mailform_head--need) .mailform_head{
			padding-left: 3.5em;
		}

		& .mailform_textForm{
			width: 100%;
			font-size: 90%;
			margin: 0;
			padding: 0.5em 1em;
			background: #FAFAFA;
			border: 1px solid #CCC;
			border-radius: 5px;
			outline: none;
			transition: background-color 0.25s;
			
			&::placeholder{
				color: inherit;
				opacity: 0.35;
			}
		}

		& .mailform_textarea{
			width: 100%;
			height: 10em;
			font-size: 90%;
			margin: 0.25em 0;
			padding: 0.5em 1em;
			background: #FAFAFA;
			border: 1px solid #CCC;
			border-radius: 5px;
			outline: none;
			transition: background-color 0.25s;
			
			&::placeholder{
				color: inherit;
				opacity: 0.35;
			}
		}

		& .msg{
			color: var(--c-hex-warning);
		}
	}



}

/*---------------------------------
	mailform end
---------------------------------*/

/*---------------------------------
	radiobuttonsList start
---------------------------------*/
.radiobuttonsList{
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.radiobuttonsList_item{
	margin: 0.25em 1.5em 0.25em 0;
}

.radiobuttonsList_item label{
	margin: 0;
}

.radiobuttonsList_item input[type="radio"]{
	margin-right: 0.25em;
}

/*---------------------------------
	radiobuttonsList end
---------------------------------*/

/*---------------------------------
	checkboxList start
---------------------------------*/
.checkboxList{
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.checkboxList_item{
	margin: 0.25em 1.5em 0.25em 0;
}

.checkboxList_item label{
	margin: 0;
}

.checkboxList_item input[type="checkbox"]{
	margin-right: 0.25em;
}

/*---------------------------------
	radiobuttonsList end
---------------------------------*/

/*---------------------------------
	bgPhotoContents start
---------------------------------*/
.bgPhotoContents{
	position: relative;
	padding: 3em 0 5em;
	border-radius: 1em;
	overflow: hidden;
	
	& .bgPhotoContents_bg{
		position: absolute; 
		top: 0;
		left: 0;
		z-index: 20;
		width: 100%;
		height: 100%;
		
		& img{
			position: relative;
			z-index: 21;
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
		
		&:before{
			content: "";
			position: absolute; 
			top: 0;
			left: 0;
			z-index: 22;
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,.35);
		}
	}
	
	& .bgPhotoContents_inner{
		position: relative; 
		z-index: 25;
		width: 90%;
		margin: 0 auto;
	}
}

/*---------------------------------
	bgPhotoContents end
---------------------------------*/

/*---------------------------------
	contentWrapper start
---------------------------------*/
.contentWrapper{
	padding: 2.5em 2em 5em;
	background-color: var(--bg-hex-theme-light02);
	border-radius: 1em;
	
	&.contentWrapper--bgContrast{
		background-color: var(--bg-hex-light);
	}
}

/*---------------------------------
	contentWrapper end
---------------------------------*/

/*---------------------------------
	standardDescriptions start
---------------------------------*/
.standardDescriptions{
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1em .25em;
	
	@media(max-width: 1024px){
		display: block;
	}
	
	& dt{
		@media(min-width: 1025px){
			position: relative;
			margin: 0;
			padding-right: 1em;
			font-weight: bold;
			
			&:before{
				content: "：";
				position: absolute;
				top: 0;
				right: 0;
			}
		}
		
		@media(max-width: 1024px){
			margin-bottom: .5em;
		}
	}
	
	& dd{
		@media(min-width: 1025px){
			margin-bottom: 0;
		}
		
		@media(max-width: 1024px){
			&:not(:last-of-type){
				margin-bottom: 1.5em;
			}
		}
	}
}

/*---------------------------------
	standardDescriptions end
---------------------------------*/