@charset "UTF-8";

.plan {
	background: rgb(var(--planBase)) url(../img/planBg.svg) center top repeat-y;
	background-size: 100% auto;
	position: relative;
}

.plan .obj {
	position: absolute;
	z-index: 1;
}

.plan .obj.obj01 {
	width: 321px;
	top: 604px;
	right: 0;
}

.plan .obj.obj02 {
	width: 302px;
	top: 1200px;
	left: 0;
}

.plan .obj.obj03 {
	width: 376px;
	top: 2650px;
	right: 0;
}

.plan .obj.obj04 {
	width: 224px;
	top: 3800px;
	right: 0;
}

.plan .obj.obj05 {
	width: 250px;
	top: 5000px;
	left: 0;
}

.plan .main {
	margin: 0 auto;
	padding: 116px 0;
	width: 1000px;
	position: relative;
	z-index: 2;
}

.plan__title {
	margin-bottom: 40px;
	line-height: 1;
	color: rgb(var(--nvy));
	font-family: var(--forevs);
	font-size: 68px;
	letter-spacing: 0.05em;
}

.plan__lead {
	margin-bottom: 50px;
	color: rgb(var(--nvy));
	font-size: 18px;
	font-weight: bold;
}

.plan__section {
	margin-bottom: 120px;
	position: relative;
	z-index: 2;
}

.plan__section--title {
	line-height: 1;
	color: rgb(var(--nvy));
	font-family: var(--forevs);
	font-size: 56px;
	letter-spacing: 0.005em;
	position: relative;
	z-index: 2;
	bottom: -8px;
}

.plan__section--content {
	background: rgb(var(--wht));
	padding: 78px 110px;
	border-top: solid 10px rgb(var(--nvy));
	position: relative;
}

.plan__section--content::before {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	content: "";
}

/* stay-tokyo */
.stay-tokyo .plan__section--content::before {
	background-image: url(../img/obj01.svg);
	width: 200px;
	height: 206px;
	top: -66px;
	right: 20px;
}

/* stay-otsu */
.stay-otsu .plan__section--content::before {
	background-image: url(../img/obj02.svg);
	width: 185px;
	height: 150px;
	top: -42px;
	right: 24px;
}

/* stay-hiroshima */
.stay-hiroshima .plan__section--content::before {
	background-image: url(../img/obj03.svg);
	width: 162px;
	height: 158px;
	top: -30px;
	right: 48px;
}

/* event-hokkaido */
.event-hokkaido .plan__section--content::before {
	background-image: url(../img/obj04.svg);
	width: 188px;
	height: 198px;
	top: -62px;
	right: 42px;
}

/* event-hiroshima */
.event-hiroshima .plan__section--content::before {
	background-image: url(../img/obj05.svg);
	width: 200px;
	height: 170px;
	top: -34px;
	right: 34px;
}

/* event-okinawa */
.event-okinawa .plan__section--content::before {
	background-image: url(../img/obj06.svg);
	width: 174px;
	height: 143px;
	top: -56px;
	right: -38px;
}

@media screen and (max-width: 1280px) {
	.plan .obj.obj01 {
		width: 25.078vw;
		top: 47.188vw;
	}

	.plan .obj.obj02 {
		width: 23.594vw;
		top: 93.75vw;
	}

	.plan .obj.obj03 {
		width: 29.375vw;
		top: 207.031vw;
	}

	.plan .obj.obj04 {
		width: 17.5vw;
		top: 296.875vw;
	}

	.plan .obj.obj05 {
		width: 19.531vw;
		top: 390.625vw;
	}

	.plan .main {
		padding: 9.063vw 0;
		width: 78.125vw;
	}

	.plan__title {
		margin-bottom: 3.125vw;
		font-size: 5.313vw;
	}

	.plan__lead {
		margin-bottom: 3.906vw;
		font-size: 1.406vw;
	}

	.plan__section {
		margin-bottom: 9.375vw;
	}

	.plan__section--title {
		font-size: 4.375vw;
		bottom: -0.469vw;
		bottom: -0.625vw;
	}

	.plan__section--content {
		padding: 6.094vw 8.594vw;
		border-top-width: 0.781vw;
	}

	/* stay-tokyo */
	.stay-tokyo .plan__section--content::before {
		width: 15.625vw;
		height: 16.094vw;
		top: -5.156vw;
		right: 1.563vw;
	}

	/* stay-otsu */
	.stay-otsu .plan__section--content::before {
		width: 14.453vw;
		height: 11.719vw;
		top: -3.281vw;
		right: 1.875vw;
	}

	/* stay-hiroshima */
	.stay-hiroshima .plan__section--content::before {
		width: 12.656vw;
		height: 12.344vw;
		top: -2.344vw;
		right: 3.75vw;
	}

	/* event-hokkaido */
	.event-hokkaido .plan__section--content::before {
		width: 14.688vw;
		height: 15.469vw;
		top: -4.844vw;
		right: 3.281vw;
	}

	/* event-hiroshima */
	.event-hiroshima .plan__section--content::before {
		width: 15.625vw;
		height: 13.281vw;
		top: -2.656vw;
		right: 2.656vw;
	}

	/* event-okinawa */
	.event-okinawa .plan__section--content::before {
		width: 13.594vw;
		height: 11.172vw;
		top: -4.375vw;
		right: -2.969vw;
	}
}

@media screen and (max-width: 768px) {
	.plan .obj {
		position: absolute;
		z-index: 1;
	}

	.plan .obj.obj01 {
		width: 34.24vw;
		top: 248vw;
	}

	.plan .obj.obj02 {
		width: 32.213vw;
		top: 536vw;
	}

	.plan .obj.obj03 {
		width: 40.107vw;
		top: 780vw;
	}

	.plan .obj.obj04 {
		width: 23.893vw;
		top: 1030vw;
	}

	.plan .obj.obj05 {
		width: 26.667vw;
		top: 1270vw;
	}

	.plan .main {
		padding: 18.667vw 0;
		width: calc(100% - 14.4vw);
	}

	.plan__title {
		margin-bottom: 6.4vw;
		font-size: 11.733vw;
	}

	.plan__lead {
		margin-bottom: 8vw;
		font-size: 4.267vw;
	}

	.plan__section {
		margin-bottom: 16vw;
	}

	.plan__section--title {
		font-size: 9.6vw;
		bottom: -1.6vw;
	}

	.plan__section--content {
		padding: 10.667vw 6.4vw;
		border-top-width: 2.667vw;
	}

	/* stay-tokyo */
	.stay-tokyo .plan__section--content::before {
		width: 34.133vw;
		height: 35.157vw;
		top: -21.333vw;
		right: -6.4vw;
	}

	/* stay-otsu */
	.stay-otsu .plan__section--content::before {
		width: 31.573vw;
		height: 25.6vw;
		top: -8vw;
		right: -6.4vw;
	}

	/* stay-hiroshima */
	.stay-hiroshima .plan__section--content::before {
		width: 27.648vw;
		height: 26.965vw;
		top: -12vw;
		right: -6.4vw;
	}

	/* event-hokkaido */
	.event-hokkaido .plan__section--content::before {
		width: 32.085vw;
		height: 33.792vw;
		top: -24vw;
		right: -6.4vw;
	}

	/* event-hiroshima */
	.event-hiroshima .plan__section--content::before {
		width: 34.133vw;
		height: 29.013vw;
		top: -21.333vw;
		right: -6.4vw;
	}

	/* event-okinawa */
	.event-okinawa .plan__section--content::before {
		width: 29.696vw;
		height: 24.405vw;
		top: -12vw;
		right: -6.4vw;
	}
}

/*
	hotel
------------------------------ */
.hotel__name {
	margin-bottom: 30px;
	line-height: 1;
	color: rgb(var(--nvy));
	font-family: var(--forevs);
	font-size: 44px;
	letter-spacing: 0.05em;
}

.hotel__name .jp {
	margin-top: 10px;
	font-family: var(--gothic);
	font-size: 20px;
	display: block;
}

.hotel__image {
	margin-bottom: 20px;
}

.hotel__content .title {
	line-height: 1.5;
	font-size: 26px;
	display: flex;
	align-items: flex-start;
}

.hotel__content .title .category {
	background: rgb(var(--gld));
	margin: 10px 10px 0 0;
	padding: 0 1em;
	height: 22px;
	color: rgb(var(--wht));
	font-size: 14px;
	border-radius: 22px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
}

.hotel__content .price {
	margin-bottom: 0;
	line-height: 1.5;
	font-size: 20px;
	font-weight: bold;
}

.hotel__content .date {
	font-weight: bold;
}

.hotel__content .text {
	margin: 1em 0;
	font-size: 16px;
}

.hotel__content .place {
	margin-bottom: 16px;
}

.hotel__content .place__inner {
	padding: 0.25em 1em;
	line-height: 1;
	font-size: 14px;
	font-weight: bold;
	border: solid 1px rgb(var(--blk));
	border-radius: 24px;
}

.hotel__content .linkBtn {
	margin-top: 50px;
}

.hotel__content .linkBtn a {
	background: rgb(var(--nvy));
	margin-left: auto;
	width: 240px;
}

.hotel__content .linkBtn a svg {
	stroke: rgb(var(--wht));
}

.hotel__slide {
	padding-bottom: 50px;
}

.hotel__slide .slick-dots {
	height: auto;
	display: flex;
	justify-content: center;
	bottom: 0;
}

.hotel__slide li {
	margin: 0 4px;
	width: auto;
	height: auto;
}

.hotel__slide li button {
	background: rgb(var(--gry));
	padding: 0;
	width: 16px;
	height: 16px;
	text-indent: -99999px;
	border-radius: 16px;
}

.hotel__slide li.slick-active button {
	background: rgb(var(--nvy));
}

@media screen and (max-width: 1280px) {
	.hotel__name {
		margin-bottom: 2.344vw;
		font-size: 3.438vw;
	}

	.hotel__name .jp {
		margin-top: 0.781vw;
		font-size: 1.563vw;
	}

	.hotel__image {
		margin-bottom: 1.563vw;
	}

	.hotel__content .title {
		font-size: 2.031vw;
	}

	.hotel__content .title .category {
		margin: 0.781vw 0.781vw 0 0;
		height: 1.719vw;
		font-size: 1.094vw;
		border-radius: 1.719vw;
	}

	.hotel__content .price {
		font-size: 1.563vw;
	}

	.hotel__content .text {
		font-size: 1.25vw;
	}

	.hotel__content .place {
		margin-bottom: 1.25vw;
	}

	.hotel__content .place__inner {
		font-size: 1.094vw;
		border-radius: 1.875vw;
	}

	.hotel__content .linkBtn {
		margin-top: 3.906vw;
	}

	.hotel__content .linkBtn a {
		width: 18.75vw;
	}

	.hotel__slide {
		padding-bottom: 3.906vw;
	}

	.hotel__slide li {
		margin: 0 0.313vw;
	}

	.hotel__slide li button {
		width: 1.25vw;
		height: 1.25vw;
		border-radius: 1.25vw;
	}
}

@media screen and (max-width: 768px) {
	.hotel__name {
		margin-bottom: 6.4vw;
		font-size: 8vw;
	}

	.hotel__name .jp {
		margin-top: 2.667vw;
		font-size: 4.8vw;
	}

	.hotel__image {
		margin-bottom: 5.333vw;
	}

	.hotel__content .title {
		font-size: 4.8vw;
		flex-direction: column;
	}

	.hotel__content .title .category {
		margin: 0 0 2.667vw;
		height: 5.333vw;
		font-size: 3.733vw;
		border-radius: 5.333vw;
	}

	.hotel__content .price {
		font-size: 4.267vw;
	}

	.hotel__content .date {
		font-size: 3.2vw;
	}

	.hotel__content .text {
		font-size: 3.733vw;
	}

	.hotel__content .place__inner {
		padding: 0.25em 0.5em;
		font-size: 3.733vw;
		border-radius: 6.4vw;
	}

	.hotel__content .linkBtn {
		margin-top: 8vw;
	}

	.hotel__content .linkBtn a {
		margin-left: 0;
		width: 51.733vw;
	}

	.hotel__slide {
		padding-bottom: 13.333vw;
	}

	.hotel__slide li {
		margin: 0 1.067vw;
	}

	.hotel__slide li button {
		width: 3.467vw;
		height: 3.467vw;
		border-radius: 3.467vw;
	}
}

/* ----------------------------------------------------
	plan__link
---------------------------------------------------- */
.plan .event-okinawa {
	margin-bottom: 60px;
}

.plan__link.linkBtn a {
	background: rgb(var(--grn));
	margin: 0 auto;
	width: 330px;
	color: rgb(var(--nvy));
}

.plan__link.linkBtn a svg {
	stroke: rgb(var(--nvy));
}

@media screen and (max-width: 1280px) {
	.plan .event-okinawa {
		margin-bottom: 4.688vw;
	}

	.plan__link.linkBtn a {
		width: 25.781vw;
	}
}

@media screen and (max-width: 768px) {
	.plan .event-okinawa {
		margin-bottom: 8vw;
	}

	.plan__link.linkBtn a {
		width: 100%;
	}
}