@charset "utf-8";
main {
	padding-top: 60px;
	@media screen and (min-width:769px) {
		padding-top: 110px;
	}
}
section.kv {
	position: relative;
	padding: 0;
	& div.slider {
		& div.kv_1 {
			& > p {
				height: 340px;
				width: 100%;
				background: url("../img/top/kv_1.jpg") no-repeat;
				background-size: cover;
				background-position: left;
				@media screen and (min-width:769px) {
					height: 770px;
					height: auto;
					max-height: 770px;
					min-height: 550px;
					background-position: left top;
				}
			}
			& article {
				position: absolute;
				top: 0;
				& > p {
					width: 56vw;
					@media screen and (min-width:769px) {
						max-width: 380px;
						width: 27.14vw;
					}
					& img {
						position: absolute;
						top: 15px;
						left: 1%;
						max-width: 210px;
						@media screen and (min-width:769px) {
							max-width: 380px;
							width: 27.14vw;
							left: 8%;
							top: 35px;
						}
					}
				}
			}
		}
		& div.kv_3 {
			& a {
				& > p {
					height: 340px;
					width: 100%;
					background: url("../img/top/kv_3.jpg") no-repeat;
					background-size: cover;
					background-position: center;
					@media screen and (min-width:769px) {
						height: 770px;
						height: auto;
						max-height: 770px;
						min-height: 550px;
						background-position: left top;
					}
				}
				& article {
					position: absolute;
					top: 0;
					& > p {
						width: 56vw;
						@media screen and (min-width:769px) {
							max-width: 380px;
							width: 27.14vw;
						}
						& img {
							position: absolute;
							top: 15px;
							left: 1%;
							max-width: 210px;
							@media screen and (min-width:769px) {
								max-width: 380px;
								width: 27.14vw;
								left: 8%;
								top: 35px;
							}
						}
					}
				}
			}
		}
		& div.kv_2 {
			& > p {
				height: 340px;
				width: 100%;
				background: url("../img/top/kv_2.jpg") no-repeat;
				background-size: cover;
				background-position: center;
				@media screen and (min-width:769px) {
					height: 770px;
					height: auto;
					max-height: 770px;
					min-height: 550px;
					background-position: left top;
				}
			}
			& article {
				position: absolute;
				top: 0;
				& > p {
					width: 56vw;
					@media screen and (min-width:769px) {
						max-width: 380px;
						width: 27.14vw;
					}
					& img {
						position: absolute;
						top: 15px;
						left: 1%;
						max-width: 210px;
						@media screen and (min-width:769px) {
							max-width: 380px;
							width: 27.14vw;
							left: 8%;
							top: 35px;
						}
					}
				}
			}
		}
	}
}
/* KVスライドショーのページャーをドットにする */
.slick-dots {
	display: flex;
	justify-content: center;
	margin-top: 10px;
	& li {
		button {
			font-size: 0;
			border: none;
			background-color: #ccc;
			width: 15px; /* ドットのサイズ */
			height: 15px;
			border-radius: 50%; /* ドットを円形にする */
		}
	}
	& li.slick-active {
		button {
			background-color: var(--green);
		}
	}
	& li:nth-child(n+2) {
		margin-left: 10px;
	}
}
section.news {
	& article {
		& > div {
			@media screen and (min-width:769px) {
				display: flex;
				justify-content: space-between;
			}
			& .wrapper_dl {
				position: relative;
				@media screen and (min-width:769px) {
					width: 64%;
					max-width: 640px;
				}
			}
			& .bnr {
				margin-top: 20px;
				@media screen and (min-width:769px) {
					margin-top: 0;
					width: 30%;
					max-width: 300px;
				}
				& .bnr_panorama a {
					background-color: #cccccc;
					height: 70px;
					display: block;
				}
				& > p:nth-of-type(n+2) {
					margin-top: 22px;
				}
			}
		}
	}
}

section.short_cut {
	& article {
		& ul {
			display: block grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 8px;
			@media screen and (min-width:769px) {
				display: flex;
				justify-content: space-between;
			}
			& li {
				& a {
					height: auto;
					display: block;
					padding: 15px 8px;
					@media screen and (min-width:769px) {
						padding: 30px 15px;
						width: 180px;
						height: 180px;
					}
					&:hover{
						opacity: 1.0;
						& img {
							transform: scale(1.1);
							transition: 0.5s ease;
						}
					}
					& p {
						text-align: center;
						margin-top: 8px;
						margin-top: 8px;
						font-size: 3.733vw;
						font-weight: bold;
						font-feature-settings: "palt";
						line-height: 1.3;
						@media screen and (min-width:769px) {
							font-size: 112.5%;
							line-height: 1.2;
						}
					}
					& img {
						margin-inline: auto;
						max-width: 66px;
						display: block;
						transition: 0.5s ease;
						@media screen and (min-width:769px) {
							max-width: 112px;
						}
					}
				}
			}
			& .first_visit {
				background-color: #bde889;
				border-radius: 0 20px 0 20px;
			}
			& .return_visit {
				background-color: #fde051;
				border-radius: 0 20px 0 20px;
			}
			& .emergency_visit {
				background-color: #e2b3a9;
				border-radius: 0 20px 0 20px;
			}
			& .faq {
				background-color: #a2caed;
				border-radius: 0 20px 0 20px;
			}
			& .our_features {
				background-color: #8dd3ce;
				border-radius: 0 20px 0 20px;
			}
		}
	}
}
section.access {
	& article {
		& div {
			position: relative;
			& .btn_2 {
				top: 45px;
				right: 5%;
				@media screen and (min-width:769px) {
					top: 62px;
					right: 60px;
				}
			}
		}
	}
}

footer {
	& .bnrs {
		padding: 40px 5% 40px;
		@media screen and (min-width:769px) {
			padding: 60px 0 60px;
		}
	}
}