.p-header__row._top {
	background-color: #fff;
}

main {
	width: 100%;
	max-width: none;
	margin: 0 auto;
	padding: 0;

	@media (max-width: 820px) {
		width: 100%;
	}
}

.p-hhr-lp__section {
	margin: 0;
	padding: 0;
	line-height: 0;
}

.p-hhr-lp__section__img {
	position: relative; 
	margin: 0 auto;
	padding: 0;
}

.p-hhr-lp__section__img > picture,
.p-hhr-lp__section__img > picture > img {
	position: relative;
	display: block;
	width: 1920px;
	max-width: none;
	height: auto;
	left: 50%;
	transform: translateX(-50%);

}

@media (max-width: 820px) {
  .p-hhr-lp__section__img {
    width: 100%;
  }

  .p-hhr-lp__section__img > picture,
  .p-hhr-lp__section__img > picture > img {
    width: 100%;
    max-width: 100%;
  }
}

/* slide */
.p-hhr-lp__section__mv {
	position: relative;
  	z-index: 1;
}

.slide-container {
	position: absolute;
	left: 50%;
  	transform: translateX(-50%);
	bottom: -10.6vw;
	width: 100%;
	max-width: 1920px;
	overflow: hidden;

	@media (max-width: 820px) {
    	bottom: -20vw;
  	}
}

.slide-track {
	display: inline-flex;
	width: max-content;
	gap: 1.5625vw;
	animation: slide-flow 50s linear infinite;
	will-change: transform;

	@media (max-width: 820px) {
		gap: 3vw;
		animation: slide-flow 40s linear infinite;
  	}

}

.slide {
	flex: 0 0 auto;
	height: 19.375vw;
	width: auto;
	display: block;

	@media (max-width: 820px) {
		height: 39.2vw;
	}
}

@keyframes slide-flow {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-50%);
  }
}

/* navigation */
.p-hhr-lp__navigation {
	display: flex;
	justify-content: center;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0;
	background-color: #F6F5EA;
}

/* btn wayou */
.p-hhr-lp__wayou-btn {
	position: absolute;
	display: block;
	left: 50%;
	top: 89%;       
	max-width: 426px;
	margin-left: 120px;

	@media (max-width: 820px) {
		width: 56.8vw;
		left: 50%;
		top: 88%;
		transform: translateX(-50%);
		margin-left: 0;
		max-width: none;
	}
}

.p-hhr-lp__wayou-btn:hover {
	opacity: 0.8;
}

.p-hhr-lp__wayou-btn picture,
.p-hhr-lp__wayou-btn img {
	display: block;
	width: 100%;
	height: auto;
}

/* btn semidouble */
.p-hhr-lp__semidouble-btn {
	position: absolute;
	display: flex;
	flex-direction: column;
	gap: 1.04vw;
	right: 50%;
	top: 63%;       
	max-width: 426px;
	margin-right: 200px;

	@media (max-width: 820px) {
		gap: 2.666vw;
		width: 56.8vw;
		left: 50%;
		top: 76%;
		transform: translateX(-50%);
		margin-right: 0;
		max-width: none;
	}
}

.p-hhr-lp__semidouble-btn a:hover {
	opacity: 0.8;
}

.p-hhr-lp__semidouble-btn a picture,
.p-hhr-lp__semidouble-btn a img {
	display: block;
	width: 100%;
	height: auto;
}

/* btn superiorforce */
.p-hhr-lp__superiorforce-btn {
	position: absolute;
	display: block;
	left: 50%;
	top: 72%;       
	max-width: 426px;
	margin-left: 120px;

	@media (max-width: 820px) {
		width: 56.8vw;
		left: 50%;
		top: 84%;
		transform: translateX(-50%);
		margin-left: 0;
		max-width: none;
	}
}

.p-hhr-lp__superiorforce-btn:hover {
	opacity: 0.8;
}

.p-hhr-lp__superiorforce-btn picture,
.p-hhr-lp__superiorforce-btn img {
	display: block;
	width: 100%;
	height: auto;
}

/* hotel reservation */
.p-hhr-lp__reservation {
	display: flex;
	justify-content: center;
	gap: 40px;
	max-width: 1580px;
	margin: 0 auto;
	padding-bottom: 110px;

	@media (max-width: 820px) {
		flex-direction: column;
		align-items: center;
		gap: 10.666vw;
		padding-bottom: 22.666vw;
	}
}

.p-hhr-lp__reservation__contents {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 26.04vw;

	@media (max-width: 820px) {
		width: 100%;
	}
}

.p-hhr-lp__reservation__contents a {
	@media (max-width: 820px) {
		width: 56.8vw;
	}
}

.p-hhr-lp__reservation__contents a:hover {
  	opacity: 0.8;
}

.is-bg-color {
	background-color: #F6F5EA;
}


/* footer */
.Center {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 1040px;
    position: relative;
    text-align: center;
    padding: 0 20px;
}

.Top-footer {
    position: relative;
    background-color: #fff;
    color: #251716;
    font-size: 1.5rem;
    padding-bottom: 120px;

	@media (max-width: 820px) {
		padding-bottom: 16vw;
	}

}

.Top-footer-logo {
    width: 380px;
    margin: 0 auto;
    padding: 70px 0 40px;

	@media (max-width: 820px) {
		width: 58.666vw;
	}
}

.Top-footer p {
    font-weight: 500;

	@media (max-width: 820px) {
		font-size: 2vw;		
	}
}