/* ---------------------------------------------------
  RESET: 基本初期化
--------------------------------------------------- */
:where(*),
:where(*::before),
:where(*::after) {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	list-style: none;
}

:where(table) {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: inherit;
}

:where(caption, th) {
	text-align: left;
	font-size: inherit;
}

:where(address, b, caption, cite, code, dfn, em, i, strong, th, var) {
	font-style: normal;
	font-weight: normal;
}

:where(h1, h2, h3, h4, h5, h6) {
	font-size: inherit;
	font-weight: inherit;
}

:where(img, fieldset, area) {
	border: 0;
}

:where(img) {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

:where(picture) {
	display: block;
}

:where(svg) {
	display: block;
}

/* ---------------------------------------------------
:root カスタムプロパティ
--------------------------------------------------- */
:root {
	--design-width: 1366;
	--sp-design-width: 375;
	--base-font-size: 10;

	--gothic: "M PLUS 1", "Yu Gothic", "YuGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
	--noto-sans: "Noto Sans JP", "Yu Gothic", "YuGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;

	--blk: 0, 0, 0;
	--wht: 255, 255, 255;
	--slider-dot: 45, 41, 38;
	--heading-blue: 3, 63, 133;
	--food-blue: 0, 129, 204;
	--drink-chase: 29, 52, 157;
	--drink-marshall: 229, 29, 42;
	--drink-rubble: 255, 181, 0;
	--drink-skye: 236, 22, 134;
	--collaboration-title: 253, 214, 0;
	--collaboration-bg: 0, 74, 154;
	--collaboration-outline: 0, 66, 92;
	--restaurant-bg: 255, 93, 93;
	--stay-bg: 217, 184, 0;
	--stay-accent: 255, 184, 0;
	--stay-panel: 255, 248, 208;
	--about-bg: 17, 173, 242;
	--spgr-bg: 244, 244, 238;
	--brand-gold: 155, 135, 58;
	--spgr-text: 85, 85, 85;

	--pageTop-right: 1rem;
	--pageTop-bottom: 1rem;
}

/* ---------------------------------------------------
HTML / BODY 基本
--------------------------------------------------- */
html {
	font-size: min(calc(var(--base-font-size) * 1px), calc(var(--base-font-size) * 100vw / var(--design-width)));
	scroll-behavior: smooth;
}

@media screen and (max-width: 768px) {
	html {
		font-size: calc(var(--base-font-size) * 100vw / var(--sp-design-width));
	}
}

body {
	background: rgb(var(--wht));
	line-height: normal;
	color: rgb(var(--blk));
	font-family: var(--gothic);
	font-feature-settings: "palt"1;
	letter-spacing: 0.05em;
	font-weight: 400;
}

:where(input, select, textarea, button, label) {
	background: none;
	color: inherit;
	font: inherit;
	border: none;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

:where(button, [type="button"], [type="submit"], [type="reset"], label[for]) {
	cursor: pointer;
}


:where(svg, video, iframe) {
	max-width: 100%;
}


:where(a) {
	color: inherit;
	text-decoration: underline;
	transition: all 0.5s ease 0s;
}

:where(a:hover) {
	text-decoration: none;
	opacity: 0.6;
}

/* ---------------------------------------------------
  表示切り替え（PC / SP）
--------------------------------------------------- */
.pc {
	display: block;
}

.sp {
	display: none;
}

@media screen and (max-width: 768px) {
	.pc {
		display: none;
	}

	.sp {
		display: block;
	}
}

/* ---------------------------------------------------
  汎用リスト
--------------------------------------------------- */
ul.list li {
	margin-left: 1em;
	text-indent: -1em;
}


/* 注記リスト（改良版） */
ul.note li {
	font-size: 1.6rem;
}

ul.note li::before {
	content: "※";
}


@media screen and (max-width: 768px) {
	ul.note li {
		font-size: 0.9rem;
	}
}

/* ---------------------------------------------------
  電話リンク
--------------------------------------------------- */
.telephone {
	text-decoration: none;
	pointer-events: none;
}

@media screen and (max-width: 768px) {
	.telephone {
		pointer-events: all;
	}
}

/* ---------------------------------------------------
  ボタンリンク
--------------------------------------------------- */
.link-button {
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.8rem;
	position: relative;
}


/* ---------------------------------------------------
  ページトップ
--------------------------------------------------- */
.pageTop a {
	background: rgba(var(--brand-gold), 0.9);
	width: 6.4rem;
	height: 6.4rem;
	border-radius: 0.8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	right: var(--pageTop-right);
	bottom: var(--pageTop-bottom);
	z-index: 10;
}

.pageTop a svg {
	fill: rgb(var(--wht));
	width: 1.6rem;
	height: auto;
}

/* ---------------------------------------------------
  object
--------------------------------------------------- */
.object {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	z-index: 2;
}

/* ---------------------------------------------------
  slick
--------------------------------------------------- */
.slick-dotted.slick-slider {
	margin-bottom: 0;
}

.slick-list {
	line-height: 0;
}

.slick-slide {
	line-height: 1.8;
}

.slick-dots {
	display: flex;
	bottom: 0;
}

.slick-dots li {
	margin: 0;
	width: auto;
	height: auto;
}

.slick-dots li:not(:last-of-type) {
	margin-right: 0.8rem;
}

.slick-dots li button {
	background-color: rgb(var(--wht));
	padding: 0;
	width: 1rem;
	height: 1rem;
	border: solid 1px rgb(var(--wht));
	border-radius: 1rem;
}

.slick-dots li button::before {
	display: none;
}

.slick-dots li.slick-active button {
	background-color: rgb(var(--blk));
}


/* ---------------------------------------------------
	フェード表示
--------------------------------------------------- */
.fadeBlock {
	opacity: 0;
	transition: opacity 1.5s, transform 1.5s;
}

.fadeBlock.is-visible {
	opacity: 1;
}

.fadeLeft {
	transform: translateX(-5rem);
}

.fadeRight {
	transform: translateX(5rem);
}

.fadeLeft.is-visible,
.fadeRight.is-visible {
	transform: translateX(0);
}

.fadeBottom {
	transform: translateY(5rem);
}

.fadeBottom.is-visible {
	transform: translateY(0);
}

/* ----------------------------------------------------
	main
---------------------------------------------------- */
.main {
	isolation: isolate;
	position: relative;
}

.main::before {
	background-image: url(../img/bg-dots-vector.svg);
	background-position: center top;
	background-repeat: repeat-y;
	background-size: 100% auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	content: "";
	pointer-events: none;
}

@media screen and (max-width: 768px) {
	.main {
		overflow-x: clip;
	}

	.main::before {
		background-image: url(../img/bg-dots_sp-vector.svg);
	}
}

/* ----------------------------------------------------
	content
---------------------------------------------------- */
.content {
	padding: 9rem 0;
	position: relative;
}

.content__inner {
	margin: 0 auto;
	width: 103rem;
	position: relative;
	z-index: 2;
}

.content__title {
	margin-bottom: 4rem;
	color: rgb(var(--wht));
	font-size: 5.6rem;
	font-weight: 800;
	text-align: center;
}

.content__title--jp {
	font-size: 3.4rem;
	display: block;
}

.content__body {
	background-color: rgb(var(--wht));
	margin-bottom: 4rem;
	padding: 5rem;
	border-radius: 3.2rem;
	position: relative;
}

.content__body .link-button {
	background-color: rgb(var(--heading-blue));
	background-image: url(../img/arrow-link01.svg);
	background-position: right 2.5rem center;
	background-repeat: no-repeat;
	background-size: 3rem auto;
	margin: 0 auto 3rem;
	width: 53rem;
	height: 8rem;
	color: rgb(var(--wht));
	font-size: 2.4rem;
	font-weight: 700;
}

.content .list.note li {
	line-height: 1.6;
	font-family: var(--noto-sans);
}

.content__note {
	color: rgb(var(--wht));
}

@media screen and (max-width: 768px) {
	.content {
		padding: 5rem 0;
	}

	.content__inner {
		width: 100%;
	}

	.content__title {
		font-size: 3.4rem;
	}

	.content__title--jp {
		font-size: 1.8rem;
	}

	.content__body {
		margin: 0 auto 2rem;
		padding: 2rem 1rem;
		width: 35rem;
		border-radius: 1rem;
	}

	.content__body .link-button {
		background-position: right 1.8rem center;
		background-size: 1.6rem auto;
		margin-bottom: 2rem;
		width: 100%;
		height: 5rem;
		font-size: 1.8rem;
	}

	.content__note {
		margin: 0 auto;
		width: 35rem;
	}
}

/* 
	content__image
---------------------------------------------------- */
.restaurant__item+.restaurant__item {
	margin-top: 10rem;
}

.content__image--item .detail {
	margin-top: 6rem;
}

.content__image .slick-dots {
	justify-content: center;
	position: absolute;
	top: 54.3rem;
	bottom: auto;
	left: 0;
	z-index: 3;
}

.content__image .slick-dots li button {
	background-color: rgb(var(--wht));
	width: 1rem;
	height: 1rem;
	border: solid 1px rgb(var(--slider-dot));
	border-radius: 50%;
}

.content__image .slick-dots li.slick-active button {
	background-color: rgb(var(--slider-dot));
}

@media screen and (max-width: 768px) {
	.restaurant__item+.restaurant__item {
		margin-top: 5rem;
	}

	.content__image--item .detail {
		margin-top: 3rem;
	}

	.content__image .slick-dots {
		top: 19.5rem;
	}

	.content__image .slick-dots li button {
		width: 0.8rem;
		height: 0.8rem;
	}
}

/* ----------------------------------------------------
	collaboration
---------------------------------------------------- */
.collaboration {
	background-color: rgb(var(--collaboration-bg));
	color: rgb(var(--wht));
	font-weight: 500;
	text-align: center;
	overflow-x: clip;
}

.collaboration .content__inner {
	width: 136.6rem;
	position: relative;
}

.collaboration__title {
	margin-bottom: 3.5rem;
	color: rgb(var(--collaboration-title));
	font-size: 5.8rem;
	font-weight: 800;
	font-style: normal;
	text-shadow:
		0.8rem 0 0 rgb(var(--collaboration-outline)),
		0.7846rem 0.1561rem 0 rgb(var(--collaboration-outline)),
		0.7391rem 0.3061rem 0 rgb(var(--collaboration-outline)),
		0.6652rem 0.4445rem 0 rgb(var(--collaboration-outline)),
		0.5657rem 0.5657rem 0 rgb(var(--collaboration-outline)),
		0.4445rem 0.6652rem 0 rgb(var(--collaboration-outline)),
		0.3061rem 0.7391rem 0 rgb(var(--collaboration-outline)),
		0.1561rem 0.7846rem 0 rgb(var(--collaboration-outline)),
		0 0.8rem 0 rgb(var(--collaboration-outline)),
		-0.1561rem 0.7846rem 0 rgb(var(--collaboration-outline)),
		-0.3061rem 0.7391rem 0 rgb(var(--collaboration-outline)),
		-0.4445rem 0.6652rem 0 rgb(var(--collaboration-outline)),
		-0.5657rem 0.5657rem 0 rgb(var(--collaboration-outline)),
		-0.6652rem 0.4445rem 0 rgb(var(--collaboration-outline)),
		-0.7391rem 0.3061rem 0 rgb(var(--collaboration-outline)),
		-0.7846rem 0.1561rem 0 rgb(var(--collaboration-outline)),
		-0.8rem 0 0 rgb(var(--collaboration-outline)),
		-0.7846rem -0.1561rem 0 rgb(var(--collaboration-outline)),
		-0.7391rem -0.3061rem 0 rgb(var(--collaboration-outline)),
		-0.6652rem -0.4445rem 0 rgb(var(--collaboration-outline)),
		-0.5657rem -0.5657rem 0 rgb(var(--collaboration-outline)),
		-0.4445rem -0.6652rem 0 rgb(var(--collaboration-outline)),
		-0.3061rem -0.7391rem 0 rgb(var(--collaboration-outline)),
		-0.1561rem -0.7846rem 0 rgb(var(--collaboration-outline)),
		0 -0.8rem 0 rgb(var(--collaboration-outline)),
		0.1561rem -0.7846rem 0 rgb(var(--collaboration-outline)),
		0.3061rem -0.7391rem 0 rgb(var(--collaboration-outline)),
		0.4445rem -0.6652rem 0 rgb(var(--collaboration-outline)),
		0.5657rem -0.5657rem 0 rgb(var(--collaboration-outline)),
		0.6652rem -0.4445rem 0 rgb(var(--collaboration-outline)),
		0.7391rem -0.3061rem 0 rgb(var(--collaboration-outline)),
		0.7846rem -0.1561rem 0 rgb(var(--collaboration-outline));
}

.collaboration__period {
	font-size: 3.6rem;
}

.collaboration .note {
	margin-bottom: 3.5rem;
	line-height: 2.5;
}

.collaboration .note li {
	font-size: 1.8rem;
}

.collaboration__intro {
	line-height: 2;
	font-size: 2.4rem;
}

.collaboration .obj01 {
	background-image: url(../img/obj-collaboration01.webp);
	width: 21.6rem;
	height: 54.3rem;
	top: -6rem;
	left: 1.7rem;
}

.collaboration .obj02 {
	background-image: url(../img/obj-collaboration02.webp);
	width: 19.6rem;
	height: 33.5rem;
	top: 7rem;
	right: 5rem;
}

@media screen and (max-width: 768px) {
	.collaboration__title {
		margin-bottom: 24rem;
		font-size: 3.4rem;
	}

	.collaboration .content__inner {
		width: 100%;
	}

	.collaboration__period {
		font-size: 1.8rem;
	}

	.collaboration .note {
		margin-bottom: 2rem;
		line-height: 1.3;
	}

	.collaboration .note li {
		font-size: 1.2rem;
	}

	.collaboration__intro {
		line-height: 2.3;
		font-size: 1.3rem;
	}

	.collaboration .obj01 {
		width: 8.8rem;
		height: 21.7rem;
		top: 11.8rem;
		left: 8.4rem;
	}

	.collaboration .obj02 {
		width: 7.8rem;
		height: 13.4rem;
		top: 16rem;
		right: 7.8rem;
	}
}

/* ----------------------------------------------------
	restaurant
---------------------------------------------------- */
.restaurant {
	background-color: rgb(var(--restaurant-bg));
	padding-top: 12rem;
}

.restaurant .detail {
	font-family: var(--noto-sans);
	text-align: center;
}

.restaurant__benefit {
	margin-bottom: 1.5rem;
	font-size: 2.2rem;
	font-weight: 500;
}

.restaurant__name {
	margin-bottom: 1.5rem;
	line-height: 1.5;
	color: rgb(var(--food-blue));
	font-size: 2.6rem;
	font-weight: 700;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1rem;
}

.restaurant__name::before {
	background: url(../img/icon-dog.svg) center / contain no-repeat;
	width: 4.6rem;
	height: 4.3rem;
	flex-shrink: 0;
	content: "";
}

.restaurant__price {
	margin-bottom: 2rem;
	font-size: 1.8rem;
	font-weight: 500;
}

.restaurant__name--drink::before {
	background-color: currentColor;
	background-image: none;
	-webkit-mask: url(../img/icon-dog.svg) center / contain no-repeat;
	mask: url(../img/icon-dog.svg) center / contain no-repeat;
}

.restaurant__name--chase {
	color: rgb(var(--drink-chase));
}

.restaurant__name--marshall {
	color: rgb(var(--drink-marshall));
}

.restaurant__name--rubble {
	color: rgb(var(--drink-rubble));
}

.restaurant__name--skye {
	color: rgb(var(--drink-skye));
}

.restaurant__description {
	line-height: 2.5;
	font-size: 1.8rem;
	font-weight: 500;
}

.restaurant__title {
	margin-bottom: 2rem;
	color: rgb(var(--heading-blue));
	font-size: 4.6rem;
	font-weight: 800;
	text-align: center;
}

.restaurant__lead {
	margin-bottom: 2rem;
	color: rgb(var(--heading-blue));
	line-height: 1.8;
	font-size: 2rem;
	font-weight: 600;
	text-align: center;
}

.restaurant .restaurant__item:last-of-type {
	margin-bottom: 3rem;
	padding-bottom: 3rem;
	border-bottom: solid 0.5rem rgb(var(--heading-blue));
}

.restaurant__info {
	margin-bottom: 2rem;
	line-height: 2;
	font-size: 2.2rem;
	font-weight: 500;
}

.restaurant__info--item {
	display: flex;
	justify-content: center;
}

.restaurant__info--label {
	flex-shrink: 0;
}

.restaurant__rates {
	margin-bottom: 3rem;
	line-height: 2;
	font-size: 2.2rem;
	font-weight: 500;
	text-align: center;
}

.restaurant__rates--item+.restaurant__rates--item {
	margin-top: 1rem;
}

.restaurant__rates--label {
	font-weight: 700;
}

.restaurant__rates--label span {
	background-color: rgb(var(--heading-blue));
	padding: 1rem 2rem;
	line-height: 1;
	color: rgb(var(--wht));
	display: inline-block;
}

.restaurant__rates--text span {
	display: inline-block;
}

.restaurant__reservation {
	margin-bottom: 1rem;
	line-height: 1.5;
	color: rgb(var(--heading-blue));
	font-size: 2.2rem;
	font-weight: 700;
	text-align: center;
}

.restaurant .obj01 {
	background-image: url(../img/obj-restaurant01.webp);
	width: 26.7rem;
	height: 34.4rem;
	top: -10rem;
	left: -6.2rem;
}

.restaurant .obj02 {
	background-image: url(../img/obj-restaurant02.webp);
	width: 26.1rem;
	height: 21rem;
	top: -4rem;
	right: -9.2rem;
}

.restaurant .obj03 {
	display: none;
}

@media screen and (max-width: 768px) {
	.restaurant {
		padding-top: 5rem;
	}

	.restaurant .content__title {
		margin-bottom: 16.4rem;
	}

	.restaurant__benefit,
	.restaurant__price {
		margin-bottom: 1rem;
		font-size: 1.3rem;
	}

	.restaurant__name {
		margin-right: auto;
		margin-bottom: 1.2rem;
		margin-left: auto;
		width: fit-content;
		max-width: 100%;
		font-size: 1.8rem;
		text-align: center;
		flex-direction: column;
		gap: 0.5rem;
	}

	.restaurant__name::before {
		width: 2.8rem;
		height: 2.4rem;
	}

	.restaurant__description {
		font-size: 1rem;
	}

	.restaurant__title {
		margin-bottom: 1rem;
		font-size: 2.6rem;
	}

	.restaurant__lead {
		margin-bottom: 1rem;
		line-height: 2;
		font-size: 1.3rem;
	}

	.restaurant__info {
		margin-bottom: 1rem;
		font-size: 1.3rem;
		text-align: center;
	}

	.restaurant__rates {
		margin-bottom: 1rem;
		font-size: 1.3rem;
	}

	.restaurant__rates--label span {
		padding: 0.5rem 1rem;
	}

	.restaurant__reservation {
		font-size: 1.6rem;
	}

	.restaurant .content__note {
		padding-right: 7rem;
		letter-spacing: -0.005em;
	}

	.restaurant__info--item {
		display: block;
	}

	.restaurant .obj01 {
		width: 10.7rem;
		height: 13.8rem;
		top: 8.5rem;
		left: 6.3rem;
	}

	.restaurant .obj02 {
		width: 10.5rem;
		height: 8.4rem;
		top: 12.5rem;
		right: 6.6rem;
	}

	.restaurant .obj03 {
		background-image: url(../img/obj-restaurant03.webp);
		width: 7.3rem;
		height: 8.7rem;
		display: block;
		right: 1rem;
		bottom: 0;
	}
}

/* ----------------------------------------------------
	stay
---------------------------------------------------- */
.stay {
	background-color: rgb(var(--stay-bg));
	padding-top: 10rem;
}

.stay .content__body {
	font-family: var(--noto-sans);
}

.stay .content__image {
	margin-bottom: 3rem;
}

.stay .detail {
	text-align: center;
}

.stay__name {
	color: rgb(var(--stay-accent));
	font-size: 3rem;
	font-weight: 600;
}

.stay__unit {
	font-size: 2rem;
}

.stay__lead {
	font-size: 2.2rem;
	font-weight: 500;
}

.stay__heading {
	margin-bottom: 2.4rem;
	line-height: 1.8;
	color: rgb(var(--stay-accent));
	font-size: 2.6rem;
	font-weight: 700;
	text-align: center;
	display: flex;
	align-items: center;
	gap: 2rem;
}

.stay__heading::before,
.stay__heading::after {
	border-top: solid 1px rgb(var(--stay-accent));
	flex: 1;
	content: "";
}

.stay__benefits {
	background-color: rgb(var(--stay-panel));
	margin-bottom: 2rem;
	padding: 2rem;
	border-radius: 0.8rem;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.6rem;
}

.stay__benefit {
	width: 21rem;
	text-align: center;
}

.stay__benefit-title {
	font-size: 1.6rem;
	font-weight: 600;
}

.stay__benefit-note {
	display: inline-block;
}

.stay__paw {
	background-color: rgb(var(--slider-dot));
	margin: 2rem 0 1rem;
	width: 3.2rem;
	height: 3rem;
	display: inline-block;
	-webkit-mask: url(../img/icon-dog.svg) center / contain no-repeat;
	mask: url(../img/icon-dog.svg) center / contain no-repeat;
}

.stay__conditions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 3rem;
}

.stay__condition {
	background-color: rgb(var(--stay-panel));
	margin-bottom: 3rem;
	padding: 3rem 2rem;
	border-radius: 1rem;
}

.stay__condition-title {
	line-height: 2.3;
	font-size: 2rem;
	font-weight: 600;
	text-align: center;
}

.stay__list>li {
	padding-left: 2rem;
	line-height: 1.8;
	font-size: 1.8rem;
	font-weight: 500;
	position: relative;
}

.stay__list>li::before {
	background-color: rgb(var(--stay-accent));
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 50%;
	position: absolute;
	top: 0.6em;
	left: 0;
	content: "";
}

.stay__condition-label {
	font-weight: 500;
}

.stay__condition-text {
	line-height: 1.6;
	font-size: 1.3rem;
	display: block;
}

.stay__condition-text--inline {
	display: inline;
}

.stay__condition-heading {
	font-weight: 700;
}

.stay__prices {
	margin-bottom: 3rem;
	font-size: 1.8rem;
	font-weight: 500;
	text-align: center;
}

.stay .link-button {
	margin-bottom: 0;
}

.stay .obj01 {
	background-image: url(../img/obj-stay01.webp);
	width: 25.2rem;
	height: 19.3rem;
	top: -22.3rem;
	left: 0;
}

.stay .obj02 {
	background-image: url(../img/obj-stay02.webp);
	width: 32.5rem;
	height: 22.8rem;
	top: -16rem;
	right: -7.9rem;
}

.stay .obj03 {
	background-image: url(../img/obj-stay03.webp);
	width: 27.2rem;
	height: 19.1rem;
	bottom: -2.1rem;
	left: -10rem;
}

@media screen and (max-width: 768px) {
	.stay {
		padding-top: 5rem;
	}

	.stay .content__title {
		margin-bottom: 13.2rem;
	}

	.stay .content__image {
		margin-bottom: 2rem;
	}

	.stay__name {
		margin-bottom: 1rem;
		line-height: normal;
		font-size: 1.8rem;
	}

	.stay__unit {
		font-size: 1.2rem;
	}

	.stay__lead {
		font-size: 1rem;
	}

	.stay__heading {
		font-size: 1.8rem;
		gap: 1rem;
	}

	.stay__benefits {
		padding: 1.5rem;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 3rem 1rem;
	}

	.stay__benefit {
		width: 14.4rem;
	}

	.stay__benefit-title {
		font-size: 1.4rem;
	}

	.stay__benefit-note.note li {
		font-size: 1rem;
	}

	.stay__conditions {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

	.stay__condition {
		padding: 2rem 1rem;
	}

	.stay__list>li {
		font-size: 1.4rem;
	}

	.stay__condition-text {
		font-size: 1rem;
	}

	.stay__prices {
		margin-bottom: 2rem;
		font-size: 1.3rem;
	}

	.stay .obj01 {
		width: 10.1rem;
		height: 7.7rem;
		top: -10.5rem;
		left: 6.2rem;
	}

	.stay .obj02 {
		width: 13rem;
		height: 9.1rem;
		top: -11.2rem;
		right: 4.5rem;
	}

	.stay .obj03 {
		width: 10.9rem;
		height: 7.6rem;
		bottom: -16.5rem;
		right: 0;
		left: auto;
	}

	.stay .obj03:not(.is-visible) {
		transform: translateX(5rem);
	}
}

/* ----------------------------------------------------
	about
---------------------------------------------------- */
.about {
	background-color: rgb(var(--about-bg));
	padding-bottom: 0;
}

.about .content__inner {
	padding-bottom: 31rem;
}

.about__content {
	background-color: rgb(var(--wht));
	margin-bottom: 4rem;
	padding: 5rem 0;
	text-align: center;
	border-radius: 3.2rem;
}

.about__title {
	margin-bottom: 4rem;
	color: rgb(var(--heading-blue));
	font-size: 4.4rem;
	font-weight: 800;
}

.about__lead {
	line-height: 1.8;
	font-size: 2rem;
	font-weight: 500;
}

.about__link {
	margin: 0 auto 5rem;
	width: 78rem;
	display: block;
}

.about__copyright {
	margin-bottom: 4rem;
	color: rgb(var(--wht));
	line-height: 1.8;
	font-family: var(--noto-sans);
	font-size: 1.6rem;
}

.about__logo {
	display: flex;
	align-items: center;
}

.about__logo--item.logo01 {
	margin-right: 3rem;
	width: 13.2rem;
}

.about__logo--item.logo02 {
	width: 11.1rem;
}

.about .obj01 {
	background-image: url(../img/obj-about01.webp);
	width: 27rem;
	height: 13.1rem;
	top: 3rem;
	left: -15.7rem;
}

.about .obj02 {
	background-image: url(../img/obj-about02.webp);
	width: 18.8rem;
	height: 24rem;
	left: 31rem;
	bottom: 2.1rem;
}

.about .obj03 {
	background-image: url(../img/obj-about03.webp);
	width: 20rem;
	height: 24rem;
	right: 30.7rem;
	bottom: 2.1rem;
}

.about .obj04 {
	background-image: url(../img/obj-about04.webp);
	width: 28.7rem;
	height: 52.5rem;
	right: -7.4rem;
	bottom: 0;
}

@media screen and (max-width: 768px) {
	.about {
		padding-top: 10rem;
	}

	.about .content__inner {
		padding-bottom: 16rem;
	}

	.about__content {
		margin: 0 auto 2rem;
		padding: 3rem 0;
		width: 35rem;
		border-radius: 1rem;
	}

	.about__title {
		margin-bottom: 2rem;
		font-size: 2.6rem;
	}

	.about__lead {
		margin: 0 auto;
		width: 33rem;
		line-height: 2.3;
		font-size: 1.2rem;
	}

	.about__link {
		margin-bottom: 2rem;
		width: 35rem;
	}

	.about__copyright {
		margin: 0 auto 2rem;
		width: 35rem;
		font-size: 1rem;
	}

	.about__logo {
		margin: 0 auto;
		width: 35rem;
	}

	.about__logo--item.logo01 {
		width: 8rem;
	}

	.about__logo--item.logo02 {
		width: 6.8rem;
	}

	.about .obj01 {
		width: 10.8rem;
		height: 5.2rem;
		top: -8rem;
		left: calc(50% - 5.4rem);
	}

	.about .obj02 {
		width: 7.5rem;
		height: 9.6rem;
		left: 5.2rem;
		bottom: 0.9rem;
	}

	.about .obj03 {
		width: 8rem;
		height: 9.6rem;
		right: 15.4rem;
		bottom: 0.9rem;
	}

	.about .obj04 {
		width: 11.5rem;
		height: 21rem;
		right: 1.3rem;
	}
}

/* ----------------------------------------------------
	spgr
---------------------------------------------------- */
.spgr {
	background-color: rgb(var(--spgr-bg));
	padding: 5rem 2rem;
	color: rgb(var(--spgr-text));
	font-family: var(--noto-sans);
	font-weight: 500;
	text-align: center;
}

.spgr__logo {
	margin: 0 auto 3rem;
	width: 22.7rem;
}

.spgr__fee {
	line-height: 2.3;
	font-size: 1.9rem;
}

.spgr__text {
	margin-bottom: 3rem;
	font-size: 2.5rem;
}

.spgr .link-button {
	background-color: rgb(var(--brand-gold));
	background-image: url(../img/arrow-link02.svg);
	background-position: right 1.5rem center;
	background-repeat: no-repeat;
	background-size: 2.9rem auto;
	margin: 0 auto;
	width: 29.4rem;
	height: 5.8rem;
	color: rgb(var(--wht));
	font-size: 1.7rem;
	border-radius: 5.8rem;
}

@media screen and (max-width: 768px) {
	.spgr {
		padding: 5rem 1.5rem;
	}

	.spgr__logo {
		width: 20.4rem;
	}

	.spgr__fee {
		line-height: normal;
		font-size: 1.5rem;
	}

	.spgr__text {
		font-size: 1.7rem;
	}

	.spgr .link-button {
		background-position: right 2rem center;
		background-size: 1.8rem auto;
		width: 100%;
		font-size: 1.6rem;
	}
}

/* ----------------------------------------------------
	hotel
---------------------------------------------------- */
.hotel {
	padding-top: 5rem;
	font-family: var(--noto-sans);
	text-align: center;
}

.hotel__logo {
	margin: 0 auto 4rem;
	width: 19.8rem;
}

.hotel__name {
	margin-bottom: 1rem;
	font-size: 2rem;
}

.hotel__address {
	font-size: 1.4rem;
}

.hotel__tel {
	margin-bottom: 4rem;
	line-height: 1.8;
	font-size: 1.6rem;
	font-weight: 500;
}

.hotel__sns {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5rem;
}

.hotel__sns-item {
	width: 3rem;
}

@media screen and (max-width: 768px) {
	.hotel {
		padding-top: 4rem;
	}

	.hotel__logo {
		margin-bottom: 2rem;
	}

	.hotel__tel {
		margin-bottom: 2rem;
	}

	.hotel__sns-item {
		width: 2.6rem;
	}
}

/* ----------------------------------------------------
	footer
---------------------------------------------------- */
.footer {
	padding: 7rem 0 3rem;
	font-family: var(--noto-sans);
}

@media screen and (max-width: 768px) {
	.footer {
		padding: 5rem 0 2rem;
	}
}

/* 
	hotel-nav 
------------------------------ */
.footer .hotel-nav {
	line-height: 1;
	font-size: 1.6rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

.footer .hotel-nav::before,
.footer .hotel-nav__item::after {
	content: "|";
}

.footer .hotel-nav__item a {
	padding: 0 1em;
	text-decoration: none;
}

@media screen and (max-width: 768px) {
	.footer .hotel-nav {
		font-size: 1.3rem;
		text-align: center;
		display: block;
	}

	.footer .hotel-nav::before,
	.footer .hotel-nav__item::after {
		content: "";
	}

	.footer .hotel-nav__item:not(:last-of-type) {
		margin-bottom: 1em;
	}
}

/* 
	copy
------------------------------ */
.footer .copy {
	margin-top: 2em;
	line-height: normal;
	font-size: 1.3rem;
	text-align: center;
}

@media screen and (max-width: 768px) {
	.footer .copy {
		font-size: 1rem;
		letter-spacing: -0.005em;
	}
}