@charset "UTF-8";
:root {
	--primary-color: #BF0000;
	--secondary-color: #f9f2f3;
	--font-black-color: #171717;
	--font-white-color: #fff;
	--font-gray-1-color: #F2F2F2;
	--font-gray-2-color: #D9D9D9;
	--normal-font-weight: 400;
	--medium-font-weight: 500;
	--bold-font-weight: 700;
	--black-font-weight: 900;
	--default-letter-spacing: 0;
	--default-line-height: 1.5;
	--primary-bg-color: #FFFFFF;
	--gray-bg-color: #EAEEF2;
	--primary-border-radius: 4px;
	--default-container-base: 1024px;
	--default-container-padding: 10px;
	--default-container-width: calc(var(--default-container-base) + var(--default-container-padding) * 2);
	--body-min-width: 1024px;
	--primary-font: "Noto Sans JP", sans-serif;
	--svg-color-1: #fff
}
html {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	word-break: normal;
	-moz-tab-size: 4;
	tab-size: 4
}
*, :before, :after {
	background-repeat: no-repeat;
	box-sizing: inherit
}
:before, :after {
	text-decoration: inherit;
	vertical-align: inherit
}
* {
	padding: 0;
	margin: 0
}
hr {
	overflow: visible;
	height: 0;
	color: inherit
}
details, main {
	display: block
}
summary {
	display: list-item
}
small {
	font-size: 80%
}
[hidden] {
	display: none
}
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted
}
a {
	background-color: transparent
}
a:active, a:hover {
	outline-width: 0
}
code, kbd, pre, samp {
	font-family: monospace, monospace
}
pre {
	font-size: 1em
}
b, strong {
	font-weight: bolder
}
sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}
sub {
	bottom: -.25em
}
sup {
	top: -.5em
}
table {
	border-color: inherit;
	text-indent: 0
}
input {
	border-radius: 0
}
[disabled] {
	cursor: default
}
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
	height: auto
}
[type=search] {
	-webkit-appearance: textfield;
	appearance: textfield;
	outline-offset: -2px
}
[type=search]::-webkit-search-decoration {
	-webkit-appearance: none
}
textarea {
	overflow: auto;
	resize: vertical
}
button, input, optgroup, select, textarea {
	font: inherit
}
optgroup {
	font-weight: 700
}
button {
	overflow: visible
}
button, select {
	text-transform: none
}
button, [type=button], [type=reset], [type=submit], [role=button] {
	cursor: pointer;
	color: inherit
}
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
	border-style: none;
	padding: 0
}
button:-moz-focusring, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
	outline: 1px dotted ButtonText
}
button, html [type=button], [type=reset], [type=submit] {
	-webkit-appearance: button;
	appearance: button;
}
button, input, select, textarea {
	background-color: transparent;
	border-style: none
}
a:focus, button:focus, input:focus, select:focus, textarea:focus {
	outline-width: 0
}
select {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}
select::-ms-expand {
	display: none
}
select::-ms-value {
	color: currentColor
}
legend {
	border: 0;
	color: inherit;
	display: table;
	white-space: normal;
	max-width: 100%
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	color: inherit;
	font: inherit
}
img {
	border-style: none
}
progress {
	vertical-align: baseline
}
[aria-busy=true] {
	cursor: progress
}
[aria-controls] {
	cursor: pointer
}
[aria-disabled=true] {
	cursor: default
}
body {
	font-family: Noto Sans JP, sans-serif;
	font-family: var(--primary-font);
	color: #171717;
	color: var(--font-black-color);
	font-weight: 400;
	font-weight: var(--normal-font-weight);
	font-size: 16px;
	line-height: 1.5;
	line-height: var(--default-line-height);
	min-width: 1024px;
	min-width: var(--body-min-width);
	letter-spacing: 0;
	letter-spacing: var(--default-letter-spacing);
	background-color: #fff;
	background-color: var(--primary-bg-color);
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	position: relative
}
@media (max-width: 767px) {
	body {
		min-width: 0;
		font-size: 14px
	}
}
html, body {
	scroll-padding-top: 50px
}
@media (min-width: 768px) {
	html, body {
		scroll-padding-top: 140px
	}
}
*, *:before, *:after {
	background-repeat: no-repeat
}
a {
	-webkit-text-decoration: none;
	text-decoration: none;
	transition: opacity .3s ease-out;
	color: inherit
}
a:hover {
	opacity: .7
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: middle
}
strong {
	font-weight: 700;
	font-weight: var(--bold-font-weight)
}
button {
	outline: none
}
.container--1200 {
	--default-container-base: 1200px
}
.container--1180 {
	--default-container-base: 1180px
}
.container--1100 {
	--default-container-base: 1100px
}
.container--1440 {
	--default-container-base: 1440px
}
.container--1126 {
	--default-container-base: 1126px
}
.container--1000 {
	--default-container-base: 1000px
}
.container {
	--default-container-width: calc(var(--default-container-base) + var(--default-container-padding)*2);
	max-width: 100%;
	width: 1044px;
	width: var(--default-container-width);
	margin: 0 auto;
	padding: 0 10px;
	padding: 0 var(--default-container-padding)
}
.container--full {
	width: 100%;
	padding-left: 50px;
	padding-right: 50px
}
@media (max-width: 767px) {
	.container--full {
		padding-left: 25px;
		padding-right: 25px
	}
}
@media (max-width: 767px) {
	.container--child {
		padding: 0
	}
}
.wrap {
	overflow: hidden
}
.underline {
	-webkit-text-decoration: none;
	text-decoration: none;
	border-bottom: 1px solid #000;
	padding-bottom: 5px;
	white-space: nowrap
}
.ext {
	display: inline-flex;
	align-items: center
}
.ext:after {
	content: "";
	display: block;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAABBklEQVQokY3STStFURQG4Odyo5SPgTIzMWEqcxMzKTMTBv6Ff6BuGRoZGMhXycDYX8BIYiBShKmUfBytWvd20rn3emufvfdZ693rfdfetZHjhsQStvwPb/VS2gxqmM25CgUmsF/PSkdxCh5w3qXmLV6DeIABPKGsYBEreMYLbrCH0VAUie8pof7n5P6MzWMcl0n8imAPvttIOsRqxu9xl/9rTWI7TOMzO72JucwrOhGncJakdVyXrqpXha8i5/C2jN3cn+RoSS0T+/CT6/AUowqPZeJHtnwSFx18B4Yw1iQOZ6tDf7yMKoSNwSx2FZ/YLOAUO12qtRDE0LyR99XujTabsoZt+AWezzWU+0sOpQAAAABJRU5ErkJggg==);
	width: 14px;
	height: 14px;
	margin-left: 10px;
	flex-shrink: 0
}
.fade {
	opacity: 0;
	transform: translateY(50px);
	transition: all .5s ease-in-out
}
.fade--in {
	opacity: 1;
	transform: translateY(0)
}
.link-color {
	color: #bf0000;
	color: var(--primary-color);
	-webkit-text-decoration: underline;
	text-decoration: underline
}
.qrBox {
	position: fixed;
	bottom: 80px;
	right: 40px;
	width: 160px;
	height: 160px;
	margin: 0;
	padding: 14px;
	border: #fff 2px solid;
	border-radius: 23px;
	background-color: rgba(191,0,0,0.8);
	/* background-color: var(--primary-color); */
	text-align: center;
	box-shadow: 0 5px 15px #00000059;
	z-index: 9999;
	box-sizing: content-box;
}
@media (max-width: 767px) {
	.qrBox {
		display: none
	}
}
.qrBox p {
	margin: 0 0 14px;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
	text-align: center;
}
.qrBox img {
	width: 100px;
	height: 100px
}

/*メニューをページ下部に固定*/
#sp-fixed-menu{
	position: fixed;
	width: 100%;
	bottom: 0px;
	font-size: 0;
	z-index: 99;
 }
/*メニューを横並びにする*/
 #sp-fixed-menu ul{
	display: flex;
	list-style: none;
	padding:0;
	margin:0;
	width:100%;
 }
 #sp-fixed-menu li{
	justify-content: center;
	align-items: center;
	width: 100%;
	padding:0;
	margin:0;
	font-size: 20px;
	font-weight: 700;
	background-color: rgba(191,0,0,0.8);
 }
 /*ボタンを調整*/
 #sp-fixed-menu li a{
	color: #fff;
	text-align: center;
	display:block;
	width: 100%;
	padding:20px;
 }
 @media (min-width: 768px) {
	#sp-fixed-menu{
		display: none;
	}
}









.breadcrumbs {
	list-style: none;
	font-size: 14px;
	line-height: 1.5;
	flex-wrap: wrap;
	display: flex;
	background-color: #000;
	height: 50px;
	padding: 0 36px
}
@media (max-width: 767px) {
	.breadcrumbs {
		font-size: 12px;
		height: 40px;
		padding: 0 20px
	}
}
.breadcrumbs__item {
	display: flex;
	align-items: center;
	color: #fff;
	letter-spacing: .1em;
	font-weight: 700;
	font-weight: var(--bold-font-weight)
}
.breadcrumbs__item:not(:last-child):after {
	content: "\ff0f";
	margin: 0 15px
}
@media (max-width: 767px) {
	.breadcrumbs__item:not(:last-child):after {
		margin: 0 5px
	}
}
.breadcrumbs__item a {
	color: inherit
}
.button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 74px;
	width: 100%;
	max-width: 500px;
	color: #fff;
	background-color: #bf0000;
	background-color: var(--primary-color);
	font-size: 19px;
	background-image: url("data:image/svg+xml,%3Csvg id='\30b3\30f3\30dd\30fc\30cd\30f3\30c8_1_36' data-name='\30b3\30f3\30dd\30fc\30cd\30f3\30c8  1 \2013  36' xmlns='http://www.w3.org/2000/svg' width='10' height='13' viewBox='0 0 10 13'%3E%3Cpath id='\591a\89d2\5f62_1' data-name='\591a\89d2\5f62  1' d='M6.5,0,13,10H0Z' transform='translate(10) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
	background-position: right 32px center;
	-webkit-text-decoration: none;
	text-decoration: none;
	transition: all .25s ease-in-out;
	border-radius: 13px;
	font-weight: 700;
	font-weight: var(--bold-font-weight)
}
@media (min-width: 768px) {
	.button {
		height: 100px;
		font-size: 30px
	}
}
.contact-button {
	width: 152px;
	height: 37px;
	border-radius: 4px;
	background-color: #bf0000;
	background-color: var(--primary-color);
	color: #fff;
	font-weight: 500;
	font-weight: var(--medium-font-weight);
	font-size: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px
}
@media (max-width: 767px) {
	.contact-button {
		font-size: 15px;
		width: 145px;
		height: 35px
	}
	.contact-button svg {
		width: 15px;
		height: 13px;
		margin-top: 2px
	}
}
.footer {
	text-align: center;
	padding-bottom: 30px
}
.footer__text {
	text-align: center;
	font-size: 14px;
	font-weight: 500;
	font-weight: var(--medium-font-weight);
	letter-spacing: .08em;
	margin-bottom: 8px
}
@media (min-width: 768px) {
	.footer__text {
		font-size: 16px
	}
}
.footer__text a {
	color: #bf0000;
	color: var(--primary-color);
	-webkit-text-decoration: underline;
	text-decoration: underline
}
.footer img {
	width: 420px;
}
.header {
	position: sticky;
	left: 0;
	right: 0;
	top: 0;
	z-index: 6000
}
@media (max-width: 767px) {
	.header {
		position: sticky
	}
}
.header__wrap {
	height: 138px;
	margin: 0 auto;
	padding: 0;
	display: flex;
	position: relative;
	background-color: #fff;
	border-bottom: 1px solid #c9c9ca
}
@media (min-width: 768px) {
	.header__wrap {
		display: flex;
		flex-wrap: wrap
	}
}
@media (max-width: 767px) {
	.header__wrap {
		height: 42px;
		justify-content: space-between
	}
}
.header__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: auto;
	font-size: 16px;
	position: absolute;
	inset: 4px 0 0
}
@media (min-width: 768px) {
	.header__logo {
		justify-content: flex-start;
		position: static;
		margin-left: 60px;
		height: 62px
	}
}
@media (max-width: 767px) {
	.header__logo a {
		font-size: 10px
	}
}
.header__logo img {
	width: 151px
}
@media (max-width: 767px) {
	.header__logo img {
		width: 74px
	}
}
.header__nav {
	display: flex;
	justify-content: center
}
@media (min-width: 768px) {
	.header__nav {
		margin-left: auto;
		margin-top: auto;
		border-top: 2px solid #BF0000;
		border-top: 2px solid var(--primary-color);
		width: 100%
	}
}
@media (max-width: 767px) {
	.header__nav {
		opacity: 0;
		margin: auto;
		visibility: hidden;
		transition: all .25s ease-in-out;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		padding: 0 25px 30px;
		position: fixed;
		top: 50px;
		left: 0;
		right: 0;
		color: #171717;
		color: var(--font-black-color)
	}
}
@media (max-width: 767px) {
	.header__nav--open {
		opacity: 1;
		visibility: visible
	}
}
@media (min-width: 768px) {
	.header__toggle {
		display: none
	}
}
.header__buttons {
	display: flex;
	align-items: center;
	margin-left: auto;
	margin-right: 60px
}
@media (max-width: 767px) {
	.header__buttons {
		margin-right: 20px;
		margin-left: 20px;
		border-top: 1px solid #707070;
		padding-top: 12px;
		padding-bottom: 10px
	}
}
@media (max-width: 767px) {
	.header .social-nav {
		padding-left: 50px
	}
}
@keyframes header-scroll {
	0% {
		transform: translateY(-100%)
	}
	to {
		transform: translateY(0)
	}
}
.toggle {
	width: 42px;
	height: 42px;
	position: relative;
	z-index: 15000;
	left: 0
}
@media (max-width: 767px) {
	.toggle {
		width: 42px;
		height: 42px
	}
}
.toggle--open .toggle__bar--1 {
	transform: rotate(45deg);
	top: 44px
}
@media (max-width: 767px) {
	.toggle--open .toggle__bar--1 {
		top: 20px
	}
}
.toggle--open .toggle__bar--2 {
	opacity: 0
}
.toggle--open .toggle__bar--3 {
	transform: rotate(-45deg);
	top: 44px
}
@media (max-width: 767px) {
	.toggle--open .toggle__bar--3 {
		top: 20px
	}
}
.toggle__bar {
	width: 35px;
	height: 2px;
	display: block;
	left: 0;
	right: 0;
	margin: 0 auto;
	border-radius: 1.5px;
	position: absolute;
	transition: all .2s ease-out
}
@media (max-width: 767px) {
	.toggle__bar {
		width: 16px;
		height: 2px
	}
}
.toggle__bar--1 {
	top: 30px;
	background-color: #171717;
	background-color: var(--font-black-color)
}
@media (max-width: 767px) {
	.toggle__bar--1 {
		top: 13px
	}
}
.toggle__bar--2 {
	top: 44px;
	background-color: #171717;
	background-color: var(--font-black-color)
}
@media (max-width: 767px) {
	.toggle__bar--2 {
		top: 19px
	}
}
.toggle__bar--3 {
	top: 58px;
	background-color: #171717;
	background-color: var(--font-black-color)
}
@media (max-width: 767px) {
	.toggle__bar--3 {
		top: 25px
	}
}
.global-nav {
	list-style: none;
	background-color: #fff;
	padding: 10px;
	border: 2px solid #BF0000;
	border: 2px solid var(--primary-color);
	box-shadow: 0 0 20px #00000029;
	border-radius: 6px;
	width: 100%
}
@media (min-width: 768px) {
	.global-nav {
		display: flex;
		border: none;
		padding: 0;
		gap: 60px;
		box-shadow: none;
		justify-content: center
	}
}
@media (min-width: 768px) {
	.global-nav__item {
		position: relative
	}
	.global-nav__item:hover .child-nav {
		opacity: 1;
		visibility: visible
	}
}
@media (max-width: 767px) {
	.global-nav__item:nth-child(2) {
		margin-bottom: 10px
	}
}
.global-nav__link {
	display: flex;
	align-items: center;
	font-size: 15px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	background-color: #bf0000;
	background-color: var(--primary-color);
	color: #fff;
	padding: 0 0 0 50px;
	height: 56px;
	line-height: 1.33333;
	position: relative
}
@media (min-width: 768px) {
	.global-nav__link {
		background-color: transparent;
		color: #bf0000;
		color: var(--primary-color);
		font-weight: 500;
		font-weight: var(--medium-font-weight);
		padding: 0;
		font-size: 18px;
		text-align: center;
		line-height: 1.33333;
		height: 74px;
		gap: 12px
	}
}
.global-nav__link:before {
	content: "";
	display: block;
	position: absolute;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21' height='18' viewBox='0 0 21 18'%3E%3Cpath id='\591a\89d2\5f62_4' data-name='\591a\89d2\5f62  4' d='M10.5,0,21,18H0Z' transform='translate(21 18) rotate(180)' fill='%23fff'/%3E%3C/svg%3E%0A");
	width: 10.5px;
	height: 9px;
	background-size: contain;
	left: 20px;
	top: 26px
}
@media (min-width: 768px) {
	.global-nav__link:before {
		content: none
	}
}
.child-nav {
	list-style: none;
	padding: 25px 20px 20px
}
@media (min-width: 768px) {
	.child-nav {
		opacity: 0;
		visibility: hidden;
		position: absolute;
		left: 50%;
		transform: translate(-50%);
		border: 4px solid #BF0000;
		border: 4px solid var(--primary-color);
		box-shadow: 0 0 20px #00000029;
		border-radius: 12px;
		background-color: #fff;
		transition: all .25s ease-in-out;
		top: 66px
	}
}
.child-nav__item {
	font-size: 15px;
	font-weight: 500;
	font-weight: var(--medium-font-weight);
	position: relative;
	white-space: nowrap
}
@media (min-width: 768px) {
	.child-nav__item {
		font-size: 16px
	}
}
.child-nav__item a {
	display: grid;
	grid-template-columns: 28px 1fr;
	grid-gap: 15px;
	gap: 15px;
	align-items: center
}
@media (min-width: 768px) {
	.child-nav__item a {
		grid-template-columns: 33px 1fr
	}
	.child-nav__item a img {
		width: 33px;
		height: 30px;
		object-fit: contain;
		object-position: center
	}
}
.child-nav__item a:before {
	content: "";
	display: block;
	position: absolute;
	inset: 0
}
.child-nav__item:not(:last-child) {
	margin-bottom: 16px
}
.section-title {
	font-size: 25px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	line-height: 1.6;
	position: relative;
	padding-bottom: 16px;
	text-align: center;
	white-space: nowrap
}
@media (min-width: 768px) {
	.section-title {
		font-size: 32px;
		padding-bottom: 20px
	}
}
.section-title:after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	width: 88px;
	height: 2px;
	background-color: #bf0000;
	background-color: var(--primary-color)
}
.section-title--regular {
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	margin-bottom: 30px;
	margin-left: -20px;
	margin-right: -20px
}
.section-title--mb {
	margin-bottom: 60px
}
.section-title--mb strong {
	color: #bf0000;
	color: var(--primary-color)
}
.section-lead {
	text-align: center;
	font-size: 19px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	line-height: 1.5;
	margin-top: 46px;
	margin-bottom: 76px
}
@media (min-width: 768px) {
	.section-title--mb {
		margin-bottom: 80px
	}
	.section-lead {
		font-size: 26px
	}
}
.section-lead strong {
	color: #bf0000;
	color: var(--primary-color)
}
.widget h2 {
	background-color: #bf0000;
	background-color: var(--primary-color);
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	font-family: var(--heading-font);
	line-height: 1.5;
	padding: 7px 16px;
	margin-bottom: 20px
}
.widget:not(:last-child) {
	margin-bottom: 36px
}
.wp-block-archives-dropdown select {
	background-color: #eaeaea;
	height: 40px;
	width: 100%;
	padding: 0 18px;
	cursor: pointer
}
.wp-block-categories {
	list-style: none
}
.wp-block-categories .cat-item:before {
	content: "\ff0d\3000"
}
.italic-type {
	font-style: italic
}
.general-list {
	list-style: none;
	padding-left: 1em
}
.general-list:not(:last-child) {
	margin-bottom: 30px
}
.general-list .smaller {
	font-size: var(--fz12)
}
.general-list__item, .general-list li {
	position: relative;
	padding-left: 1em;
	line-height: 2
}
.general-list__item:before, .general-list li:before {
	position: absolute;
	left: 0;
	top: 0;
	content: "\30fb"
}
.circle-list {
	list-style: none;
	font-size: 20px;
	line-height: 1.95
}
@media (max-width: 767px) {
	.circle-list {
		font-size: 14px
	}
}
.circle-list__item, .circle-list li {
	position: relative;
	padding-left: 32px;
	letter-spacing: .05em
}
@media (max-width: 767px) {
	.circle-list__item, .circle-list li {
		padding-left: 22px
	}
}
.circle-list__item:before, .circle-list li:before {
	position: absolute;
	left: 0;
	top: 0;
	content: "\25cf";
	color: #bf0000;
	color: var(--primary-color)
}
.dl-list__item {
	display: grid;
	grid-template-columns: 90px 1fr
}
.dl-list__name {
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	color: #bf0000;
	color: var(--primary-color);
	line-height: 1.75
}
.dl-list__content, .section-text {
	line-height: 1.75
}
.color-primary {
	color: #bf0000;
	color: var(--primary-color)
}
.text-underline {
	-webkit-text-decoration: underline;
	text-decoration: underline
}
.page-column {
	display: grid;
	grid-template-columns: 1fr 336px;
	grid-gap: 40px;
	gap: 40px;
	padding-top: 160px
}
@media (max-width: 767px) {
	.page-column {
		padding-top: 70px;
		grid-template-columns: 1fr
	}
}
.page-content {
	padding-bottom: 150px
}
@media (max-width: 767px) {
	.page-content {
		padding-bottom: 70px
	}
}
@media (max-width: 767px) {
	.section-more {
		text-align: center
	}
}
.hero {
	margin-bottom: 30px
}
@media (min-width: 768px) {
	.hero {
		margin-bottom: 40px
	}
}
.hero__top {
	background-color: #bf0000;
	padding: 16px 20px 55px;
	text-align: center
}
@media (min-width: 768px) {
	.hero__top {
		padding: 50px 20px 150px
	}
}
.hero__top img {
	width: 302px
}
@media (min-width: 768px) {
	.hero__top img {
		width: 600px
	}
}
.hero__list {
	margin-top: -42px
}
@media (min-width: 768px) {
	.hero__list {
		margin-top: -116px
	}
}
.hero-flow-list {
	background-color: #fff;
	color: #000;
	padding: 11px 20px 20px;
	border-radius: 9px;
	display: grid;
	grid-template-columns: repeat(3, 80px);
	grid-gap: 38px;
	gap: 38px;
	justify-content: center;
	font-size: 11px;
	line-height: 1.090909;
	list-style: none;
	text-align: center;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	letter-spacing: -.05em;
	white-space: nowrap;
	box-shadow: 0 0 30px #0000001a
}
@media (min-width: 768px) {
	.hero-flow-list {
		padding: 30px 44px 32px;
		width: 800px;
		margin-left: auto;
		margin-right: auto;
		grid-template-columns: repeat(3, 180px);
		border-radius: 18px;
		gap: 75px
	}
}
.hero-flow-list__text {
	height: 27px;
	display: inline-flex;
	align-items: center;
	margin-bottom: 8px
}
@media (min-width: 768px) {
	.hero-flow-list__text {
		font-size: 25px;
		margin-bottom: 20px;
		line-height: 1.2;
		height: 60px
	}
}
.hero-flow-list__item {
	position: relative
}
.hero-flow-list__item:not(:last-child):after {
	content: "";
	display: block;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21.678' height='24.548' viewBox='0 0 21.678 24.548'%3E%3Cpath id='\30d1\30b9_9758' data-name='\30d1\30b9  9758' d='M170.742,63.559c1.3.75,1.3,1.976,0,2.726L152.4,76.876c-1.3.75-2.361.137-2.361-1.363V54.331c0-1.5,1.062-2.112,2.361-1.363Z' transform='translate(-150.038 -52.648)' fill='%23bf0000'/%3E%3C/svg%3E%0A");
	width: 12px;
	height: 12px;
	background-size: contain;
	position: absolute;
	bottom: 33px;
	left: calc(100% + 13px);
	margin: auto
}
@media (min-width: 768px) {
	.hero-flow-list__item:not(:last-child):after {
		width: 22px;
		height: 25px;
		left: calc(100% + 26px);
		bottom: 75px
	}
}
@media (min-width: 768px) {
	.hero-flow-list img {
		width: 180px
	}
}
.hero-flow-list-note {
	font-size: 10px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	color: #fff;
	margin-top: 8px;
	line-height: 1.3;
	text-align: center;
	letter-spacing: -.05em;
	white-space: nowrap
}
@media (min-width: 768px) {
	.hero-flow-list-note {
		font-size: 16px;
		margin-top: 28px
	}
}
.prologue {
	padding-bottom: 52px
}
.prologue-title {
	font-size: 20px;
	text-align: center;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	line-height: 1.666666;
	margin-bottom: 30px;
}
@media (min-width: 768px) {
	.prologue-title {
		font-size: 36px;
		margin-bottom: 40px;
	}
}
.prologue-image {
	text-align: center;
	position: relative
}
.prologue-image__image {
	width: max-content;
	position: relative;
	margin: 0 auto;
	width: 100%;
}
.prologue-image__image img {
	width: 90%;
}
@media (min-width: 768px) {
	.prologue-image__image {
		width: 540px;
	}
	.prologue-image__image img {
		width: 100%;
	}
}
.prologue-image__fukidashi {
	font-size: 10px;
	color: #fff;
	background-color: #bf0000;
	background-color: var(--primary-color);
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	line-height: 1.5;
	padding: 10px;
	border-radius: 6px;
	position: absolute;
	text-align: left
}
@media (min-width: 768px) {
	.prologue-image__fukidashi {
		font-size: 16px
	}
}
.prologue-image__fukidashi--1 {
	top: 24px;
	left: -104px
}
@media (min-width: 768px) {
	.prologue-image__fukidashi--1 {
		top: 66px;
		left: -140px
	}
}
.prologue-image__fukidashi--1:before {
	content: "";
	display: block;
	position: absolute;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='18' viewBox='0 0 29 18'%3E%3Cpath id='\591a\89d2\5f62_2' data-name='\591a\89d2\5f62  2' d='M9,0l9,29H0Z' transform='translate(29) rotate(90)' fill='%23bf0000'/%3E%3C/svg%3E%0A");
	width: 14px;
	height: 9px;
	top: 0;
	bottom: 0;
	margin: auto;
	background-size: contain;
	left: 100%
}
.prologue-image__fukidashi--2 {
	top: 111px;
	right: -104px
}
@media (min-width: 768px) {
	.prologue-image__fukidashi--2 {
		top: 245px;
		right: -139px
	}
}
.prologue-image__fukidashi--2:before {
	content: "";
	display: block;
	position: absolute;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='18' viewBox='0 0 29 18'%3E%3Cpath id='\591a\89d2\5f62_2' data-name='\591a\89d2\5f62  2' d='M9,0l9,29H0Z' transform='translate(29) rotate(90)' fill='%23bf0000'/%3E%3C/svg%3E%0A");
	transform: scaleX(-1);
	width: 14px;
	height: 9px;
	top: 0;
	bottom: 0;
	margin: auto;
	background-size: contain;
	right: 100%
}
.cta-area {
	background-color: #fff;
	padding: 24px 0 36px;
	text-align: center
}
@media (min-width: 768px) {
	.cta-area {
		padding: 40px 0
	}
}
.cta-area__title {
	color: #bf0000;
	color: var(--primary-color);
	line-height: 1.363636;
	margin-bottom: 20px;
	font-size: 22px
}
@media (min-width: 768px) {
	.cta-area__title {
		font-size: 32px;
		font-weight: 700;
		font-weight: var(--bold-font-weight)
	}
}
.cta-area__buttons {
	margin-left: 10px;
	margin-right: 10px
}
.cta-area__note {
	font-size: 12px;
	line-height: 1.75;
	margin-top: 20px
}
@media (min-width: 768px) {
	.cta-area__note {
		font-size: 14px
	}
}
.section {
	padding: 42px 0 30px
}
.tab-toc {
	display: grid;
	/* grid-template-columns: repeat(2, 1fr); */
	grid-template-columns: 1fr;
	text-align: center;
	list-style: none;
	grid-gap: 6px;
	gap: 6px
}
.tab-toc__item a {
	background-color: #d9d9da;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 28px;
	height: 50px;
	width: 100%;
	border-radius: 10px 10px 0 0;
	position: relative;
	font-size: 16px;
	font-weight: 700;
	font-weight: var(--bold-font-weight)
}
@media (min-width: 768px) {
	.tab-toc__item a {
		height: auto;
		padding-top: 42px;
		padding-bottom: 14px;
		font-size: 20px;
	}
}
.tab-toc__item a:hover {
	opacity: 1
}
.tab-toc__item a:before {
	content: "";
	display: block;
	position: absolute;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	left: 0;
	right: 0;
	top: -30px;
	margin: auto;
	border: 2px solid #d9d9da;
	background-position: center;
	background-color: #fff
}
@media (min-width: 768px) {
	.tab-toc__item a:before {
		width: 84px;
		height: 84px;
		top: -50px
	}
}
.tab-toc__item a[aria-selected=true] {
	background-color: #bf0000;
	background-color: var(--primary-color);
	color: #fff
}
.tab-toc__item a[aria-selected=true]:before {
	border-color: #bf0000;
	border-color: var(--primary-color)
}
.tab-toc__item--1 a:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='47.146' height='50.773' viewBox='0 0 47.146 50.773'%3E%3Cpath id='Shopping_Cart_Outline' data-name='Shopping Cart Outline' d='M17.336,35.722,12.822,5.631A5.408,5.408,0,0,0,7.442,1H1.5V4.627H7.442A1.8,1.8,0,0,1,9.236,6.17l4.513,30.09a5.409,5.409,0,0,0,5.38,4.633h27.7V37.267h-27.7A1.8,1.8,0,0,1,17.336,35.722ZM14.193,48.147a3.627,3.627,0,1,1,3.627,3.627A3.628,3.628,0,0,1,14.193,48.147Zm25.387,0a3.627,3.627,0,1,1,3.627,3.627A3.628,3.628,0,0,1,39.58,48.147ZM17.167,10.067,16.623,6.44H48.646L47.315,25.09a7.255,7.255,0,0,1-7.235,6.737H20.431L19.887,28.2H40.08A3.642,3.642,0,0,0,43.7,24.833l1.054-14.766Z' transform='translate(-1.5 -1)' fill='%23bf0000' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
	background-size: 26px 28px;
	background-position: left 10px center
}
@media (min-width: 768px) {
	.tab-toc__item--1 a:before {
		background-size: 40px;
		background-position: left 18px center
	}
}
.tab-toc__item--2 a:before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='52' viewBox='0 0 40 52'%3E%3Cpath id='Location_Outline' data-name='Location Outline' d='M23,25.5a4,4,0,1,1,4-4,4,4,0,0,1-4,4m0-24a20,20,0,0,0-20,20c0,14,20,32,20,32s20-18,20-32a20,20,0,0,0-20-20m0,28a8,8,0,1,0-8-8,8.008,8.008,0,0,0,8,8m0-24a16.019,16.019,0,0,1,16,16c0,8.112-9.876,20.042-16,26.376C16.876,41.542,7,29.612,7,21.5a16.019,16.019,0,0,1,16-16' transform='translate(-3 -1.5)' fill='%23bf0000' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
	background-size: 20px 26px;
	background-position: center
}
@media (min-width: 768px) {
	.tab-toc__item--2 a:before {
		background-size: 52px 42px;
		background-position: left 18px center
	}
}
.tab-content {
	background-color: #bf0000;
	background-color: var(--primary-color);
	padding: 24px 10px 20px;
	border-radius: 0 0 10px 10px;
	scroll-margin-top: 90px
}
@media (min-width: 768px) {
	.tab-content {
		scroll-margin-top: 140px
	}
}
.box-section {
	background-color: #fefff9;
	border-radius: 5px;
	padding: 40px 20px 30px
}
.box-section:not(:last-child) {
	margin-bottom: 40px
}
.box-section--faq {
	padding-bottom: 16px
}
@media (min-width: 768px) {
	.box-section--faq {
		padding-bottom: 24px
	}
}
.box-section--about .section-title {
	margin-bottom: 46px
}
@media (min-width: 768px) {
	.box-section--spot {
		padding-bottom: 80px
	}
}
@media (min-width: 768px) {
	.box-section--spot .section-title {
		margin-bottom: 48px
	}
}
.flow-list__title {
	font-size: 19px;
	line-height: 1.6
}
@media (min-width: 768px) {
	.flow-list__title {
		font-size: 20px;
		text-align: center
	}
}
.flow-list__title-note {
	font-size: 14px;
	margin-top: 4px
}
@media (min-width: 768px) {
	.flow-list__title-note {
		width: max-content;
		margin-left: auto;
		margin-right: auto;
		font-size: 14px;
		margin-top: 10px
	}
}
.flow-list__title-note--smaller {
	font-size: 12px;
	margin-top: 8px
}
@media (min-width: 768px) {
	.flow-list__title-note--smaller {
		font-size: 14px;
		margin-top: 10px
	}
}
.flow-list__image {
	text-align: center;
	margin-bottom: 8px
}
.flow-list__image figcaption {
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	font-size: 19px;
	text-align: center;
	line-height: 1.8421
}
@media (min-width: 768px) {
	.flow-list__image figcaption {
		font-size: 24px
	}
}
.flow-list__image figcaption strong {
	color: #bf0000;
	color: var(--primary-color)
}
.flow-list__item {
	position: relative
}
.flow-list__item:not(:last-child) {
	padding-bottom: 80px
}
.flow-list__item:not(:last-child):before {
	content: "";
	display: block;
	position: absolute;
	bottom: 30px;
	left: 0;
	right: 0;
	margin: auto;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='36' viewBox='0 0 46 36'%3E%3Cg id='\30b3\30f3\30dd\30fc\30cd\30f3\30c8_1_5' data-name='\30b3\30f3\30dd\30fc\30cd\30f3\30c8  1 \2013  5' transform='translate(46) rotate(90)'%3E%3Cpath id='\591a\89d2\5f62_1' data-name='\591a\89d2\5f62  1' d='M23,0,46,36H0Z' transform='translate(36) rotate(90)' fill='%23bf0000'/%3E%3C/g%3E%3C/svg%3E%0A");
	background-size: contain;
	width: 23px;
	height: 18px
}
.flow-list__item--1-1 .flow-list__image {
	margin: 14px 0
}
.flow-list__item--1-2 .flow-list__image {
	margin: 30px 0 8px
}
.flow-list__item--1-2 .flow-list__image figcaption {
	margin-top: 28px
}
.flow-list__item--2-1 .flow-list__image {
	margin: 14px 0
}
.flow-list__item--2-2 .flow-list__image {
	margin: 22px 0 38px
}
.flow-list__note {
	font-size: 12px
}
@media (min-width: 768px) {
	.flow-list__note {
		width: max-content;
		margin-left: auto;
		margin-right: auto;
		font-size: 14px
	}
}
.flow-list__note--1 {
	margin-left: 15px;
	margin-right: 15px
}
@media (min-width: 768px) {
	.flow-list__note--1 {
		margin-left: auto;
		margin-right: auto
	}
}
.flow-list__note--2 {
	margin-left: 10px;
	margin-right: 10px
}
@media (min-width: 768px) {
	.flow-list__note--2 {
		margin-left: auto;
		margin-right: auto
	}
}
.flow-ep {
	font-size: 30px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	text-align: center;
	line-height: 1.5;
	padding-bottom: 30px;
	margin-top: 48px
}
.flow-ep strong {
	color: #bf0000;
	color: var(--primary-color)
}
.flow-list-more {
	text-align: right;
	font-size: 12px;
	font-weight: 500;
	font-weight: var(--medium-font-weight);
	margin-top: 10px
}
@media (min-width: 768px) {
	.flow-list-more {
		font-size: 16px;
		margin-top: 20px
	}
}
.flow-list-more a {
	color: #bf0000;
	color: var(--primary-color);
	-webkit-text-decoration: underline;
	text-decoration: underline
}
.about-prologue {
	text-align: center;
	margin-bottom: 40px
}
.about-prologue__image {
	margin-bottom: 40px
}
.about-prologue__text {
	text-align: center;
	font-size: 19px;
	line-height: 1.8421;
	font-weight: 700;
	font-weight: var(--bold-font-weight)
}
@media (min-width: 768px) {
	.about-prologue__text {
		font-size: 20px
	}
}
@media (min-width: 768px) {
	.about-list {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 20px;
		gap: 20px
	}
}
.about-list__item {
	border-radius: 5px;
	background-color: #fff;
	border: 2px solid #BF0000;
	border: 2px solid var(--primary-color);
	position: relative;
	padding: 28px 20px 18px;
	text-align: center
}
.about-list__item:not(:last-child) {
	margin-bottom: 38px
}
@media (min-width: 768px) {
	.about-list__item:not(:last-child) {
		margin-bottom: 0
	}
}
@media (max-width: 767px) {
	.about-list__item--2 .about-list__image {
		margin-bottom: 12px
	}
}
@media (max-width: 767px) {
	.about-list__item--3 .about-list__image {
		margin-bottom: 2px
	}
}
.about-list__number {
	position: absolute;
	width: 36px;
	height: 36px;
	left: 0;
	right: 0;
	top: -18px;
	margin: auto;
	background-color: #bf0000;
	background-color: var(--primary-color);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	border-radius: 50%
}
@media (min-width: 768px) {
	.about-list__number {
		width: 40px;
		height: 40px;
		top: -20px
	}
}
.about-list__image {
	margin-bottom: 20px
}
@media (min-width: 768px) {
	.about-list__image {
		height: 150px;
		display: flex;
		align-items: center;
		justify-content: center
	}
}
.about-list__title {
	font-size: 19px;
	color: #bf0000;
	color: var(--primary-color);
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	line-height: 1.5;
	margin-bottom: 12px
}
.about-list__text {
	font-size: 14px
}
@media (min-width: 768px) {
	.about-list__text {
		font-size: 16px
	}
}
.faq-list__item {
	border-radius: 5px;
	background-color: #fff;
	border: 2px solid #BF0000;
	border: 2px solid var(--primary-color);
	position: relative;
	padding: 20px 20px 16px
}
.faq-list__item:not(:last-child) {
	margin-bottom: 15px
}
.faq-list__q {
	font-size: 14px;
	letter-spacing: .08em;
	line-height: 1.42857;
	margin-bottom: 6px;
	font-weight: 500;
	font-weight: var(--medium-font-weight);
	padding-left: 26px;
	position: relative
}
@media (min-width: 768px) {
	.faq-list__q {
		font-size: 18px;
		margin-bottom: 12px
	}
}
.faq-list__q:before {
	content: "Q";
	font-size: 14px;
	font-weight: 700;
	font-weight: var(--bold-font-weight);
	position: absolute;
	color: #bf0000;
	color: var(--primary-color);
	left: 0;
	top: 0
}
@media (min-width: 768px) {
	.faq-list__q:before {
		font-size: 18px
	}
}
.faq-list__a {
	padding-left: 26px;
	position: relative
}
.faq-list__a:before {
	content: "A";
	font-size: 14px;
	font-weight: 400;
	font-weight: var(--normal-font-weight);
	position: absolute;
	color: #001e9f;
	left: 0;
	top: 0
}
@media (min-width: 768px) {
	.faq-list__a:before {
		font-size: 18px
	}
}
.faq-list__text {
	font-size: 14px;
	letter-spacing: .08em;
	line-height: 1.42857;
	font-weight: 400;
	font-weight: var(--normal-font-weight)
}
@media (min-width: 768px) {
	.faq-list__text {
		font-size: 16px
	}
}
.faq-list__note {
	font-size: 10px;
	letter-spacing: .08em;
	line-height: 1.7;
	margin-top: 8px
}
@media (min-width: 768px) {
	.faq-list__note {
		font-size: 14px
	}
}
.faq-more {
	text-align: center;
	font-size: 14px;
	margin-top: 20px;
	font-weight: 500;
	font-weight: var(--medium-font-weight);
	letter-spacing: .08em
}
@media (min-width: 768px) {
	.faq-more {
		font-size: 16px;
		margin-top: 30px
	}
}
.faq-more a {
	color: #bf0000;
	color: var(--primary-color);
	-webkit-text-decoration: underline;
	text-decoration: underline
}
.spot-list {
	list-style: none;
	padding: 0 20px
}
@media (min-width: 768px) {
	.spot-list {
		display: grid;
		grid-template-columns: repeat(3, 200px);
		grid-gap: 54px;
		gap: 54px;
		justify-content: center
	}
}
.spot-list__item {
	display: grid;
	grid-template-columns: 62px 1fr;
	grid-gap: 34px;
	gap: 34px;
	align-items: center
}
@media (min-width: 768px) {
	.spot-list__item {
		grid-template-columns: 1fr;
		gap: 20px;
		text-align: center
	}
	.spot-list__item img {
		width: 162px
	}
}
.spot-list__item:not(:last-child) {
	margin-bottom: 16px
}
@media (min-width: 768px) {
	.spot-list__item:not(:last-child) {
		margin-bottom: 0
	}
}
.spot-list__text {
	font-size: 20px;
	line-height: 1.25;
	white-space: nowrap
}
@media (min-width: 768px) {
	.spot-list__text {
		text-align: center;
		font-size: 18px;
		line-height: 1.33333
	}
}
@media (min-width: 768px) {
	.only-mobile {
		display: none
	}
}
@media (min-width: 768px) {
	.only-tablet-below {
		display: none
	}
}
@media (max-width: 767px) {
	.only-desktop-above {
		display: none
	}
}
@media (max-width: 767px) {
	.only-pc {
		display: none
	}
}
.text-center {
	text-align: center!important
}
@media (max-width: 767px) {
	.text-center--only-pc {
		text-align: left
	}
}
.text-left {
	text-align: left
}
@media (max-width: 767px) {
	.sp-text-left {
		text-align: left
	}
}
.text-right {
	text-align: right
}
.fz16 {
	font-size: 16px
}
.mb0 {
	margin-bottom: 0!important
}
.mb5 {
	margin-bottom: 5px
}
.mb10 {
	margin-bottom: 10px!important
}
@media (max-width: 767px) {
	.mb10 {
		margin-bottom: 5px!important
	}
}
.mb15 {
	margin-bottom: 15px!important
}
@media (max-width: 767px) {
	.mb15 {
		margin-bottom: 8px!important
	}
}
.mb20 {
	margin-bottom: 20px!important
}
.mb25 {
	margin-bottom: 25px!important
}
@media (max-width: 767px) {
	.mb25 {
		margin-bottom: 12px!important
	}
}
.mb30 {
	margin-bottom: 30px
}
.mb40 {
	margin-bottom: 40px!important
}
@media (max-width: 767px) {
	.mb40 {
		margin-bottom: 20px!important
	}
}
.mb45 {
	margin-bottom: 45px
}
.mb50 {
	margin-bottom: 50px!important
}
@media (max-width: 767px) {
	.mb50 {
		margin-bottom: 30px!important
	}
}
.mb60 {
	margin-bottom: 60px
}
.mb70 {
	margin-bottom: 70px
}
@media (max-width: 767px) {
	.mb70 {
		margin-bottom: 35px
	}
}
.mb90 {
	margin-bottom: 90px
}
@media (max-width: 767px) {
	.mb90 {
		margin-bottom: 45px
	}
}
.mt0 {
	margin-top: 0
}
@media (max-width: 767px) {
	.mt0 {
		margin-top: 0
	}
}
.mt30 {
	margin-top: 30px
}
.mt50 {
	margin-top: 50px
}
@media (max-width: 767px) {
	.mt50 {
		margin-top: 25px
	}
}
@media (max-width: 767px) {
	.sp-overflow-hidden {
		overflow: hidden
	}
}
.flex {
	display: flex;
	align-items: baseline
}
.flex--align-center {
	align-items: center
}
.fz14 {
	font-size: 14px
}
@media (max-width: 767px) {
	.sp-block {
		display: block
	}
}

@media (max-width: 767px) {
	.sp-none {
		display: none
	}
}

.slide-area {
	padding: 24px 0 42px;
	background-color: rgba(191, 0, 0, 0.05);
}
.slide-area .slide-title {
	margin-bottom: 28px;
	font-weight: 700;
	font-size: 30px;
	color: #BF0000;
	text-align: center;
}
.slide-area .slide-conts {
	margin: 0 auto 39px;
	max-width: 1546px;
	position: relative;
}

@media all and (max-width: 767px) {
	.slide-area {
		padding: 25px 0;
	}
	.slide-area .slide-title {
		margin-bottom: 18px;
		font-size: 20px;
	}
	}

.slide-button-container {
    text-align: center; /* Center the button within its container */
    margin-top: 20px; /* Add some space above the button */
    margin-bottom: 20px; /* Add some space below the button */
}

.button-slide {
    display: inline-flex; /* Use flexbox to center content vertically */
    align-items: center;
    justify-content: center;
    width: 90%; /* Make button span most of the width */
    max-width: 500px; /* Limit button width on larger mobile screens */
    height: 60px; /* Set a fixed height for the button */
    background-color: var(--primary-color); /* Use your primary red color */
    color: var(--font-white-color); /* White text color */
    font-size: 18px; /* Adjust font size as needed */
    font-weight: var(--bold-font-weight); /* Bold text */
    text-decoration: none; /* Remove underline */
    border-radius: 8px; /* Slightly rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */
    transition: background-color 0.3s ease; /* Smooth transition on hover/tap */
}

.button-slide:hover {
    opacity: 0.9; /* Slightly dim on hover/tap */
}

@media all and (min-width: 768px) {
    .button-slide {
       max-width: 660px;       /* wider on PC */
        height: 70px;       /* taller on PC */
        font-size: 20px;    /* slightly larger text */
    }
}