@charset "utf-8";

/*----------------------------
	facility
------------------------------*/

.facility .contArea {
	padding: calc((80 / 16) * 1rem) 0 calc((150 / 16) * 1rem);
	overflow: hidden;
}
.facility .inner {
	max-width: calc((900 / 16) * 1rem);
}
.facility h1 {
	font-size: calc((40 / 16) * 1rem);
	font-family: "Zen Old Mincho", serif;
	text-align: center;
	letter-spacing: calc((2 / 16) * 1rem);
}
.facility .ttlJp {
	font-size: calc((14 / 16) * 1rem);
	font-weight: 500;
	text-align: center;
	color: var(--greenColor);
}
.facility .lead {
	margin-top: calc((40 / 16) * 1rem);
	line-height: 1.8;
	text-align: center;
}
@media (max-width: 768px) {
	.facility .contArea {
		padding: calc((50 / 16) * 1rem) 0 calc((100 / 16) * 1rem);
	}
	.facility .inner {
		max-width: 100%;
	}
	.facility h1 {
		font-size: calc((36 / 16) * 1rem);
		line-height: 1.1;
	}
	.facility .ttlJp {
		margin-top: calc((10 / 16) * 1rem);
		font-size: calc((12 / 16) * 1rem);
	}
	.facility .lead {
		margin-top: calc((30 / 16) * 1rem);
		font-size: calc((14 / 16) * 1rem);
	}
}

/* anc */
.facility .anc {
	margin-top: calc((60 / 16) * 1rem);
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: calc((10 / 16) * 1rem);
}
.facility .anc li a {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: calc((40 / 16) * 1rem);
	padding: calc((10 / 16) * 1rem) calc((20 / 16) * 1rem);
	border: solid 1px var(--greenColor);
	border-radius: calc((100 / 16) * 1rem);
	font-size: calc((16 / 16) * 1rem);
	text-align: center;
	line-height: 1.25;
}
.facility .anc li a:hover {
	background-color: var(--greenColor);
	color: var(--whiteColor);
}
@media (max-width: 768px) {
	.facility .anc {
		margin-top: calc((40 / 16) * 1rem);
		max-width: calc((300 / 16) * 1rem);
		margin-left: auto;
		margin-right: auto;
		grid-template-columns: 1fr;
	}
	.facility .anc li a {
		padding: calc((10 / 16) * 1rem) calc((35 / 16) * 1rem);
	}
}

/* sec */
.facility .sec {
	margin-top: calc((60 / 16) * 1rem);
	scroll-margin-top: calc((100 / 16) * 1rem);
}
.facility .sec h2 {
	font-size: calc((24 / 16) * 1rem);
	line-height: 1.5;
	text-align: center;
}
.facility .secNote {
	margin-top: calc((20 / 16) * 1rem);
	font-size: calc((14 / 16) * 1rem);
	line-height: 1.3;
	text-align: center;
}
.facility .btn {
	max-width: calc((300 / 16) * 1rem);
	margin: calc((15 / 16) * 1rem) auto 0;
}
.facility .btn a {
	display: block;
	font-size: calc((14 / 16) * 1rem);
	letter-spacing: calc((2 / 16) * 1rem);
	text-align: center;
	border: solid 1px var(--greenColor);
	border-radius: calc((6 / 16) * 1rem);
	padding: calc((15 / 16) * 1rem);
	position: relative;
}
.facility .btn a::before {
	content: "";
	width: calc((8 / 16) * 1rem);
	height: calc((8 / 16) * 1rem);
	border-top: solid 1px var(--baseColor);
	border-right: solid 1px var(--baseColor);
	transform: rotate(45deg) translateY(-50%);
	position: absolute;
	right: calc((20 / 16) * 1rem);
	top: 50%;
}
@media (max-width: 768px) {
	.facility .sec {
		margin-top: calc((40 / 16) * 1rem);
		scroll-margin-top: calc((80 / 16) * 1rem);
	}
	.facility .secNote {
		font-size: calc((12 / 16) * 1rem);
		line-height: 1.8;
	}
	.facility .btn {
		margin: calc((10 / 16) * 1rem) auto 0;
		max-width: calc((300 / 16) * 1rem);
	}
}

/* hours */
.facility .hoursList {
	margin-top: calc((30 / 16) * 1rem);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: calc((20 / 16) * 1rem);
}
.facility .hoursBox {
	background-color: var(--bgGrayColor);
	padding: calc((30 / 16) * 1rem) calc((20 / 16) * 1rem);
	text-align: center;
}
.facility .hoursLabel {
	font-size: calc((16 / 16) * 1rem);
	font-weight: 500;
	line-height: 1.8;
	color: var(--greenColor);
}
.facility .hoursTime {
	margin-top: calc((10 / 16) * 1rem);
	font-size: calc((30 / 16) * 1rem);
	font-weight: 500;
	line-height: 1.5;
}
.facility .hoursNote {
	margin-top: calc((10 / 16) * 1rem);
	font-size: calc((14 / 16) * 1rem);
	line-height: 1.3;
}
.facility #facility01 .secNote {
	margin-top: calc((30 / 16) * 1rem);
}
@media (max-width: 768px) {
	.facility .hoursList {
		grid-template-columns: 1fr;
		gap: calc((10 / 16) * 1rem);
	}
	.facility .hoursBox {
		padding: calc((20 / 16) * 1rem);
	}
	.facility .hoursLabel {
		font-size: calc((14 / 16) * 1rem);
	}
	.facility .hoursTime {
		margin-top: calc((5 / 16) * 1rem);
		font-size: calc((24 / 16) * 1rem);
	}
	.facility .hoursNote {
		font-size: calc((12 / 16) * 1rem);
	}
	.facility #facility01 .secNote {
		margin-top: calc((10 / 16) * 1rem);
	}
}

/* pets */
.facility .petLead {
	margin-top: calc((30 / 16) * 1rem);
	font-size: calc((16 / 16) * 1rem);
	line-height: 1.8;
	text-align: center;
}
.facility .petTxt {
	margin-top: calc((20 / 16) * 1rem);
	font-size: calc((14 / 16) * 1rem);
	line-height: 1.8;
}
@media (max-width: 768px) {
	.facility .petLead {
		margin-top: calc((20 / 16) * 1rem);
		font-size: calc((14 / 16) * 1rem);
	}
	.facility .petTxt {
		margin-top: calc((10 / 16) * 1rem);
		font-size: calc((12 / 16) * 1rem);
	}
}

/* infoList */
.facility .infoList {
	margin-top: calc((30 / 16) * 1rem);
}
.facility .infoRow {
	display: flex;
	gap: 0 calc((20 / 16) * 1rem);
	padding: 0 calc((20 / 16) * 1rem);
}
.facility .infoRow + .infoRow {
	margin-top: calc((20 / 16) * 1rem);
}
.facility .infoRow dt {
	width: calc((150 / 16) * 1rem);
	font-size: calc((16 / 16) * 1rem);
	font-weight: 500;
	line-height: 1.8;
	color: var(--greenColor);
}
.facility .infoRow dd {
	font-size: calc((16 / 16) * 1rem);
	line-height: 1.8;
}
@media (max-width: 768px) {
	.facility .infoList {
		margin-top: calc((20 / 16) * 1rem);
	}
	.facility .infoRow {
		display: block;
		padding: 0;
	}
	.facility .infoRow + .infoRow {
		margin-top: calc((30 / 16) * 1rem);
	}
	.facility .infoRow dt {
		width: 100%;
		font-size: calc((14 / 16) * 1rem);
	}
	.facility .infoRow dd {
		margin-top: calc((10 / 16) * 1rem);
		font-size: calc((14 / 16) * 1rem);
	}
}

/* payment */
.facility .payLead {
	margin-top: calc((30 / 16) * 1rem);
	font-size: calc((16 / 16) * 1rem);
	line-height: 1.8;
	text-align: center;
}
.facility .payList {
	margin-top: calc((30 / 16) * 1rem);
}
.facility .payRow {
	display: flex;
	align-items: stretch;
	gap: calc((40 / 16) * 1rem);
}
.facility .payRow + .payRow {
	margin-top: calc((20 / 16) * 1rem);
}
.facility .payLabel {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc((200 / 16) * 1rem);
	padding: calc((20 / 16) * 1rem) calc((10 / 16) * 1rem);
	background-color: var(--bgGrayColor);
	font-size: calc((16 / 16) * 1rem);
	font-weight: 500;
	line-height: 1.8;
	text-align: center;
}
.facility .payImg {
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: center;
}
.facility .payImg img {
	width: 100%;
	height: auto;
	display: block;
	text-align: center;
}
.facility .payImg img.sp {
	display: none;
}
.facility .payNote {
	margin-top: calc((20 / 16) * 1rem);
	font-size: calc((14 / 16) * 1rem);
	line-height: 1.6;
}
@media (max-width: 768px) {
	.facility .payLead {
		margin-top: calc((20 / 16) * 1rem);
		font-size: calc((14 / 16) * 1rem);
	}
	.facility .payList {
		margin-top: calc((20 / 16) * 1rem);
	}
	.facility .payRow {
		display: block;
	}
	.facility .payRow + .payRow {
		margin-top: calc((40 / 16) * 1rem);
	}
	.facility .payLabel {
		width: 100%;
		padding: calc((10 / 16) * 1rem);
		font-size: calc((14 / 16) * 1rem);
	}
	.facility .payImg {
		margin-top: calc((20 / 16) * 1rem);
	}
	.facility .payImg img.sp {
		display: block;
	}
	.facility .payImg img.pc {
		display: none;
	}
	.facility .payNote {
		margin-top: calc((20 / 16) * 1rem);
		font-size: calc((12 / 16) * 1rem);
		line-height: 1.8;
	}
}