@charset "UTF-8";
/* ----------------------------------------------------------------------------------------------------
*  main layout
* --------------------------------------------------------------------------------------------------*/
:root {
	--color-white: #FFFFFF;
	--color-base-blue: #0040A0;
	--color-bg-beige01: #FFFDE6;
	--color-bg-beige02: #FFF4DE;
	--color-bg-green: #9AD51A;
	--color-bg-blue: #1989DD;
	--color-mv-yellow: #FFDB60;
	--color-mv-red: #F53323;
	--color-button-red: #D80115;
	--color-button-purple: #7F38B2;
	--color-line-red: #EE0015;
	--color-line-blue: #1A89DD;
	--color-line-brown: #ED8800;
	--color-line-navy: #013380;
	--color-line-yellow: #FFC600;
	--color-line-purple: #82009C;
	--color-line-green01: #99D51A;
	--color-line-green02: #009B35;
	--color-text-accent01: #FF4E86;
	--color-text-accent02: #EA0016;
	--color-text-base01: #0D4EB8;
	--color-text-base02: #784329;
	--color-text-dah: #003380;
	--color-text-tdh: #EA8600;
	--color-shadow01: #E8E8E8;
}

.display-pc{
	display: block;
}
.display-sp{
	display: none !important;
}

/*--- font ---*/
.fs-lg {
	font-size: 18px !important;}
.fs-l {
	font-size: 16px !important;}
.fs-m {
	font-size: 14px !important;}
.fs-s {
	font-size: 12px !important;}
.fs-big {
	font-size: 130%;
    vertical-align: text-bottom; }
.fs-small {
	font-size: 80%;
    vertical-align: baseline; }
.fw-normal {
	font-weight: normal !important;}
.fw-bold {
	font-weight: 800 !important;}
.note {
	font-size: 80%;}

/*--- layout ---*/
ul[class] {
	list-style: none;}
ul.note-list {
	clear:both;}
ul.note-list li {
	font-size: 13px;
	letter-spacing: 0.05em;
	list-style: none;
	text-indent: -1em;
	padding-left: 1em;
	margin: 0;
	text-align: left;
}
ul.note-list li a {
	color: inherit;
	text-decoration: underline;}
ul.note-list li a:hover {text-decoration:none;}
.ta-left {
	text-align: left !important;}
.ta-center {
	text-align: center !important;}
.ta-right {
	text-align: right !important;}
button {
	margin: 0;
	padding: 0;
	border: none;
	cursor: pointer;}
.art {
	pointer-events: none;
}

body{}
.content-main,
.content-footer,
.modal-wrap {
	font-family: "M PLUS 1", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	overflow: hidden;
}
.contentIn {
	background: var(--color-white);
}
.contentIn,
.modal-wrap {
	color: var(--color-text-base01);
	font-size: 16px;
}
.contentIn *,
.modal-wrap * {
	box-sizing: border-box;
}
.contentIn strong {
	font-weight: 800;
}
.contentIn img,
.modal-wrap img {
	max-width: 100%;
	height: auto;
}

/* mainContent */
#mainContents A:link ,
#mainContents A:visited,
#mainContents A:active {text-decoration:underline;}
#mainContents A:hover {text-decoration:none; }

.wrap{
/*	min-width: 1000px;*/
	min-width: 1180px;
}

/* ----------------------------------------------------------------------------------------------------
*  scrollAnime
* --------------------------------------------------------------------------------------------------*/
.scrollTrigger.-fadeUp {
	transform: translate(0, 25%);
	opacity: 0;
}
.scrollTrigger.-fadeUp.is-active {
	animation: fadeUp 1.5s cubic-bezier(.23,1,.32,1) both;
}
.scrollTrigger.-scaleUp.is-active {
	animation: scaleUp 0.5s cubic-bezier(0.12, 0, 0.39, 0) both;
}
.scrollTrigger.-moveUp {
	transform: translate(0, 50%);
}
.scrollTrigger.-moveUp.is-active {
	animation: moveUp 0.5s cubic-bezier(.23,1,.32,1) 0.1s both;
}
.scrollTrigger.-moveBumpy.is-active {
	animation: moveBumpy 0.5s cubic-bezier(.23,1,.32,1) both;
}
.scrollTrigger.-slideMoveBumpy.is-active {
	animation: slideMoveBumpy 0.5s cubic-bezier(.23,1,.32,1) both;
}
.scrollTrigger.-clipImage {
	clip-path: inset(0 100% 0 0);
}
.scrollTrigger.-clipImage.is-active {
	animation: clipImage .5s ease-in .2s forwards;
}
.scrollTrigger.-fadeIn {
	opacity: 0;
}
.scrollTrigger.-fadeIn.is-active {
	animation: fadeIn 1.5s cubic-bezier(.23,1,.32,1) .2s forwards;
}

@keyframes fadeUp {
	0% {transform: translate(0, 50%); opacity: 0;}
	100% {transform: translate(0, 0); opacity: 1;}
}
@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes fadeScale {
	0% {transform: scale(0.5); opacity: 0;}
	100% {transform: scale(1); opacity: 1;}
}
@keyframes scaleUp {
	0% {transform: scale(0.5);}
	100% {transform: scale(1);}
}
@keyframes moveUp {
	0% {transform: translate(0, 25%);}
	100% {transform: translate(0, 0);}
}
@keyframes moveBumpy {
	0% {transform: rotate(0deg);}
	25% {transform: rotate(-3deg);}
	50% {transform: rotate(3deg);}
	75% {transform: rotate(-3deg);}
	100% {transform: rotate(0deg);}
}
@keyframes moveDown {
	0% {transform: translate(0, -100vh);}
	60% {transform: translate(0, 0);}
	80% {transform: translate(0,-5%);}
	100% {transform: translate(0, 0);}
}
@keyframes slideMoveBumpy {
	0% {transform: translate(-80%, 0) rotate(0deg);}
	20% {transform: translate(-70%, 0) rotate(-3deg);}
	40% {transform: translate(-50%, 0) rotate(3deg);}
	60% {transform: translate(-30%, 0) rotate(-3deg);}
	80% {transform: translate(-10%, 0) rotate(3deg);}
	100% {transform: translate(0, 0) rotate(0deg);}
}
@keyframes clipImage {
	0%{ clip-path: inset(0 100% 0 0); }
	100%{ clip-path: inset(0 0 0 0); }
}

/* ----------------------------------------------------------------------------------------------------
*  content-header
* --------------------------------------------------------------------------------------------------*/
.content-header {
	background: var(--color-mv-yellow);
	overflow: hidden;
	.scroll-slide {
		padding: 15px 0;
		position: relative;
		z-index: 10;
		display: flex;
		width: max-content;
		&.-header-slide01 {
			box-shadow: 0 8px 0 #DEB732;
			background: var(--color-mv-red);
			animation: scrollLoopTop 67.5s linear infinite;
		}
		&.-header-slide02 {
			background: var(--color-text-base01);
			animation: scrollLoopBottom 67.5s linear infinite;
		}
	}
	.scroll-slide-item {
		margin-right: 15px;
		overflow: hidden;
		width: 300px;
		height: 185px;
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
	}
	.content-header-inner {
		margin: auto;
		padding: 18px 0 20px 95px;
		position: relative;
		display: flex;
		align-items: flex-start;
		img {
			max-width: 100%;
			height: auto;
		}
		.hd-img {
			margin-right: -14px;
			background: #DEB732;
			position: relative;
			z-index: 3;
			width: 514px;
			animation: fadeIn 1.5s cubic-bezier(.23,1,.32,1)  forwards;
			img {
				clip-path: inset(0 100% 0 0);
				animation: clipImage .5s ease-in .2s forwards;
			}
		}
		.hd-copy {
			margin-top: 112px;
			position: relative;
			z-index: 2;
			width: 577px;
			clip-path: inset(0 100% 0 0);
			animation: clipImage .7s ease-in .5s forwards;
		}
		.art {
			opacity: 0;
			animation: fadeIn 1.5s cubic-bezier(.23,1,.32,1) 1.2s forwards;
			&.-hd-art01 {
				left: -203px;
				bottom: -25px;
				z-index: 4;
				width: 637px;
			}
			&.-hd-art02 {
				right: -242px;
				bottom: -10px;
				z-index: 4;
				width: 883px;
			}
		}
	}
}

@keyframes scrollLoopTop {
	from { transform: translateX(-50%); }
	to   { transform: translateX(0); }
}


@keyframes scrollLoopBottom {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* ----------------------------------------------------------------------------------------------------
*  top-nav
* --------------------------------------------------------------------------------------------------*/
.top-nav {
	box-shadow: 0 6px 0 #E3B100;
	background: var(--color-line-yellow);
	height: calc(100 * var(--scale-nav));
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	transform: translateY(calc(-100% - 6px));
	&.is-fixed {
		animation: navFixed .5s linear forwards;
	}
	.sec-inner {
		position: relative;
		width: calc(1350 * var(--scale-nav));
		height: 100%;
	}
	img {
		max-width: 100%;
		height: auto;
	}
	.top-nav-list {
		margin: auto;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		.item01 {
			width: calc(242 * var(--scale-nav));
		}
		.item02 {
			margin-left: calc(60 * var(--scale-nav));
			width: calc(253 * var(--scale-nav));
		}
		.item03 {
			margin-left: calc(70 * var(--scale-nav));
			width: calc(526 * var(--scale-nav));
		}
	}
	.art {
		&.-nav01 {
			left: 0;
			top: calc(10 * var(--scale-nav));
			width: calc(91 * var(--scale-nav));
		}
		&.-nav02 {
			right: 0;
			top: calc(11 * var(--scale-nav));
			width: calc(86 * var(--scale-nav));
		}
	}
}
:root {
	--scale-nav: calc(1350px / 1950);
	@media screen and (min-width: 1350px) {
		--scale-nav: 1px;
	}
}

@keyframes navFixed {
	0%{
		transform: translateY(calc(-100% - 6px));
	}
	100%{
		transform: translateY(0);
	}
}

/* ----------------------------------------------------------------------------------------------------
*  sec common
* --------------------------------------------------------------------------------------------------*/
.sec {
	position: relative;
	&.-bg-toys {
		background: url("../images/bg_toys.png") 50% 50%;
	}
	&.-bg-blue {
		&::before {
			content: "";
			background: #EAFAFF;
			position: absolute;
			left: 0;
			top: 0;
			z-index: 2;
			display: block;
			width: 100%;
			height: 100%;
			pointer-events: none;
		}
	}
	&.-bg-yellow {
		&::before {
			content: "";
			z-index: 2;
			background: #FFFBCE;
			position: absolute;
			left: 0;
			top: 0;
			display: block;
			width: 100%;
			height: 100%;
			pointer-events: none;
		}
	}
}
em {
	font-style: normal;
}
.em {
	color: var(--color-text-accent01);
}
.em-tdh {
	color: var(--color-text-tdh);
}
.em-dah {
	color: var(--color-text-dah);
}
.sec-inner{
	margin: 0 auto;
	width: 950px;
}
.-pc-w780 {
	width: 780px;
}
.-pc-w800 {
	width: 800px;
}
.-pc-w920 {
	width: 920px;
}
.-pc-w1100 {
	width: 1100px;
}
.sec-ti-area {
	margin-bottom: 40px;
	position: relative;
	z-index: 5;
	&::before {
		content: "";
		margin: 0 auto 17px;
		background: url("../images/sec_ti_art01.png") no-repeat;
		display: block;
		width: 922px;
		height: 180px;
	}
	.sec-ti {
		text-align: center;
	}
}
.-pc-w750 .sec-ti-area::before {
	margin-left: -86px;
	margin-right: -86px;
}
.-pc-w800 .sec-ti-area::before {
	margin-left: -61px;
	margin-right: -61px;
}
.hover {
	opacity: 1;
	transition: opacity .3s ease-in;
	&:hover {
		opacity: 0.7;
	}
}
.btn {
	margin: auto;
	position: relative;
	width: 300px;
	height: 50px;
	.btn-link {
		border-radius: 25px;
		background: var(--color-base-blue);
		color: var(--color-white);
		font-weight: 800;
		font-size: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		opacity: 1;
		transition: opacity .3s ease-in;
		&:hover {
			opacity: 0.7;
			.arrow {
				transform: translateX(3px);
			}
		}
	}
	.arrow {
		top: 14px;
		right: 10px;
		width: 22px;
		height: 22px;
		transition: transform .3s ease-in;
	}
}
.-btn-large {
	margin: auto;
	border-radius: 20px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 800px;
	height: 116px;
	.link-txt {
		display: block;
	}
	.arrow {
		bottom: 23px;
		width: 28px;
	}
}


.btn-reservation {
	margin: 30px auto 0;
	.btn-link {
		border-radius: 20px;
		background: var(--color-button-purple);
		box-shadow: 0 8px 0 #5B1D88;
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 116px;
	}
	.link-txt {
		display: block;
		width: 317px;
	}
	.art {
		&.arrow {
			bottom: auto;
			top: 43px;
			right: 205px;
			width: 28px;
			transform: rotate(90deg);
		}
		&.art-space01 {
			left: 17px;
			bottom: 12px;
			width: 88px;
		}
		&.art-space02 {
			right: 8px;
			bottom: 2px;
			width: 110px;
		}
	}
}
.btn-restaurant {
	background: var(--color-text-accent01);
	box-shadow: 0 8px 0 #BF2455;
	.link-txt {
		width: 468px;
	}
	.arrow {
		right: 270px;
	}
}
.btn-tsh {
	background: var(--color-button-red);
	box-shadow: 0 8px 0 #96000E;
	.link-txt {
		width: 643px;
	}
	.arrow {
		right: 206px;
	}
	.art {
		&.art-space01 {
			left: 12px;
			bottom: 12px;
			width: 48px;
		}
		&.art-space02 {
			top: 13px;
			right: 6px;
			width: 58px;
		}
	}
}

.art {
	line-height: 1;
	position: absolute;
	display: block;
	pointer-events: none;
	img {
		vertical-align: top;
	}
	&.-pin {
		&.-pin-red {
			color: #ED493B;
		}
		&.-pin-blue {
			color: var(--color-bg-blue);
		}
		&.-pin-green01 {
			color: var(--color-bg-green);
		}
		&.-pin-green02 {
			color: #00AC6A;
		}
		&.-pin-pink {
			color: var(--color-text-accent01);
		}
	}
}
.date-box-anime {
	margin: -15px auto;
	padding: 15px 0;
}
.date-box {
	margin: auto;
	position: relative;
	dl {
		margin: auto;
		padding: 18px 0 23px;
		line-height: 1;
		position: relative;
		z-index: 3;
		width: 100%;
		dt {
			color: var(--color-white);
			font-weight: 900;
			font-size: 22px;
			text-align: center;
			.line {
				margin: 5px auto 15px;
				display: block;
				width: 102px;
				height: 10px;
				svg {
					vertical-align: top;
					width: 100%;
				}
			}
		}
		dd {
			color: var(--color-white);
			font-weight: 900;
			font-size: 22px;
			text-align: center;
			letter-spacing: 0.02em;
			.num {
				font-size: 118%;
                vertical-align: baseline;
			}
			.note {
				margin: 15px auto 0;
				font-weight: 700;
				font-size: 15px;
				text-align: center;
				display: block;
			}
		}
	}
	&::before {
		content: "";
		position: absolute;
		left: 2px;
		top: 0;
		width: 100%;
		height: 100%;
		transform: rotate(2deg);
		pointer-events: none;
	}
	&::after {
		content: "";
		position: absolute;
		left: 2px;
		top: 0;
		width: 100%;
		height: 100%;
		pointer-events: none;
	}
	&.-stay {
		margin-bottom: 47px;
		width: 500px;
		.line {
			color: var(--color-line-yellow);
		}
		&::before {
			background: var(--color-line-yellow);
		}
		&::after {
			background: var(--color-bg-blue);
		}
	}
	&.-menu {
		width: 450px;
		.line {
			color: var(--color-bg-green);
		}
		&::before {
			background: var(--color-bg-green);
			transform: rotate(3deg);
		}
		&::after {
			background: var(--color-text-accent01);
			transform: rotate(-1deg);
		}
	}
}

.pin-area {
	padding: 0 70px 0;
	border: 8px solid;
	border-radius: 30px;
	background: var(--color-white);
	position: relative;
	.art.-pin {
		top: -25px;
		left: 50%;
		transform: translateX(-50%);
		width: 40px;
	}
	&.-stay01 {
		border-color: var(--color-line-green01);
		box-shadow: 7px 7px #D6E9F2;
	}
	&.-stay02 {
		border-color: var(--color-line-yellow);
		box-shadow: 7px 7px #D6E9F2;
	}
	&.-stay03 {
		border-color: var(--color-line-blue);
		box-shadow: 7px 7px #D6E9F2;
	}
	&.-menu-tdh {
		border-color: var(--color-line-brown);
		background: #FFFBF2;
		box-shadow: 7px 7px #EFE8AF;
	}
	&.-menu-dah {
		border-color: var(--color-line-navy);
		background: #F7FCFF;
		box-shadow: 7px 7px #EFE8AF;
	}
	&.-link-about {
		border-color: var(--color-text-accent01);
		box-shadow: 7px 7px var(--color-shadow01);
	}
	&.-link-movie {
		border-color: var(--color-line-green01);
		box-shadow: 7px 7px var(--color-shadow01);
	}
}

.art-note {
	background: repeat-x 0 100% / auto 100%;
	width: 100%;
	left: 0;
	bottom: 100%;
	width: 100%;
	height: 90px;
}

.art-memo {
	top: -126px;
	left: 50%;
	transform: translateX(-50%) rotate(-4deg);
	width: 1070px;
	height: 468px;
}

/* ----------------------------------------------------------------------------------------------------
*  sec first
* --------------------------------------------------------------------------------------------------*/
.section01 {
	padding: 80px 0 313px;
	.art-flag {
		margin: 0 auto 40px;
		width: 466px;
	}
	.lead-area {
		margin-bottom: 52px;
		position: relative;
		.txt {
			font-weight: 800;
			font-size: 24px;
			letter-spacing: 0.04em;
			line-height: 1.83;
		}
		.art {
			&.-art-first01 {
                bottom: -20px;
                left: -60px;
				width: 269px;
			}
			&.-art-first02 {
				bottom: -25px;
                right: -48px;
				width: 287px;
			}
		}
	}
	.anchor-list {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		gap: 50px 40px;
	}
}

.anchor-item {
	margin: auto;
	width: 530px;
	&.-anchor03 {
		width: 760px;
	}
	a {
		position: relative;
		display: block;
		img {
			width: 100%;
			height: auto;
		}
	}
	.art.-bg {
		position: static;
	}
	.txt {
		display: block;
	}
	.art.arrow {
		width: 41px;
	}
	.btn-anchor01 {
		.txt {
			position: absolute;
			left: 73px;
			top: 50px;
			width: 365px;
		}
		.arrow {
			top: 65px;
			right: 65px;
		}
	}
	.btn-anchor02 {
		.txt {
			position: absolute;
			left: 83px;
			top: 35px;
			width: 389px;
		}
		.arrow {
			top: 88px;
			right: 137px;
		}
	}
	.btn-anchor03 {
		border-radius: 20px;
		border: 5px solid var(--color-base-blue);
		background: var(--color-bg-beige01);
		box-shadow: 0 8px var(--color-base-blue);
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 116px;
		.txt {
			width: 623px;
		}
		.art.-anchor-space01 {
			left: 7px;
			top: 24px;
			width: 48px;
		}
		.art.-anchor-space02 {
			right: 0;
			top: 5px;
			width: 57px;
		}
		.arrow {
			bottom: 23px;
			right: 191px;
			width: 28px;
		}
	}
}

.fixed-btn {
	position: fixed;
	bottom: 50px;
	right: 43px;
	z-index: 100;
	width: 240px;
	a {
		position: relative;
		display: block;
		width: 100%;
	}
	.art {
		&.-fixed-art01 {
			left: -5px;
			top: 6px;
			width: 59px;
		}
		&.-fixed-art02 {
			bottom: -7px;
			right: -23px;
			width: 71px;
		}
	}
}

/* ----------------------------------------------------------------------------------------------------
*  sec stay
* --------------------------------------------------------------------------------------------------*/
.section02 {
	margin-bottom: 90px;
	padding: 82px 0 177px;
	position: relative;
	z-index: 2;
	.art-note {
		background-image: url("../images/note_stay01.svg");
		z-index: 2;
	}
	.art-memo {
		box-shadow: 5px 5px 0 #E0C244;
		background: #FFFBCE;
		z-index: 0;
	}
	.sec-inner {
		position: relative;
		z-index: 3;
	}
	.ttl-sec {
		margin: 0 auto 42px;
		position: relative;
		width: 828px;
		padding-top: 55px;
		.ti {
			margin-left: 120px;
			display: block;
			width: 613px;
		}
		.art {
			top: 0;
			left: 0;
			width: 100%;
		}
		.line {
			margin: 0 auto;
			display: block;
			width: 589px;
		}
	}
	.ruled-line {
		padding: 26px 0 60px;
		background: url("../images/bg_line01.gif");
	}
	.logo-tsh {
		margin: 0 auto 42px;
		width: 270px;
	}
	.txt-box {
		margin-bottom: 22px;
		padding-bottom: 26px;
		font-size: 22px;
		letter-spacing: 0.04em;
		line-height: 2;
		position: relative;
		.label {
			margin: 0 0 -24px 124px;
			width: 272px;
		}
		.art {
			&.-art-stay01 {
				left: 120px;
				bottom: 0;
				width: 124px;
			}
			&.-art-stay02 {
				right: 120px;
				bottom: 28px;
				width: 116px;
			}
		}
	}
	.pin-area {
		width: 830px;
		.column {
			display: flex;
			align-items: center;
			gap: 20px;
		}
		.img-column {
			position: relative;
			width: 400px;
			.img01 {
				background: #cecece;
				border: 6px solid var(--color-white);
				box-shadow: 3px 3px 0 #E5E5E5;
				overflow: hidden;
				width: 400px;
				height: 280px;
				img {
					margin: -6px;
					width: calc(100% + 12px);
					max-width: unset;
					height: calc(100% + 12px);
				}
			}
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
			.label {
				position: absolute;
			}
		}
		.body-column {
			width: 432px;
		}
		.ttl-pin {
			margin-bottom: 20px;
			.ti {
				color: var(--color-text-accent01);
				font-weight: 900;
				font-size: 26px;
				line-height: 1.38;
				white-space: nowrap;
				display: block;
			}
			.line {
				margin: 0 auto;
				display: block;
				width: 403px;
				height: 16px;
				svg {
					line-height: 1;
					vertical-align: top;
					width: 100%;
				}
			}
		}
		.txt {
			color: var(--color-text-base02);
			font-size: 18px;
			line-height: 2;
		}
		.note-list {
			margin-top: 1em;
			li {
				color: var(--color-text-base02);
				font-size: 15px;
				line-height: 1.4;
			}
		}
		.art {
			&.-art-stay03 {
				right: -173px;
				bottom: 75px;
				width: 131px;
			}
			&.-art-stay04 {
				left: -203px;
				bottom: 80px;
				width: 206px;
			}
			&.-art-stay05 {
				right: -176px;
				bottom: 45px;
				width: 156px;
			}
		}
		&.-stay01 {
			margin: 0 auto 58px 100px;
			padding: 60px 30px 55px 0;
			.img-column {
				margin-left: -76px;
				.label {
					left: -30px;
					bottom: -40px;
					width: 205px;
				}
			}
			.line {
				color: var(--color-line-yellow);
			}
		}
		&.-stay02 {
			margin: 0 103px 58px auto;
			padding: 75px 0 55px 40px;
			.column {
				flex-direction: row-reverse;
			}
			.img-column {
				margin-top: -110px;
				margin-right: -78px;
				display: flex;
				align-items: center;
				.img02 {
					border-radius: 15px;
					background: #E5E5E5;
					overflow: hidden;
					position: absolute;
					bottom: -120px;
					left: -17px;
					width: 220px;
					height: 155px;
					transform: rotate(4deg);
				}
				.label {
					right: -35px;
					bottom: -105px;
					width: 213px;
				}
			}
			.btn {
				margin-top: 25px;
				width: 265px;
				.btn-link {
					border-radius: 10px;
					background: var(--color-text-accent01);
				}
			}
			.line {
				color: var(--color-bg-green);
			}
		}
		&.-stay03 {
			margin: 0 auto 75px 100px;
			padding: 75px 48px 70px 0;
			.img-column {
				margin-left: -78px;
				.img01 {
					width: 398px;
					height: 278px;
				}
				.img02 {
					border-radius: 15px;
					background: #E5E5E5;
					overflow: hidden;
					position: absolute;
					bottom: 0;
					right: -56px;
					width: 300px;
					height: 190px;
					transform: rotate(-6deg);
				}
				.label {
					left: -30px;
					bottom: -70px;
					width: 260px;
				}
			}
			.line {
				color: var(--color-line-yellow);
			}
		}
	}

	.anchor-item {
		width: 800px;
		.btn-anchor03 {
			.txt {
				width: 670px;
			}
			.arrow {
				bottom: 20px;
				right: 202px;
			}
		}
	}
}

/* ----------------------------------------------------------------------------------------------------
*  sec menu
* --------------------------------------------------------------------------------------------------*/
.section03 {
	padding: 129px 0 95px;
	border-bottom: 20px solid var(--color-line-yellow);
	position: relative;
	z-index: 3;
	.art-note {
		background-image: url("../images/note_menu01.svg");
		z-index: 2;
	}
	.art-memo {
		box-shadow: 5px 5px 0 #F7B4B4;
		background: #FFDDDD;
		z-index: 0;
	}
	.sec-inner {
		position: relative;
		z-index: 3;
	}
	.ttl-sec {
		margin: 0 auto 40px;
		position: relative;
		width: 890px;
		.ti {
			margin-left: 95px;
			display: block;
			width: 713px;
		}
		.art {
			bottom: 12px;
			left: -8px;
			width: 100%;
		}
		.line {
			margin: 0 auto;
			display: block;
			width: 589px;
		}
	}
	.ruled-line {
		padding: 20px 0 55px;
		background: url("../images/bg_line02.gif");
	}
	.logo-list {
		margin-bottom: 40px;
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 42px;
		.logo-tdh {
			width: 350px;
		}
		.logo-dah {
			width: 215px;
		}
	}

	.date-box-cover {
		margin: 0 auto 63px;
		position: relative;
		width: 920px;
		.art {
			&.-art-menu01 {
				left: 125px;
				bottom: -15px;
				width: 91px;
			}
			&.-art-menu02 {
				right: 80px;
				bottom: -25px;
				width: 142px;
			}
		}
	}

	.txt-box {
		margin-bottom: 50px;
		font-size: 22px;
		letter-spacing: 0.04em;
		line-height: 2;
		&.-menu {
			margin-bottom: 60px;
			color: var(--color-text-base02);
		}
	}
	.menu-figure-cover {
		margin: 0 auto 95px;
		position: relative;
		width: 850px;
		.img01 {
			background: #cecece;
			border: 10px solid var(--color-white);
			box-shadow: 5px 5px 0 #E5E5E5;
			overflow: hidden;
			width: 100%;
			height: 490px;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}
		.art {
			&.-art-menu03 {
				bottom: -45px;
				left: -35px;
				width: 170px;
			}
			&.-art-menu04 {
				bottom: -70px;
				right: -55px;
				width: 175px;
			}
		}
		.label {
			position: absolute;
			left: -28px;
			top: -22px;
			width: 244px;
		}
	}
	.special-menu {
		.ttl-menu {
			margin: 0 auto 55px;
			padding-top: 18px;
			position: relative;
			width: 807px;
			.ti {
				margin: auto;
				display: block;
				width: 624px;
			}
			.art {
				left: 0;
				top: 0;
				width: 100%;
			}
		}
	}

	.pin-are-cover {
		margin: auto;
		width: 920px;
	}

	.pin-area {
		padding: 50px 0 60px;
		border-radius: 40px;
		.art.-pin {
			transform: translateX(0);
			left: 70px;
			& + .art.-pin {
				left: auto;
				right: 70px;
			}
		}
		&.-menu-tdh {
			margin-bottom: 22px;
			.figure-cover.-img-hotel {
				width: 368px;
				height: 272px;
				.hotel-name {
					left: -30px;
					bottom: -20px;
					width: 430px;
				}
			}
			.restaurant-cover {
				margin-top: 40px;
				padding: 0 55px;
				position: relative;
				display: flex;
				.restaurant-item {
					flex-shrink: 0;
					&.-canna {
						margin-top: 60px;
						margin-left: -5px;
					}
					&.-dreamers {
						margin-left: -10px;
					}
				}
				.art.-restaurant-cover {
					top: -30px;
					left: 70px;
					width: 786px;
				}
				.caption {
					color: var(--color-text-tdh);
					font-weight: 900;
					font-size: 20px;
				}
			}
			.figure-cover.-img-menu01 {
				width: 410px;
				figure {
					height: 280px;
					transform: rotate(-4deg);
				}
				.caption {
					margin-bottom: 10px;
					padding-right: 30px;
				}
			}
			.figure-cover.-img-menu02 {
				width: 400px;
				figure {
					margin-bottom: 43px;
					height: 280px;
					transform: rotate(4deg);
				}
				.caption {
					margin-bottom: 18px;
					padding-right: 50px;
				}
			}
			.btn {
				margin-left: 25px;
				.btn-link {
					background: var(--color-line-brown);
				}
			}
			.art {
				&.-art-menu07 {
					left: -60px;
					bottom: -60px;
					width: 167px;
				}
				&.-art-menu08 {
					right: -10px;
					bottom: -50px;
					width: 110px
				}
			}
		}
		&.-menu-dah {
			margin: 68px 0 84px;
			padding-bottom: 48px;
			.figure-cover.-img-hotel {
				margin-bottom: 55px;
				width: 368px;
				height: 239px;
				.hotel-name {
					left: -40px;
					bottom: -25px;
					width: 450px;
				}
			}
			.restaurant-cover {
				position: relative;
				.art.-restaurant-cover {
					top: 104px;
					left: 125px;
					width: 667px;
				}
			}
			.figure-cover.-img-menu01 {
				margin: auto;
				width: 380px;
				figure {
					margin-bottom: 42px;
					height: 280px;
					transform: rotate(4deg);
				}
				.caption {
					margin-bottom: 14px;
					color: var(--color-text-dah);
					font-weight: 900;
					font-size: 20px;
				}
			}
			.btn .btn-link {
				background: var(--color-line-navy);
			}

			.art {
				&.-art-menu10 {
					left: -25px;
					bottom: -20px;
					width: 206px;
				}
				&.-art-menu11 {
					right: -45px;
					bottom: -10px;
					width: 219px
				}
			}
		}

		.figure-cover {
			figure {
				background: #cecece;
				border: 8px solid var(--color-white);
				box-shadow: 3px 3px 0 #E5E5E5;
				overflow: hidden;
				width: 100%;
				height: 100%;
				img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
			}
			&.-img-hotel {
				margin: auto;
				position: relative;
				.hotel-name {
					position: absolute;
				}
			}
		}

		.btn {
			width: 265px;
			height: 50px;
			.btn-link {
				border-radius: 10px;
				background: var(--color-line-navy);
				font-size: 22px;
				.arrow {
					top: 15px;
					width: 20px;
				}
			}
		}
	}

	.note-list li {
		color: var(--color-text-base02);
		font-size: 17px;
	}
}

/* ----------------------------------------------------------------------------------------------------
*  sec link
* --------------------------------------------------------------------------------------------------*/
.section04 {
	padding: 165px 0 148px;
	.pin-area {
		&.-link-about {
			margin-bottom: 90px;
			padding-top: 65px;
			padding-bottom: 40px;
			.link-ti {
				margin-bottom: 27px;
				color: var(--color-text-accent01);
				font-weight: 900;
				font-size: 26px;
				.ti {
					display: flex;
					justify-content: center;
					align-items: center;
				}
				.art.-note01 {
					margin-top: auto;
					margin-right: -10px;
					position: relative;
					width: 26px;
				}
				.art.-note02 {
					margin-top: -10px;
					margin-bottom: auto;
					position: relative;
					width: 35px;
				}
				.line {
					margin: auto;
					background: url(../images/line_link01.svg) no-repeat 50% 50%;
					display: block;
					width: 403px;
					height: 16px;
				}
			}
			.img {
				margin: 0 auto 18px;
				background: #cecece;
				width: 440px;
			}
			.art {
				&.-about01 {
                    left: -55px;
                    bottom: -40px;
					width: 291px;
				}
				&.-about02 {
                    right: -28px;
                    bottom: -40px;
					width: 226px;
				}
			}
		}
		&.-link-movie {
			padding-top: 75px;
			padding-bottom: 45px;
			.bnr {
				margin: 0 auto 15px;
				background: #cecece;
				display: block;
				width: 630px;
			}
			.note {
				color: var(--color-text-base02);
				font-size: 17px;
			}
		}
	}
}

/* ----------------------------------------------------------------------------------------------------
*  sec feature
* --------------------------------------------------------------------------------------------------*/
.section05 {
	background: url("../images/bg_cloud.png") 50% 0 / 100% auto;
	@media screen and (max-width: 1920px) {
		background-size: 1920px auto;
	}
	.art-line {
		background: url("../images/bg_line03.gif") repeat-x 50% 50% / auto 100%;
		height: 88px;
		&.-top {
			margin-bottom: 297px;
		}
		&.-bottom {
			margin-top: 150px;
		}
	}
	.feature-block {
		margin-bottom: 60px;
		padding: 165px 0 73px;
		position: relative;
		.art {
			&.-bg-frame {
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				img {
					width: 100%;
					height: 100%;
				}
			}
			&.-footprint {
				top: 11px;
				left: 25px;
				width: 1052px;
			}
			&.-motif {
				left: 71px;
				bottom: -55px;
				width: 964px;
			}
		}
		.feature-ti {
			margin: auto;
			top: -220px;
			left: 0;
			right: 0;
			position: absolute;
			z-index: 5;
			width: 756px;
		}
		.txt {
			margin: 0 auto 5px;
			position: relative;
			font-weight: 900;
			font-size: 22px;
			letter-spacing: 0.04em;
			line-height: 2;
			.em {
				color: var(--color-text-accent02);
			}
		}
		.line {
			margin: 0 0 -37px 180px;
			position: relative;
			width: 787px;
		}
		.motif-list {
			position: relative;
			display: flex;
			align-items: flex-start;
			flex-wrap: wrap;
			.motif-item {
				border-radius: 30px;
				border: 8px solid #CCCCCC;
				background: var(--color-white);
				position: relative;
				width: 280px;
				&.-line-green {
					border-color: var(--color-line-green02);
				}
				&.-line-purple {
					border-color: var(--color-line-purple);
				}
				&.-line-yellow {
					border-color: var(--color-line-yellow);
				}
				&.-line-red {
					border-color: var(--color-line-red);
				}
				&.-motif02,
				&.-motif06,
				&.-motif08 {
					width: 240px;
				}
				&.-motif01 {
					margin-top: 28px;
					margin-left: 100px;
				}
				&.-motif02 {
					margin-top: 80px;
					margin-left: 70px;
					.caption {
						top: -80px;
						right: -60px;
						width: 213px;
					}
				}
				&.-motif03 {
					margin-left: 60px;
					.caption {
						bottom: -88px;
						right: -34px;
						width: 300px;
					}
				}
				&.-motif04 {
					margin-top: 18px;
					margin-left: 80px;
				}
				&.-motif05 {
					margin-top: 60px;
					margin-left: 75px;
					.caption {
						bottom: -70px;
						left: -60px;
						width: 240px;
					}
				}
				&.-motif06 {
					margin-top: 40px;
					margin-left: 75px;
				}
				&.-motif07 {
					margin-top: 40px;
					margin-left: 120px;
				}
				&.-motif08 {
					margin-top: 60px;
					margin-left: 240px;
					.caption {
						bottom: -53px;
						left: -43px;
						width: 258px;
					}
				}
				.modal-open {
					display: block;
					width: 100%;
					height: 100%;
					.tap {
						border-radius: 14px;
						background: var(--color-button-red);
						color: var(--color-white);
						font-weight: 900;
						font-size: 22px;
						line-height: 35px;
						text-align: center;
						position: absolute;
						right: 12px;
						bottom: 12px;
						display: block;
						width: 70px;
						height: 38px;
					}
				}
				figure {
					border-radius: 22px;
					overflow: hidden;
					aspect-ratio: 1;
					img {
						margin: -8px;
						width: calc( 100% + 16px);
						max-width: unset;
						height: calc( 100% + 16px);
						object-fit: cover;
					}
				}
				.caption {
					position: absolute;
				}
			}
		}
	}

	.btn-tsh {
		margin-bottom: 150px;
	}
	.btn-reservation {
		margin-top: 50px;
		.arrow {
			transform: rotate(0);
		}
	}

	.rsv-link {
		margin: 0 auto 80px;
		padding: 50px 0 70px;
		border-radius: 40px;
		border: 8px solid var(--color-text-accent02);
		background: #fffcdd;
		position: relative;
		width: 920px;
		.art {
			&.-cloud01 {
				top: 35px;
				left: 30px;
				width: 143px;
			}
			&.-cloud02 {
				top: 32px;
				right: 30px;
				width: 177px;
			}
		}
		.link-ti {
			margin-bottom: 24px;
			.ti {
				margin-bottom: 5px;
				color: var(--color-text-accent02);
				font-weight: 900;
				font-size: 34px;
				display: block;
			}
			.line {
				margin: auto;
				display: block;
				width: 270px;
			}
		}
		.txt {
			margin-bottom: 43px;
			color: var(--color-text-base02);
			font-size: 20px;
			line-height: 1.8;
		}

		.rsv-accordion {
			margin: auto;
			border-radius: 15px;
			border: 4px solid #9CE0F4;
			overflow: hidden;
			width: 800px;

			.rsv-accordion-summary {
				background: #9CE0F4;
				color: var(--color-line-navy);
				font-size: 20px;
				text-align: center;
				position: relative;
				display: flex;
				justify-content: center;
				align-items: center;
				height: 52px;
				cursor: pointer;

				&::-webkit-details-marker {
					display: none;
				}

				.icon {
					content: "";
					position: absolute;
					right: 6px;
					top: 50%;
					transform: translateY(-50%);
					display: block;
					width: 28px;
					transition: transform .2s ease-out;
				}
			}

			.rsv-accordion-body {
				padding: 30px;
				background: var(--color-white);
				color: var(--color-text-base02);
				font-weight: 500;
				font-size: 16px;
				line-height: 1.93;
			}
		}
	}

	.vpn-link {
		margin: auto;
		border-radius: 40px;
		background: rgb(255, 255, 255, 0.85);
		padding: 50px 0;
		width: 780px;
		.link-ti {
			margin-bottom: 19px;
			.logo {
				margin: 0 auto 30px;
				display: block;
				width: 243px;
			}
			.ti {
				color: var(--color-button-red);
				font-weight: 900;
				font-size: 24px;
				line-height: 1;
				display: block;
			}
		}
		.txt {
			margin-bottom: 27px;
			color: var(--color-text-base02);
			font-size: 18px;
			line-height: 1.8;
		}
	}
}

.rsv-accordion[open] .rsv-accordion-summary .icon {
	transform: translateY(-50%) scaleY(-1) !important;
}
.rsv-accordion .rsv-accordion-body {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .5s ease;
}
.rsv-accordion[open] .rsv-accordion-body {
	grid-template-rows: 1fr;
}
.rsv-accordion .rsv-accordion-body > * {
	overflow: hidden;
}
@supports selector(::details-content) {
	:root { interpolate-size: allow-keywords; }
	.rsv-accordion::details-content {
		transition: height .5s ease, content-visibility .5s allow-discrete;
		height: 0;
		overflow: clip;
	}
	.rsv-accordion[open]::details-content {
		height: auto;
	}
	.rsv-accordion .rsv-accordion-body {
		display: block;
		grid-template-rows: none;
		transition: none;
	}
	.rsv-accordion .rsv-accordion-body > * {
		overflow: visible;
	}
}
@media (prefers-reduced-motion: reduce) {
	.rsv-accordion .rsv-accordion-body {
		transition: none;
	}
	@supports selector(::details-content) {
		.rsv-accordion::details-content {
			transition: none;
		}
	}
}

/* ----------------------------------------------------------------------------------------------------
*  content-footer
* --------------------------------------------------------------------------------------------------*/
.content-footer {
	padding: 20px 0 40px;
	background: var(--color-bg-beige02);
	.note-list li {
		color: var(--color-text-base02);
		font-size: 17px;
	}
	#sns{
		margin: 80px auto 0;
		font-weight: normal;
		.snsBtn{
			text-align: center;
			margin-bottom: 38px;
			li{
				width: 70px;
				display: inline-block;
				& + li {
					margin-left: 20px;
				}
				img{
					width: 100%;
				}
			}
		}
		.snsCap{
			padding: 0 40px;
			p{
				margin-bottom: 1em;
				color: var(--color-text-base02);
				font-weight: 900;
				font-size: 16px;
				text-align: center;
			}
		}
		.note-list li {
			color: var(--color-text-base02);
			font-weight: 500;
			font-size: 14px;
			line-height: 1.57;
		}
	}
}


/* ----------------------------------------------------------------------------------------------------
*  modal
* --------------------------------------------------------------------------------------------------*/
.modal-overlay{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 120%;
	background-color: rgb(156, 244, 245, 0.8);
	z-index: 1000;
}
.modal-content {
	display: none;
	position: relative;
	text-align: left;
	box-sizing: border-box;
}
.modal-content p {
    position: relative;
}
.modal-wrap {
	z-index:2000;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	text-align: center;
	margin: 0 auto;
	padding: 5% 4% calc( 63px + 5% );
	box-sizing: border-box;
}
@media screen and (max-width: 1000px){
	.modal-wrap {
		padding: 16% 4% 5%;
	}
}
.modal-wrap .modal-content {
	margin: 0 auto;
	padding: 108px 0 78px;
	background: #fffcdd;
	border-radius: 30px;
	border: 8px solid var(--color-line-green02);
	display: block;
	width: 800px;
	height: auto;
	position: relative;
	opacity: 0;
	transition: transform .3s ease-in;
}
.modal-wrap.modal-active .modal-content {
	opacity: 1;
}
.modal-wrap.modal-active .modal-content::before {
	content: "";
	background: url("../images/modal_art01.svg") no-repeat 50% 50% / contain;
	position: absolute;
	top: 14px;
	left: 5px;
	width: 98px;
	height: 94px;
}
.modal-wrap.modal-active .modal-content::after {
	content: "";
	background: url("../images/modal_art02.svg") no-repeat 50% 50% / contain;
	position: absolute;
	bottom: 21px;
	right: 18px;
	width: 62px;
	height: 67px;
}
.modal-wrap .modal-content .close-btn{
	background: url("../images/btn_close.svg") no-repeat 50% 50% / contain;
	position: absolute;
	top: 20px;
	right: 20px;
	width: 70px;
	height: 70px;
	z-index: 1;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	cursor: pointer;
}
.modal-wrap .modal-content .close-btn:hover{
	filter: contrast(.8);
}
.modal-wrap .modal-content .modal-img {
	margin: auto;
	border-radius: 30px;
	overflow: hidden;
	width: 620px;
	&.-png {
		border-radius: 0;
		overflow: visible;
		position: relative;
		width: 604px;
		figcaption {
			color: var(--color-text-base02);
			font-size: 15px;
			line-height: 1.44;
			right: -14px;
			bottom: 0;
			position: absolute;
		}
	}
}
.modal-wrap .modal-content .modal-txt {
	margin-top: 26px;
	color: var(--color-text-base02);
}
.modal-wrap .modal-content .modal-txt .ti {
	margin-bottom: 15px;
	color: #D80015;
	font-weight: 900;
	font-size: 20px;
	line-height: 1.5;
}
.modal-wrap .modal-content .modal-txt .txt {
	font-size: 18px;
	line-height: 1.88;
}
.modal-wrap .modal-content .modal-txt .note-list {
	margin-top: 1em;
}
.modal-wrap .modal-content .modal-txt .link {
	margin-top: 5px;
	border-bottom: 2px solid var(--color-button-red);
	color: var(--color-button-red);
	display: inline-block;
	.arrow {
		margin-left: 2px;
		display: inline-block;
		width: 16px;
		height: 16px;
		svg {
			color: var(--color-button-red);
			width: 100%;
			height: 100%;
		}
	}
}
.is-modal #header.vendor {
	z-index: 10;
}
.is-modal {
    overflow:hidden;
}
.is-modal .wrap {
    overflow:scroll;
    position: fixed;
    margin: 0 auto;
    top: 0;
    left: 0;
    right: 0;
}