@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;500;600;700&display=swap');
html {
	scroll-behavior: smooth;
	/* scroll-padding-top: 6.75em; */
}
body {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 14px;
	line-height: 1.75;
	color: #000;
	background: #fff;
	margin: 0;
	padding: 0;
	position: relative;
	background: #fff url(../images/bg.jpg) center top no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

* {
	font-size: 1em;
	box-sizing: border-box;
	background-size: contain;
}

html, body, p, h1, h2, h3, h4, h5, ul, ol, li, dd, dl, dt, div {
	padding: 0;
	margin: 0;
	font-weight: 500;
}

img {
	border: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	vertical-align:top;
	max-width: 100%;
}

html { height: 100%; }
li { list-style-type: none; }
a {
	color: inherit;
	text-decoration: none;
}
a.underline,
.underline a { text-decoration: underline; }

.none { display: none; }
.sp { display: none; }
.pc { display: block; }

/* 選択色 */
::selection {
	background: #fff;
	color: #000413;
}

::-moz-selection {
	background: #fff;
	color: #000;
}
section {
	margin: 0 auto;
	padding-bottom: 5em;
	text-align: center;
	widtn: 100%;
	max-width: 500px;
	background: #ffead9;
}

.fixed-btn {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 1em 1em 4em;
	text-align: center;
	z-index: 100;
	transform: translateY(110%);
	transition: transform 0.4s ease;
}
.fixed-btn.is-show {
	transform: translateY(0);
}
.btn {
	background: #fff;
	padding: 1em 1em 3em;
}
.fixed-btn a,
.btn a {
	position: relative;
	display: inline-block;
	width: 100%;
	max-width: 470px;
	/* btn.png の角丸(700x100・半径約15px)に合わせてキラッと光る帯をクリップ */
	border-radius: 2.2% / 15%;
	overflow: hidden;
	/* 影で立体感を出す */
	box-shadow: 0 0.25em 1em rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.1);
}
.fixed-btn img,
.btn img {
	width: 100%;
	vertical-align: bottom;
}

/* キラッと光る演出 */
.fixed-btn a::after,
.btn a::after {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(105deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
	transform: skewX(-25deg);
	animation: btn-shine 3.5s ease-in-out infinite;
	pointer-events: none;
}
@keyframes btn-shine {
	0% { left: -75%; }
	40% { left: 125%; }
	100% { left: 125%; }
}

/* 画面に入った時に少し拡大して目立たせる */
@keyframes btn-pop {
	0% { transform: scale(1); }
	40% { transform: scale(1.08); }
	100% { transform: scale(1); }
}
.btn.is-view a {
	animation: btn-pop 0.7s ease-out;
}
.fixed-btn.is-show a {
	animation: btn-pop 0.6s ease-out 0.45s backwards;
}

.mm10 {
	margin-top: -4em;
}

@media all and (max-width: 736px) {
	img { max-width: 100%; }
	.sp { display: block; }
	.pc { display: none; }

	body {
		font-size: 3vw;
		background-size: 150% auto;
	}
	section { max-width: 750px; }
	.fixed-btn a, .btn a { max-width: 750px; }
}
::-webkit-full-page-media, :future, :root main { height: auto; }