@charset "utf-8";

body .sp-item {
	display: none;
}
body .pc-item {
  display: block;
}

@media screen and (max-width: 640px) {
	body {
		min-width: inherit;
		height:100%;
	}
	body .sp-item {
		display: block;
	}
	body .pc-item {
		display: none;
	}
	body .sp-item img {
		width:100%;
	}
}

/* ----------------------------------------------------
    共通
---------------------------------------------------- */

body {
	max-width: inherit;
	height: 100%;
	background: url(../images/bg-body.png) repeat center center;
	background-attachment: fixed;
}
.main {
	font-family: 'ヒラギノ角ゴシック','Hiragino Sans','Meiryo UI',sans-serif;
	font-weight: 400;
	line-height: 1.7;
	font-size: 20px;
	color:#333;
	background-color: #fff;
	text-align: justify;
	overflow-x: hidden;
	max-width: 1024px;
	margin: 0 auto;
	box-shadow: 0 0 8px #ccc;
}
img {
	margin: 0 auto;
	width: 100%;
}
video {
	width: 100%;
}
p {
	font-feature-settings: "palt";
	text-align: justify;
}
.inner {
	width: 724px;
	margin: 0 auto;
}
.marker {
	color: #333;
	background: linear-gradient(to top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 10%, rgba(255,255,150,1) 10%, rgba(255,255,150,1) 90%, rgba(255,255,255,1) 90%, rgba(255,255,255,1) 100%);
}
.bold {
	font-weight: 700;
}

@media screen and (max-width: 640px) {
	img {
		max-width: 100%;
	}
	body {
		width: 100%;
	}
	.inner {
		width: 94%;
	}
	.main {
		width: 100%;
	}
}

.btn_area{
	max-width: 1024px;
	position: relative;
	margin: 0 auto;
}

.btn {
	transition: opacity 0.2s;
	filter: drop-shadow(5px 5px 5px rgba(153,153,153,0.3));
}

.btn:hover {
	opacity: 0.8;
	cursor: pointer;
}

.btn-wrapper {
	bottom: 29%;
	left: 50%;
	transform: translateX(-50%);
	width: 65%;
	position: absolute;
}

.btn_area02 .btn-wrapper {
	bottom: 49%;
}

.btn-wrapper .btn:not(:first-of-type) {
	margin-top: 1em;
}

.btn_area03 .btn-wrapper {
	bottom: 37.5%;
}

	@media screen and (max-width: 640px) {
		.btn-wrapper {
			bottom: 22%;
			width: 85%;
		}
		.btn-phone {
			bottom: 25.5%;
			left: 50%;
			transform: translateX(-50%);
			width: 85%;
			position: absolute;
		}
		.btn-wrapper .btn:not(:first-of-type) {
			margin-top: 0.4em;
		}
		.btn_area02 .btn-wrapper {
			bottom: 51%;
		}
		.btn_area03 .btn-wrapper {
			bottom: 44.5%;
		}
		.btn_area03 .btn-phone {
			bottom: 21.8%;
		}
	}

/* ----------------------------------------------------
    MAPエリア
---------------------------------------------------- */
.access {
	background-color: #F2F2F2;
	padding: 40px;
}
.access__inner{
	width: 724px;
	margin: 0 auto;
	background-color: #fff;
	padding: 40px 0;
	text-align: center;
	line-height: 1.6;
}
.access__inner__text {
	font-size: 22px;
}
.address {
	margin-top: 32px;
	font-size: 26px;
}
.access__inner__map {
	width: 650px;
	height: 450px;
	margin: 20px auto 0;
}
.access__inner__map iframe {
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 640px) {
	.access {
		padding: 40px 20px;
	}
	.access__inner{
		width: 90%;
		padding: 1.5em 1em;
	}
	.access__inner__text {
		font-size: 4.5vw;
		text-align: justify;
	}
	.address {
		margin-top: 1.5em;
		font-size: 4.6vw;
		text-align: justify;
	}
	.access__inner__map {
		margin-top: 20px;
		width: 100%;
		height: auto;
		aspect-ratio: 1/1;
	}
}

/* ----------------------------------------------------
    footer
---------------------------------------------------- */
.footer {
	background-color: #EEBA3D;
	color: #fff;
	padding: 20px 0;
	font-size: 14px;
	font-weight: 200;
	text-align: center;
}

/* ----------------------------------------------------
    固定ボタン
---------------------------------------------------- */
.fixed-bottom-link {
	position: fixed;
	bottom: 0;
	width: 100%;
	filter: drop-shadow(3px 3px 4px #999);
	z-index: 100;
	display: none; /* 初期状態では非表示 */
	background-color: #333;
}
.fixed-bottom-link.show {
	display: block; /* クラスが付与されたら表示 */
}
.fixed_btn_wrapper {
	display: flex;
	gap: 8px;
	justify-content: center;
	padding: 10px;
}
.fixed_btn {
	width: 280px;
}
.fixed_btn_tel {
	width: 249px;
}
.fixed_btn a {
	display: inline-block;
	transition: .2s;
}
.fixed_btn a:hover {
	transform: scale(1.03);
	cursor: pointer;
}

/*フッターまでスクロールしたら消す*/
.is-hidden {
  visibility: hidden;
  opacity: 0;
}

@media screen and (max-width: 640px) {
	.fixed-bottom-link {
		bottom: 0px;
		left: 50%;
		transform: translateX(-50%);
		width:100%;
		padding-bottom: 0.2em;
	}
	.fixed_btn_wrapper {
		gap: 8px;
		padding: 0.5em 0;
		width:94%;
		margin: 0 auto;
	}
	.fixed_btn,
	.fixed_btn_tel {
		width: 100%;
	}
}