.c-btn {
  display: block;
  position: relative;
  width: fit-content;
  padding: 1.4em 3.6em 1.4em 1.8em;
	border-radius: var(--spc-2);
	font-size: var(--fs-sm);
	text-align: center;
	color: var(--c-white);
	background-color: var(--c-primary);
	&:hover {
		background-color: var(--c-primary-darken);
		opacity: 1;
	}
	&.-block {
		width: 100%;
		max-width: 36rem;
	}
	svg {
		position: absolute;
		inset: 0 1.25em 0 auto;
		width: 1.25em;
		height: 1.25em;
		margin: auto;
		fill: var(--c-white);
	}
}

.c-btnWrap-sp {
	display: none;
	margin-top: var(--spc-12);
	& > * {
		margin-inline: auto;
	}
  @media (max-width: 1024px) {
    display: block;
  }
}

.c-scrollBtn {
	color: var(--c-black);
	&:hover {
		opacity: 1;
		img {
			transform: translateY(20%);
		}
	}
	&.-up {
		color: var(--c-primary-lighten);
		&:hover {
			img {
				transform: translateY(-20%);
			}
		}
	}
	* {
		font-family: var(--ff-en);
		font-weight: var(--fw-bold-en);
		text-align: center;
	}
	img {
		width: 2.4rem;
		margin-inline: auto;
	}
}