@charset "UTF-8";

:root {
	--frame-width: 40px;
	--frame-border-width: 10px;
	--scale-ratio: 1px;
	--font-ratio: 1px;
	--nav-height: 130px;
}

/* ----------------------------------------------------------------------------------------------------
*  main layout
* --------------------------------------------------------------------------------------------------*/
.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%;}

.contentIn {
	font-size: 16px;
}
.wrap{
	min-width: 1100px;
}

/* ----------------------------------------------------------------------------------------------------
*  scrollAnime
* --------------------------------------------------------------------------------------------------*/
.scrollTrigger.-fadeUp {
	transform: translate(0, 25%);
	opacity: 0;
}
.scrollTrigger.-fadeUp.is-active {
	animation: fadeUp 1.5s cubic-bezier(.23,1,.32,1) forwards;
}
.scrollTrigger.-scaleUp.is-active {
	animation: scaleUp 0.5s cubic-bezier(0.12, 0, 0.39, 0) forwards;
}
.scrollTrigger.-moveUp {
	transform: translate(0, 50%);
}
.scrollTrigger.-moveUp.is-active {
	animation: moveUp 0.5s cubic-bezier(.23,1,.32,1) 0.1s forwards;
}
.scrollTrigger.-moveBumpy.is-active {
	animation: moveBumpy 0.5s cubic-bezier(.23,1,.32,1) forwards;
}
.scrollTrigger.-slideMoveBumpy.is-active {
	animation: slideMoveBumpy 0.5s cubic-bezier(.23,1,.32,1) both;
}
@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);}
}

/* ----------------------------------------------------------------------------------------------------
*  content-header
* --------------------------------------------------------------------------------------------------*/
.content-header {
	min-width: 1400px;
	height: 1000px;
}
@media screen and (width < 1400px) {
	.content-header {
		margin: 0 -150px;
	}
}
.content-header .header-bg {
	background: no-repeat 50% 0;
}
.content-header .header-bg.-bg03 {
    margin-left: 10px;
	background-image: url("../images/header_bg03.png");
	top: -50px;
	animation: heartBeat 2s ease-in-out infinite alternate;
}
.content-header .header-bg.-bg02 {
    margin-left: -10px;
	background-image: url("../images/header_bg02.png");
	top: 45px;
	animation: heartBeat 2s ease-in-out 1s infinite alternate;
}
.content-header .header-bg.-bg01 {
    margin-left: 5px;
	background-image: url("../images/header_bg01.png");
	top: -13px;
}
@keyframes heartBeat {
	0% {
		transform: translate(-50%, 0) rotate(0.5deg);
	}
	50% {
		transform: translate(-50%, -2px) rotate(0deg);
	}
	100% {
		transform: translate(-50%, 0) rotate(-0.5deg);
	}
}
.content-header .header-line-bg {
	background-image: url("../images/header_line_under.png");
}
.content-header .header-line-ribbon {
	background-image: url("../images/header_line.png");
}
.content-header-inner {
	padding-top: 47px;
}
.header-title {
	width: 1141px;
	height: 320px;
}
.header-title .-art01 {
	bottom: -30px;
	left: -50px;
	width: 290px;
	height: 189px;
}
.header-title .-art02 {
	bottom: 55px;
	right: -55px;
	width: 199px;
	height: 157px;
}
.header-img {
	margin-top: -290px;
	width: 1364px;
	height: 837px;
}
.header-parts {
	bottom: 55px;
	width: 1100px;
}
.header-part.-photo01 {
	left: -215px;
    bottom: -20px;
	width: 331px;
	height: 302px;
	z-index: 11;
}
.header-part.-photo02 {
	left: 0;
	bottom: -120px;
	width: 383px;
	height: 348px;
	z-index: 10;
}
.header-part.-photo03 {
	right: 75px;
	bottom: -100px;
	width: 294px;
	height: 269px;
	z-index: 11;
}
.header-part.-photo04 {
	right: -155px;
	bottom: -75px;
	width: 318px;
	height: 291px;
	z-index: 10;
}
.hd-logo {
	margin-top: -238px;
}

/* ----------------------------------------------------------------------------------------------------
*  sec common
* --------------------------------------------------------------------------------------------------*/
.sec {
	position: relative;
	min-width: 1100px;
}
.sec-inner{
	margin: 0 auto;
	width: 1100px;
}
.sec-ti-area {
	margin-bottom: 40px;
}

/* ----------------------------------------------------------------------------------------------------
*  top-nav
* --------------------------------------------------------------------------------------------------*/
.top-nav:not(.-is-fixed) .top-nav-list {
	gap: 70px;
}
.top-nav-list .top-nav-item a span {
	height: 171px;
}
.top-nav.-is-fixed .top-nav-list .top-nav-item a span {
	height: 26px;
}
.top-nav-list .top-nav-item a .-top-nav01 {
	background-image: url("../images/top_nav01_01.png");
	width: 328px;
}
.top-nav-list .top-nav-item a .-top-nav02 {
	background-image: url("../images/top_nav02_01.png");
	width: 346px;
}
.top-nav-list .top-nav-item a .-top-nav03 {
	background-image: url("../images/top_nav03_01.png");
	width: 328px;
}
.top-nav.-is-fixed .top-nav-list .top-nav-item a .-top-nav01 {
	background-image: url("../images/top_nav01_02.png");
	width: 303px;
}
.top-nav.-is-fixed .top-nav-list .top-nav-item a .-top-nav02 {
	background-image: url("../images/top_nav02_02.png");
	width: 314px;
}
.top-nav.-is-fixed .top-nav-list .top-nav-item a .-top-nav03 {
	background-image: url("../images/top_nav03_02.png");
	width: 305px;
}

.top-nav:not(.-is-fixed) .art {
	display: none;
}
.top-nav.-is-fixed .art {
	margin: 0 15px;
	display: block;
	width: 17px;
}

.btn-fixed-reserve {
	right: 70px;
	bottom: 70px;
}
.btn-fixed-reserve .btn-link {
	padding: 5px;
	border-radius: 57.5px;
	background: var(--color-gradient03);
	width: 280px;
	height: 115px;
}
.btn-fixed-reserve .btn-link .link-cover {
	padding-top: 27px;
	border-radius: 52.5px;
	background: #fff;
	display: flex;
	justify-content: center;
	width: 100%;
	height: 100%;
}
.btn-fixed-reserve .art-ribbon {
	top: -19px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	z-index: 9999;
	width: 49px;
}
.btn-fixed-reserve:hover .art-ribbon {
	animation: bounce .5s ease;
}
.btn-fixed-reserve .arrow {
	position: absolute;
	left: 50%;
	bottom: 13px;
	transform: translateX(-50%);
	transition: transform .5s ease-out;
}
.btn-fixed-reserve .btn-link:hover .arrow {
	transform: translate(-50%,5px);
}
@keyframes bounce {
	0% {
		transform: translateX(-50%) scale(1);
	}
	50% {
		transform: translate(-50%,-2px) scale(1.1);
	}
	100% {
		transform: translateX(-50%) scale(1);
	}
}

.anker-area:not(.-reservation) {
	margin-top: 0;
	padding-top: 0;
}

/* ----------------------------------------------------------------------------------------------------
*  sec-room
* --------------------------------------------------------------------------------------------------*/
.sec-room .sec-ti-area {
	background-image: url("../images/sec_ti01_bg.png");
}
.sec-room .area-interior .interior-item.-room01 {
	margin-bottom: 93px;
}
.sec-room .area-interior .interior-item.-room02,
.sec-room .area-interior .interior-item.-room03 {
	display: flex;
}
.sec-room .area-interior .interior-item.-room02 {
	margin-bottom: 180px;
}
.sec-room .area-interior .interior-item.-room03 {
	margin-bottom: 81px;
}
.room-line {
	margin: 150px auto 130px;
	width: 1000px;
}
.sec-room .area-interior .interior-item .img {
	border-radius: 40px;
}
.sec-room .area-interior .interior-item.-room01 .img {
	margin: 0 auto;
	width: 820px;
}
.sec-room .area-interior .interior-item.-room02 .img,
.sec-room .area-interior .interior-item.-room03 .img {
	width: 690px;
}
.sec-room .area-interior .interior-item.-room01::before {
	top: 320px;
	width: 1100px;
}
.sec-room .area-interior .interior-item.-room02::before {
	top: 90px;
	bottom: -40px;
	left: -60px;
	right: 135px;
}
.sec-room .area-interior .interior-item.-room03::before {
	top: -40px;
	bottom: 84px;
	left: 125px;
	right: -60px;
}
.sec-room .area-interior .interior-item.-room02 .img {
	margin-left: -135px;
}
.sec-room .area-interior .interior-item.-room03 .img {
	margin-right: -115px;
}
.sec-room .area-interior .interior-item.-room01 .txt-box {
	margin: 0 auto;
	padding: 50px 0 90px;
	width: 820px;
}
.sec-room .area-interior .interior-item.-room01 .txt-box .art-heart {
	left: 45px;
	top: -20px;
}
.sec-room .area-interior .interior-item.-room01 .txt-box .art-box {
	right: 50px;
	bottom: -30px;
}
.sec-room .area-interior .interior-item.-room02 .txt-box {
	padding: 240px 0 0 40px;
	width: 408px;
}
.sec-room .area-interior .interior-item.-room02 .txt-box .art-heart {
	right: 0;
	top: 180px;
	width: 220px;
}
.sec-room .area-interior .interior-item.-room02 .txt-box .art-box {
	left: -130px;
    bottom: -80px;
}
.sec-room .area-interior .interior-item.-room03 .txt-box {
	margin-left: 115px;
	padding: 50px 10px 0 60px;
	width: 400px;
}
.sec-room .area-interior .interior-item .txt-box .txt {
	font-size: 18px;
	letter-spacing: 0.05em;
	line-height: 2;
}
.sec-room .area-interior .interior-item.-room03 .txt-box .art-heart {
	left: 110px;
	top: -30px;
}
.sec-room .area-interior .interior-item.-room03 .txt-box .art-box {
	left: 20px;
	bottom: 35px;
}
.sec-room .area-interior .txt-lead.-lead02 {
	font-size: 26px;
}
.sec-room .area-interior .txt-lead.-lead02 .em::before {
	left: -20px;
	top: 0;
}
.sec-room .area-interior .txt-lead.-lead02 .em::after {
	right: 12px;
	bottom: 0;
}

.sec-room .area-interior .art-kira {
    right: -50px;
    bottom: 1220px;
}
.sec-room .area-interior .art-heart.-heart03 {
    right: -405px;
    bottom: 570px;
}

.sec-room .area-items {
	position: relative;
}
.sec-room .area-items .art-heart01 {
	right: -220px;
	top: 955px;
}
.sec-room .area-items .room-ti-area {
	margin-top: -40px;
	padding-top: 70px;
	background-image: url("../images/room_ti01_bg.png");
}
.sec-room .items-items {
	margin-left: auto;
	position: relative;
	z-index: 3;
	width: 1100px;
}
.sec-room .items-items.-key .art-heart02{
    right: 35px;
    top: -80px;
}
.sec-room .items-items.-postcard .art-heart02 {
	top: -104px;
	left: -84px;
	width: 234px;
}
.sec-room .items-items.-postcard .art-stone01 {
	transform: scaleX(-1);
	left: auto;
    right: calc(15 * var(--scale-ratio));
}
.sec-room .items-items.-postcard .art-stone02 {
	transform: scaleY(-1);
	right: auto;
    left: calc(15 * var(--scale-ratio));
}

.sec-room .area-detail .room-ti-area {
	margin-top: -45px;
	padding-top: 40px;
	background-image: url("../images/room_ti02_bg.png");
	background-position-x: 64%;
}
.area-detail .detail-cover .art-heart01 {
    left: -290px;
    top: -200px;
	width: 448px;
}
.area-detail .detail-cover .art-kira01 {
	right: -93px;
	bottom: -60px;
}

.sec-room .area-reservation .room-ti-area {
	margin-top: -30px;
	padding-top: 25px;
	background-image: url("../images/room_ti03_bg.png");
	background-position-x: 28%;
}
.sec-room .reservation-accordion {
	margin: 0 auto 60px;
	width: 900px;
}
.sec-room .area-reservation .txt-start {
	font-size: 24px;
}
.sec-room .area-reservation .btn-reservation {
	border-radius: 35px;
}
.sec-room .area-reservation .btn-reservation .btn-link {
	border-radius: 24px;
}
.sec-room .area-reservation .btn-reservation .link-cover {
	border-radius: 20px;
}

.sec-room .area-link-item .btn .btn-link {
    width: 230px;
    height: 40px;
}
.sec-room .area-link-item .btn .btn-link .link-txt {
	width: 129px;
}

.sec-room .area-links .art-heart01 {
	left: -370px;
    top: 250px;
	width: 510px;
}
.sec-room .area-links .art-kira01 {
	right: -185px;
	bottom: -20px;
	width: 165px;
}


/* ----------------------------------------------------------------------------------------------------
*  sec-goods
* --------------------------------------------------------------------------------------------------*/
.sec-goods .sec-ti-area {
	margin-bottom: 50px;
	background-image: url("../images/sec_ti02_bg.png");
}
.sec-goods .area-key .txt-box {
	width: 525px;
}
.sec-goods .area-key .art-heart02 {
	left: -70px;
	top: -90px;
}
.sec-goods .area-key .art-kira01 {
    left: -150px;
    bottom: -35px;
	transform: scaleX(-1);
}
.sec-goods .area-detail {
	width: 1000px;
	gap: 33px;
}
.sec-goods .area-detail .art-heart01 {
	top: -820px;
	right: -280px;
	width: 431px;
}
.sec-goods .area-detail .art-heart02 {
	left: -260px;
	bottom: 0;
}
.sec-goods .area-detail .art-kira01 {
    right: -130px;
    bottom: -50px;
}

.sec-goods .area-photo .art-heart {
	right: 15px;
	top: -25px;
}
.sec-goods .area-photo .art-ribbon {
    right: -160px;
    bottom: -100px;
}

/* ----------------------------------------------------------------------------------------------------
*  sec-menu
* --------------------------------------------------------------------------------------------------*/
.sec-menu .sec-ti-area {
	margin-top: 55px;
	padding-top: 200px;
	background-image: url("../images/sec_ti03_bg.png");
}
.sec-menu .logo-list {
	margin: 65px auto 70px;
	display: flex;
	justify-content: center;
	gap: 70px;
}
.sec-menu .logo-list .logo-tdh {
	width: 463px;
}
.sec-menu .area-first .art-kira01 {
	bottom: 0;
    left: -130px;
}
.sec-menu .area-first .art-heart01 {
	right: -235px;
	top: 80px;
}
.sec-menu .area-first .img01 {
	border-radius: 40px;
	width: 820px;
}
.sec-menu .area-first::before {
	top: 320px;
	width: 1070px;
}
.sec-menu .area-first .txt-box {
	padding: 40px 0 60px;
}
.sec-menu .area-first .txt-box .txt {
	font-size: 18px;
}
.sec-menu .area-first .art-heart02 {
	left: 60px;
	top: -50px;
}
.sec-menu .area-first .art-ribbon {
	right: 50px;
	bottom: -55px;
}
.sec-menu .area-link .menu-ti {
	margin-bottom: 34px;
	font-size: 32px;
}
.sec-menu .area-link .link-list {
	display: flex;
	justify-content: center;
	gap: 40px;
}
.sec-menu .area-link .link-item .link-ti {
	margin-bottom: 5px;
}
.sec-menu .area-link .link-item .btn {
	margin-top: 20px;
}
.sec-menu .area-link .link-item .btn .btn-link {
	width: 230px;
	height: 60px;
}
.sec-menu .area-link .link-item .btn .btn-link .link-txt {
	width: 152px;
}
.sec-menu .area-link .link-item .btn .btn-link .arrow {
	right: 16px;
	width: 10px;
}
.sec-menu .area-link .link-list .art-heart03 {
	left: -330px;
	bottom: -40px;
}
.sec-menu .area-link .link-list .art-kira02 {
	right: -75px;
	bottom: 35px;
}

/* ----------------------------------------------------------------------------------------------------
*  sec-park
* --------------------------------------------------------------------------------------------------*/
.sec-park {
	padding: 150px 0 124px;
}
.sec-park .park-figure-cover {
	margin-bottom: 45px;
}
.sec-park .park-figure-cover .art-star.-star01 {
	top: 4px;
	right: calc(100% + 20px);
	width: 50px;
}
.sec-park .park-figure-cover .art-star.-star02 {
	bottom: 8px;
	left: calc(100% + 20px);
	width: 56px;
}

/* ----------------------------------------------------------------------------------------------------
*  art-area
* --------------------------------------------------------------------------------------------------*/
.art-area .dot-belt {
	height: 40px;
}
.art-area .sec-inner {
	margin: 0 auto;
	background: url("../images/ft_art02.png") no-repeat 50% 50% / auto 100%;
	text-align: center;
	width: auto;
}
.art-area .art-minnie {
	min-height: 607px;
}

/* ----------------------------------------------------------------------------------------------------
*  content-footer
* --------------------------------------------------------------------------------------------------*/
.content-footer {
	padding: 20px 0 40px;
	position: relative;
}
.content-footer > .note-list li {
	margin-bottom: 35px;
	padding-right: 20px;
	font-size: 16px;
	text-align: center;
}

footer #sns{
	margin: 0 auto;
	font-weight: normal;
}
footer #sns .snsBtn{
	text-align: center;
	margin-bottom: 35px;
}
footer #sns .snsBtn li{
	width: 67px;
	display: inline-block;
}
footer #sns .snsBtn li + li{
	margin-left: 16px;
}
footer #sns .snsBtn li img{
	width: 100%;
}
footer #sns .snsCap{
	padding: 0 40px;
}
footer #sns .snsCap p{
	margin-bottom: 1em;
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.025em;
}
footer #sns .note-list li {
	font-size: 14px;
	line-height: 2;
	letter-spacing: 0.025em;
}
