@charset "UTF-8";
/* CSS Document */
//ブレイクポイントを指定------ここから
$xl: 1399px;
$lg: 1199px;
$md: 991px;
$sm: 767px;
$xs: 575px;

@mixin xl {
  @media screen and (max-width: ($xl)) {
    @content;
  }
}
@mixin lg {
  @media screen and (max-width: ($lg)) {
    @content;
  }
}
@mixin md {
  @media screen and (max-width: ($md)) {
    @content;
  }
}
@mixin sm {
  @media screen and (max-width: ($sm)) {
    @content;
  }
}
@mixin xs {
  @media screen and (max-width: ($xs)) {
    @content;
  }
}
//ブレイクポイントを指定------ここまで

//カラー指定
$color-main: #582707;
$color-bg: #fffae6;
$color-gr1: #697a21;
$color-gr2: #b6b22d;

article {
	padding-top: 100px;
	@include sm {
		padding-top: 0;
	}
}

header {
	position: fixed;
	width: 100%;
	height: 100px;
	background-color: #fff;
	z-index: 10;
	@include sm {
		height: auto;
	}
	.header-contents {
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
	.header-logo {
		display: flex;
		width: 220px;
		height: 100px;
		justify-content: center;
		align-items: center;
		background-color: $color-main;
		margin-right: auto;
		@include lg {
			width: 200px;
		}
		@include md {
			width: 130px;
		}
		img {
			width: 126px;
			@include md {
				width: 90px;
			}
		}
	}
	.header-links {
		margin-right: 2.5rem;
		ul {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			width: 100%;
			margin-bottom: 0;
			li {
				a {
					color: $color-main;
				}
				img {
					width: 22px;
				}
			}
		}
		.upper-list {
			margin-top: 0.5rem;
			margin-bottom: 0.75rem;
			li {
				margin-left: 1.5rem;
				a {
					font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
					font-size: 23px;
					font-size: 2.3rem;
					letter-spacing: 0.1em;
				}
				&:first-child {
					a {
						display: flex;
						align-items: center;
						margin-right: 1rem;
						&::before {
							content: "";
							background-image: url("../img/icon-tel.svg");
							display: inline-block;
							width: 24px;
							height: 24px;
							margin-right: 1rem;
						}
					}
				}
			}
		}
		.lower-list {
			li {
				margin-left: 2em;
				@include lg {
					margin-left: 1.5em;
				}
				a {
					font-size: 14px;
					font-size: 1.4rem;
					letter-spacing: 0.025em;
				}
			}
		}
	}
	.header-reserve {
		border-left: solid 1px $color-main;
		a {
			display: flex;
			align-items: center;
			font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
			font-size: 26px;
			font-size: 2.6rem;
			color: $color-main;
			width: 260px;
			height: 68px;
			margin-left: 2.5rem;
			@include lg {
				font-size: 24px;
				font-size: 2.4rem;
				width: 240px;
			}
			@include md {
				font-size: 20px;
				font-size: 2rem;
				width: 170px;
				margin-left: 1.5rem;
			}
			img {
				width: 42px;
				margin-right: 1rem;
				@include lg {
					width: 38px;
				}
				@include md {
					width: 30px;
				}
			}
			&:hover {
				
			}
		}
	}
}

footer {
	.footer-bg {
		background-image: url("../img/footer-background.jpg");
		padding: 7rem 0 9rem;
		@include sm {
			padding: 6rem 0;
		}
		.row {
			&>div {
				&:first-child {
					border-right: solid 1px #fff;
					img {
						width: 215px;
					}
				}
				&:last-child {
					padding: 1rem 4rem;
					table {
						width: 100%;
						color: #fff;
						margin-bottom: 1rem;
						@include xs {
							display: flex;
							justify-content: center;
						}
						th {
							width: 17%;
							@include lg {
								width: 21%;
							}
							@include md {
								width: 25%;
							}
						}
					}
					a {
						display: flex;
						align-items: center;
						font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
						font-size: 36px;
						font-size: 3.6rem;
						color: #fff;
						letter-spacing: 0.05em;
						@include md {
							font-size: 32px;
							font-size: 3.2rem;
						}
						@include sm {
							font-size: 30px;
							font-size: 3rem;
						}
						@include xs {
							justify-content: center;
						}
						&::before {
							content: "";
							background-image: url("../img/icon-tel-h.svg");
							display: inline-block;
							width: 48px;
							height: 48px;
							margin-right: 1rem;
							@include md {
								width: 40px;
								height: 40px;
							}
							@include sm {
								width: 34px;
								height: 34px;
							}
						}
					}
				}
			}
		}
	}
	.copyright {
		font-size: 12px;
		font-size: 1.2rem;
		font-weight: 350;
		padding: 0.75rem 0;
	}
}

/* トップへ戻るボタン */
#page-top {
    position: fixed;
	bottom: 7.5rem;
	right: 3rem;
	z-index: 10;
}
#page-top a {
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
	width: 57px;
	height: 57px;
	transform-origin: center;
}
#page-top a:hover {
	transform: scale(1.2);
}
/* トップへ戻るボタン */