@charset "utf-8";
:root{
	--default-color-black: #2c2a29;
    --content-width-sp: 90vw;
	--content-color-wine: #811e27;
	--content-color-khaki: #8A6B37;
	--content-color-brown: #a24c00;
	--content-color-yellow: #fded3c;
	--content-color-red: #df0d00;
	--content-color-orange: #ff7c1b;
	--content-color-green: #34870e;
	--content-color-navy: #02117f;
	--content-color-navy-d: #114f7f;
	--bg-color-orange: #ffe7a6;
	--bg-color-green: #d7f8b3;
	--bg-color-pink: #ffd9d9;
	--bg-color-yellow: #fdffde;
	--bg-color-blue: #ddf9ff;
	--content-border-yellow: linear-gradient(transparent 60%, #fded3c 0%);
}
.nosp{
  display: none
}
.contents {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 3.6vw;
	line-height: 1.5;
	color: var(--default-color-black);
	a {
		text-decoration: none;
	}
	img {
        width: 100%;
		height: auto;
		&.round {
			border-radius: 8px;
		}
    }
	.inner {
        width: var(--content-width-sp);
		max-width: 100%;
        margin: 0 auto;
	}
	mark {
		background: var(--content-border-yellow);
		color: inherit;
	}
}

/*-----------------------------------------
メインビジュアル
-------------------------------------------*/
#mainvisual {
	width: 100%;
	height: 127vw;
	overflow: hidden;
	position: relative;
	text-align: center;
	.bg-img {
		position: fixed; 
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		z-index: -1;
		background-position: center;
		background-size: cover;
		opacity: 0;
		animation: fade-animation 12s infinite;
		will-change: opacity;/*カクつき防止 */
	}
	.img1 { background-image: url('../images/main-bg1-sp.webp'); animation-delay: 0s;}
	.img2 { background-image: url('../images/main-bg2-sp.webp'); animation-delay: 4s;}
	.img3 { background-image: url('../images/main-bg3-sp.webp'); animation-delay: 8s;}

	.fukidashi {
		position: absolute;
		left: 9vw;
		top: 16vw;
		width: 26vw;
	}
	.badge {
		position: absolute;
		right: 5vw;
		top: 7vw;
		width: 22vw;
	}
	.title {
		position: absolute;
		width: 80vw;
		top: 8vw;
		right: 0;
		left: 0;
		margin: 0 auto;
		z-index: 1;
	}
	.text {
		position: absolute;
		width: 76vw;
		top: 70vw;
		right: 0;
		left: 0;
		margin: 0 auto;
		z-index: 2;
	}
	&::after {
		content: "";
		display: block;
		width: 100%;
		height: 38vw;
		background: url("../images/main-bottom-sp.png") no-repeat bottom center / 100%;
		position: absolute;
		bottom: 0;
	}
}
/* フェードアニメーションの定義 */
@keyframes fade-animation {
  0%   { opacity: 0; } 
  10%  { opacity: 1; } 
  33%  { opacity: 1; } 
  43%  { opacity: 0; } 
  100% { opacity: 0; }
}
/*パンくず調整*/
.ui-static-breadcrumb {
	background-color: #fff;
}
/*-----------------------------------------
導入
-------------------------------------------*/
#lead {
	width: 100%;
	background: var(--content-color-wine) url("../images/lead-bg.png") repeat left top / 100px;
	padding: 0 0 10vw;
	position: relative;
	.inner {
		width: 100%;
		padding: 20vw 0 0;
		position: relative;
		background: url("../images/lead-illust-sp.png") no-repeat top 3vw right 1vw / 17vw;
	}
	h2 {
		position: absolute;
		left: 5vw;
		top: -2vw;
		width: 74vw;
	}
	.text-area {
		padding: 0 5vw 5vw 38vw;
		.title {
			font-size: 6vw;
			line-height: 1.3;
			font-weight: 900;
			margin-bottom: 2vw;
			color: #fff;
			span {
				display: block;
				font-size: 0.65em;			
			}
		}
		.fukidashi {
			position: relative;
			display: inline-block;
			width: 46vw;
			padding: 2vw 3vw;
			border: 2px solid var(--content-color-khaki);
			border-radius: 8px;
			background-color: #fff;
			font-size: 3.5vw;
			line-height: 1.3;
			font-weight: 500;
			text-align: left;
			box-shadow: 2px 2px 0px 0px rgba(0, 0, 0, 0.3);
			&::before {
			  content: "";
			  position: absolute;
			  top: 50%;
			  left: 0;
			  border-style: solid;
			  border-width: 7.5px 15px 7.5px 0;
			  border-color: transparent var(--content-color-khaki) transparent transparent;
			  translate: -100% -50%;
			}
			&::after {
			  content: "";
			  position: absolute;
			  top: 50%;
			  left: 0;
			  border-style: solid;
			  border-width: 5.3px 10.5px 5.3px 0;
			  border-color: transparent #fff transparent transparent;
			  translate: -100% -50%;
			}
		}
	}
	.movie {
		width: 90vw;
		margin: 0 auto 5vw;
		.title {
			color: #fff;
			font-size: 3.8vw;
			font-weight: 700;
		}
		iframe {
			width: 100%;
			height: 50.5vw;
			border: none;
		}
		.coming {
			width: 100%;
			height: 50.5vw;
			background-color: #000;
			font-size: 7.0vw;
			font-weight: 900;
			line-height: 50.5vw;
			text-align: center;
			color: #555;
		}
	}
	.housou {
		width: 90vw;
		margin: 3vw auto 0;
		background-color: #fff;
		padding: 2vw 3vw;
		border-radius: 8px;
		position: relative;
		.abc {
			display: inline-block;
			background-color: var(--content-color-khaki);
			font-weight: 700;
			font-size: 3.3vw;
			padding: 0 2vw;
			color: #fff;
			margin-bottom: 0.5vw;
		}
		ul li {
			font-weight: 600;
			border-bottom: dotted 1px var(--content-color-khaki);
			span {
				color: var(--content-color-khaki);
			}
		}
		.okita {
			position: absolute;
			right: -3vw;
			top: -3vw;
			width: 32vw;
		}
	}
	.kobitsu {
		position: absolute;
		left: 1vw;
		top: 22vw;
		width: 33vw;
	}
	.attention {
		width: 90vw;
		margin: 6vw auto 0;
		background-color: #fff;
		padding: 2vw 3vw 2vw 3vw;
		background-color: #fff5f5;
		border: solid 1px #f00;
		color: #f00;
		.attentionMsg__title {
			font-weight: bold;
		}	
	}
}
/*iphoneで不具合のため停止*/
/*@keyframes fuwafuwa-anim {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-5px) rotate(4deg);
  }
}*/
/*------------------------------------------------
	アニメーション
--------------------------------------------------*/
/*おきた*/
/*@keyframes korokoro-anim {
  0%   { transform: translate(0%, 0%); }
  5%   { transform: translate(5%, 0%) rotate(5deg); }
  25%  { transform: translate(10%, 0%) rotate(10deg); }
  30%  { transform: translate(-5%, 0%) rotate(-5deg); }
  35%  { transform: translate(-8%, 0%) rotate(-8deg); }
  45%  { transform: translate(5%, 0%) rotate(5deg); }
  50%  { transform: translate(8%, 0%) rotate(8deg); }
  60%  { transform: translate(-3%, 0%) rotate(-3deg); }
  65%  { transform: translate(-4%, 0%) rotate(-4deg); }
  75%  { transform: translate(0%, 0%) rotate(0deg); }
  100% { transform: translate(0%, 0%) rotate(0deg); }
}
/*スクロールフェードイン 縦向きのみ スマホはなしに変更*/
@media (orientation: portrait){
	.scrollin {
	  opacity: 0;
	  transform: translateY(100px);
	  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
	}
	.scrollin.active {
	  opacity: 1;
	  transform: translateY(0);
	}
}
/*-----------------------------------------
電話受付
-------------------------------------------*/
.contact {
	width: 100%;
	background-color: #fff;
	border-top: solid 2px var(--content-color-navy);
	border-bottom: solid 2px var(--content-color-navy);
	padding: 4vw 0;
	.inner {
		h2 {
			background-color: var(--content-color-navy);
			border-radius: 4px;
			color: #fff;
			font-size: 3.6vw;
			font-weight: 700;
			padding: 1vw 0;
			text-align: center;
			margin-bottom: 2vw;
		}
		.cc {
			font-size: 4vw;
			font-weight: 700;
			&::before {
				content: "";
				display: inline-block;
				vertical-align: middle;
				width: 6vw;
				height: 6vw;
				background: url("../images/icon-tel.svg") no-repeat center center / contain;
				margin-right: 2vw;
				position: relative;
  				top: -0.5vw;
			}
		}
		.tel {
			font-family: Roboto;
			font-size: 10vw;
			line-height: 1.0;
			font-weight: 900;
			a {
				color: inherit;
			}
		}
		.time {
			font-size: 3.8vw;
			font-weight: 600;
		}
	}
}

/*-----------------------------------------
ツアーポイント
-------------------------------------------*/
#tourpoint {
	width: 100%;
	.inner {
			position: relative;
	}
	.title {
		width: var(--content-width-sp);
		margin: 0 auto 5vw;
		position: relative;
		.no {
			width: 22vw;
			height: 22vw;
			margin: 0 auto 4vw;
			background-repeat: no-repeat;
			background-size: contain;
			font-family: Roboto;
			font-weight: 900;
			font-size: 8vw;
			padding-top: 8vw;
			text-align: center;
			color: #fff;
			-webkit-text-stroke: 4px var(--default-color-black);
			paint-order: stroke;
			.point1 &,.point2 & {background-image: url("../images/point-no-bg-hotel.png");}
			.point3 & {background-image: url("../images/point-no-bg-3.png");}
			.point4 & {background-image: url("../images/point-no-bg-4.png");}
			.point5 & {background-image: url("../images/point-no-bg-5.png");}
			.point6 & {background-image: url("../images/point-no-bg-6.png");}
			.point7 &,.point8 & {background-image: url("../images/point-no-bg-sightseeing.png");}
			.point9 &,.point10 &,.point11 &,.point12 & {background-image: url("../images/point-no-bg-other.png");}
		}
		h3 {
			font-size: 6vw;
			line-height: 1.3;
			font-weight: 900;
			text-align: center;
			.tag {
				display: inline-block;
				background-color: var(--content-color-khaki);
				color: #fff;
				font-size: 4.0vw;
				font-weight: 700;
				padding: 0 2vw 0.5vw;
				.point1 & {
					margin-bottom: 1vw;
				}
			}
			.f-small {
				font-size: 0.7em;
			}
			.note {
				display: block;
				ont-size: 2.8vw;
				line-height: 1.3;
				font-weight: 400;
				padding-top: 3vw;
			}
		}
	}
	/*▼ホテル背景*/
	.bg-hotel {
		width: 100%;
		background-color: #ece9e3;
		background-image: url("../images/hotel-bg-top.png"),url("../images/hotel-bg-bottom.png"),url("../images/hotel-bg-sp.jpg");
		background-repeat: no-repeat,no-repeat,no-repeat;
		background-size: 150%,150%,100%;
		background-position: center top,center bottom, center top;
		padding: 10vw 0 15vw;
	}
	/*ポイント1*/
	.point1 {
		margin-bottom: 10vw;
		.title .base {
			font-size: 2.8vw;
			font-weight: 500;
			margin-left: 1vw;
		}
		.okita {
			width: 50vw;
			margin: 0 0 0 auto;
		}
		.colony {
			padding: 3vw;
			background-color: #fff;
			border: 2px solid var(--content-color-khaki);
			outline: 1px solid var(--content-color-khaki);
			outline-offset: -5px;
			margin-top: 13vw;
			position: relative;
			.text {
				width: 100%;
				dt {
					font-size: 4.2vw;
					font-weight: 700;
				}
				dd {
					font-size: 3.4vw;
				}
				margin-bottom: 2vw;
			}
			.ph {
				width: 100%;
				display: flex;
				gap: 2vw;
			}
			&::before {
				content: "";
				display: block;
				width: 40vw;
				height: 10vw;
				background: url("../images/illust-flower.png") no-repeat center center / contain;
				position: absolute;
				top: -10vw;
				right: 0;
				left: 0;
				margin: 0 auto;
			}
			.kawasaki {
				position: absolute;
				top: -21vw;
				left: 0;
				width: 20vw;
			}
			.kawasaki-f {
				position: absolute;
				top: -25vw;
				left: 15vw;
				width: 23vw;
			}
		}
 	}
	.hotel-wrap {
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-areas:
			"ph1 ph1"
			"text1 text1"
			"ph2 ph2"
			"ph3 ph4"
			"text2 text2";
		gap: 2vw;
		img {
			display: block;
		}
		.ph1 {
			grid-area: ph1;
		}
		.text1 {
			grid-area: text1;
		}
		.ph2 {
			grid-area: ph2;
		}
		.ph3 {
			grid-area: ph3;
		}
		.text2 {
			grid-area: text2;
		}
		.ph4 {
			grid-area: ph4;
		}
	}
	/*ポイント2*/
	.point2 {
		.okita {
			position: absolute;
			bottom: 65vw;
			left: 0;
			width: 47vw;
		}
		.furukawa {
			position: absolute;
			right: -4vw;
			top: -57vw;
			width: 28vw;
		}
		.furukawa-f {
			position: absolute;
			right: 7vw;
			top: -70vw;
			width: 23vw;
			transform: rotate(-38deg);
		}
	}
	.lounge-wrap {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-areas:
			"ph1 ph1"
			"text text"
			"ph2 ph3"
			"info info";
		gap: 2vw;
		margin-bottom: 5vw;
		img {
			display: block;
		}
		p {
			position: relative;
			span {
				position: absolute;
				right: 0.5vw;
				bottom: 0;
				font-size: 2.8vw;
				font-weight: 600;
				-webkit-text-stroke: 2px #fff;
				paint-order: stroke fill;
			}
		}
		.ph1 {
			grid-area: ph1;
		}
		.text {
			grid-area: text;
		}
		.ph2 {
			grid-area: ph2;
		}
		.ph3 {
			grid-area: ph3;
		}
		.info {
			margin-top: 20vw;
			grid-area: info;
			background-color: #fff;
			position: relative;
			dt {
				font-size: 3.8vw;
				font-weight: 700;
				line-height: 1.8;
				background-color: #fae3bb;
				padding: 0 2vw;
			}
			dd {
				font-size: 3.3vw;
				padding: 2vw 3vw;
			}
			&::before {
				content: "";
				display: block;
				width: 40vw;
				height: 10vw;
				background: url("../images/illust-flower.png") no-repeat center center / contain;
				position: absolute;
				top: -10vw;
				right: 0;
			}
		}
	}
	/*正解おきた吹き出し*/
	.seikaiokita-wrap {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		gap: 2vw;
		.seikaiokita {
			width: 23vw;
		}
		.fukidashi {
			flex: 1;
			position: relative;
			display: inline-block;
			margin-right: 3vw;
			padding: 2vw 3vw;
			border-radius: 8px;
			background-color: #fff;
			font-size: 3.6vw;
			font-weight: 700;
			color: #15a9b5;
			box-shadow: 2px 2px 0 #15a9b5;
			&::before {
				content: "";
				position: absolute;
				top: 50%;
				right: 0;
				border-style: solid;
				border-width: 3vw 0 3vw 5vw;
				border-color: transparent transparent transparent #fff;
				translate: 100% -50%;
			}
		}
	}

	/*▼ポイント3*/
	.point3 {
		padding: 10vw 0 15vw;
		background-color: var(--bg-color-orange);
		background-image: url("../images/point3-bg-top-sp.png"),url("../images/point3-bg-bottom-sp.png");
		background-repeat: no-repeat,no-repeat;
		background-position: top center,bottom center;
		background-size: 100%,100%;
		.kobitsu {
			position: absolute;
			right: -4vw;
			top: -1vw;
			width: 28vw;
		}
		.kobitsu-f {
			position: absolute;
			right: 13vw;
			top: -7vw;
			width: 27vw;
		}
		.flex-box {
			width: 100%;
			.text {
				margin-bottom: 3vw;
				dt {
					font-size: 6.0vw;
					font-weight: 900;
					color: var(--content-color-brown);
					border-left: solid 1.8vw var(--content-color-brown);
					padding-left: 2.5vw;
					margin-bottom: 2vw;
					span {
						display: block;
						font-size: 3.8vw;
						line-height: 1.3;
						font-weight: 600;
						color: var(--default-color-black);
					}
				}
				dd {
					text-align: justify;
					.note {
						display: block;
						font-size: 0.8em;
						margin-top: 1vw;
					}
				}
			}
			.ph {
				width: 100%;
			}
			&:nth-of-type(2) {
				background: url("../images/point3-line.png") no-repeat top center / 200%;
				padding-top: 8vw;
				margin-top: 4vw;
				margin-bottom: 5vw;
			}
		}
		.cafe {
			margin-top: 5vw;
			width: 100%;
			min-height: 83vw;
			background: #fff url("../images/point3-cafe-bg-sp.png") no-repeat bottom center / 100%;
			border: solid 0.7vw var(--content-color-orange);
			border-radius: 3vw;
			padding: 3vw 4vw;
			.text {
				dt {
					font-size: 4.2vw;
					font-weight: 900;
					color: var(--content-color-brown);
					margin-bottom: 2vw;
					span {
						font-size: 0.7em;
						color: var(--default-color-black);
					}
				}
				dd {
					font-size: 3.4vw;
					left: 1.3;
					text-align: justify;
				}
			}
			.ph {
				text-align: right;
				img {
					width: 54vw;
					height: 30vw;
					border-radius: 2vw;
					object-fit: cover;
				}
			}
		}
	}
	
	/*ポイント4*/
	.point4 {
		padding: 10vw 0 15vw;
		background: #000e21 url("../images/point4-bg-sp.jpg") no-repeat top 3vw center / 100%;
		.inner {
			padding-top: 0;
		}
		.title {
			margin-bottom: 27vw;
			h3 {
				width: 65vw;
				margin: 0 auto 3vw;
			}
			.title-text {
				width: 80vw;
				margin: 0 auto;
				color: #fff;
			}
		}
		.flex-box {
			width: 100%;
			.text-area {
				margin-bottom: 3vw;
				position: relative;
				dt {
					margin-bottom: 3vw;
				}
				.text {
					padding: 0 0 0 32vw;
					font-size: 3.4vw;
					text-align: justify;
					color: #fff;
				}
			}
			.ph {
				width: 100%;
				img {
					border: solid 1px #fff;
					height: 56vw;
					object-fit: cover;
				}
				span {
					display: block;
					font-size: 2.8vw;
					color: #fff;
					margin-top: 0.5vw;
				}
			}
			&:nth-of-type(2) {
				margin-top: 10vw;
				.text-area {
					.text {
						padding: 0 32vw 0 0;
					}
				}
			}
			.furukawa-p4-f {
				position: absolute;
				left: 0;
				bottom: 36vw;
				width: 30vw;
			}
			.furukawa-p4 {
				position: absolute;
				left: 0;
				bottom: 0;
				width: 30vw;
			}
			.kawasaki-p4-f {
				position: absolute;
				right: 0;
				bottom: 26vw;
				width: 26vw;
			}
			.kawasaki-p4 {
				position: absolute;
				right: 0;
				bottom: 0vw;
				width: 27vw;
			}
		}
	}
	
	/*グラデ背景*/
	.bg-wrap2 {
		width: 100%;
		background-color: #efffdf;
		padding: 5vw 0 20vw;
		position: relative;
		&::before {
			content: "";
			display: block;
			width: 100%;
			height: 15vw;
			background-image: linear-gradient(0deg, #c5e9a2, #efffdf);
			position: absolute;
			bottom: 0;
			left: 0;
		}
	}
	/*ポイント5・6*/
	.bg-themepark {
		width: 100%;
		background-image: url("../images/themepark-bg-top-sp.png"),url("../images/themepark-bg-bottom-sp.png"),linear-gradient(0deg, #3ba8cc 30%, #0e593b 60%);
		background-repeat: no-repeat,no-repeat,no-repeat;
		background-size: 100%,100%,100%;
		background-position: top center,bottom center,center center;
		padding: 10vw 0 20vw;
	}		
	.point5 {
		.title {
			margin-bottom: 10vw;
			h3 {
				width: 72vw;
				margin: 0 auto;
			}
		}
		.flex-box {
			width: 100%;
			display: flex;
			flex-direction: column;
			position: relative;
			.ph1 {
				margin-bottom: 3vw;
				border: solid 1px #fff;
			}
			.text {
				margin-bottom: 3vw;
				dt {
					font-size: 5.6vw;
					font-weight: 700;
					margin-bottom: 2vw;
					color: var(--content-color-yellow);
				}
				dd {
					text-align: justify;
					color: #fff;
					span {
						color: var(--content-color-yellow);
					}
				}
			}
			.ph2 {
				width: 70vw;
			}
			.ph3 {
				position: absolute;
				right: 0px;
				bottom: -3vw;
				width: 32vw;
			}
		}
	}
	.point6 {
		padding-top: 10vw;
		.title h3 {
			width: 80vw;
			margin: 0 auto;
		}
		.flex-box {
			.text {
				text-align: justify;
				color: #fff;
				margin-bottom: 3vw;
			}
			.ph {
				width: 90vw;
				margin: 0 auto;
			}
		}
		.kobitsu {
			position: absolute;
			left: 2vw;
			bottom: -20vw;
			width: 57vw;
		}
		.kobitsu-f {
			position: absolute;
			left: -1vw;
			bottom: -2vw;
			width: 25vw;
			transform: rotate(-36deg);
		}
	}
	/*ポイント7*/
	.point7 {
		padding: 10vw 0 5vw;
		background-color: var(--bg-color-green);
		.title {
			position: relative;
			&::after {
				content: "";
				display: block;
				width: 36vw;
				height: 12vw;
				background: url("../images/point7-illust.png") no-repeat center center / contain;
				position: absolute;
				right: -3vw;
				top: 14vw;
			}
			.title-text {
				margin: 3vw 0 18vw;
			}
		}
		.okita {
			position: absolute;
			top: -21vw;
			right: 0;
			width: 36vw;
		}
		.bus {
			position: absolute;
			top: -12vw;
			left: 0;
			width: 20vw;
		}
		.spot-list {
			display: flex;
			flex-wrap: nowrap;
			gap: 3vw;
			margin-bottom: 10vw;
			overflow-x: auto;
			overflow-y: hidden;
			-webkit-overflow-scrolling: touch;
			padding-bottom: 1vw;
			li {
				flex: 0 0 auto;
				background-color: #fff;
				border-radius: 2vw;
				width: 55vw;
				box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.3);
				img {
					border-top-left-radius: 2vw;
					border-top-right-radius: 2vw;
				}
				span {
					display: block;
					font-size: 3.4vw;
					line-height: 1.3;
					padding: 2vw;
				}
				&:nth-child(1),&:nth-child(10) {
					width: 16vw;
					background-color: transparent;
					align-self: center;
					box-shadow: none;
				}
			}
		}
		.lunch {
			width: 100%;
			padding: 3vw 4vw 4vw;
			border: dashed 0.7vw var(--content-color-green);
			border-radius: 3vw;
			background-color: #fff;
			position: relative;
			.icon {
				position: absolute;
				left: -3vw;
				top: -4vw;
				width: 20vw;
			}
			.text {
				margin-bottom: 2vw;
				dt {
					font-size: 4.8vw;
					line-height: 1.3;
					font-weight: 700;
					color: var(--content-color-green);
					margin-bottom: 2vw;
					padding-left: 14vw;
				}
				dd {
					font-size: 3.4vw;
					text-align: justify;
					.note {
						display: block;
						font-size: 0.8em;
						margin-top: 1vw;
					}
				}
			}
			.ph {
				width: 74vw;
				margin: 0 auto;
			}
		}
	}
	/*ポイント8*/
	.point8 {
		padding: 10vw 0 20vw;
		background-color: var(--bg-color-green);
		.title {
			margin: 0 auto 2vw;
			position: relative;
			.title-text {
				margin: 3vw 0 0;
			}
		}
		.text-box {
			background-color: #fff;
			border-radius: 2vw;
			padding: 4vw 4vw 8vw;
			position: relative;
			.tag {
				position: absolute;
				top: -3vw;
				left: 2vw;
				img {
					transform: rotate(-2deg);
				}
			}
			h4 {
				font-size: 5.0vw;
				font-weight: 900;
			}
			.text {
				font-size: 3.4vw;
			}
		}
		.ph {
			width: 84vw;
			margin: -7vw auto 0;
			position: relative;
			z-index: 1;
		}
		.flower {
			background: url("../images/point8-1-bg.png") no-repeat left 0 top 0 / 40vw;
			padding-top: 10vw;
			position: relative;
			h4 {
				color: #e45050;
			}
			.tag {
				width: 34vw;
			}
		}
		.forest {
			background: url("../images/point8-2-bg.png") no-repeat right 0 top 0 / 48vw;
			padding-top: 15vw;
			position: relative;
			h4 {
				color: #2a6f08;
			}
			.tag {
				width: 54vw;
			}
			.note {
				position: absolute;
				bottom: -68vw;
				right: 0;
				font-size: 2.8vw;
			}
		}
		.okita {
			position: absolute;
			top: -2vw;
			right: -4vw;
			width: 48vw;
		}
		.kawasaki {
			position: absolute;
			left: -2vw;
			bottom: -20vw;
			width: 28vw;
			z-index: 2;
		}
		.kawasaki-f {
			position: absolute;
			left: 24vw;
			bottom: -8vw;
			width: 27vw;
		}
	}
	
	/*ポイント9-12*/
	.bg-other {
		padding: 10vw 0 5vw;
		background-color: var(--bg-color-pink);
		.no {
			margin: 0 auto 2vw;
		}
	}
	.point9 {
		margin-bottom: 5vw;
		.title-text {
			width: 100%;
			padding: 3vw 40vw 0 0;
			span {
				display: block;
				font-size: 2.8vw;
				margin-top: 2vw;
			}
		}
		.ph {
			position: absolute;
			right: 0;
			top: 52vw;
			width: 38vw;
			img {
				width: 100%;
				height: 36vw;
				object-fit: cover;
			}
		}
	}
	.point10,.point11 {
		margin-bottom: 5vw;
	}
	#present {
		margin-top: 5vw;
		.sg-logo {
			width: 28vw;
			margin-top: 3vw;
		}
	}
}

/*-----------------------------------------
商品
-------------------------------------------*/
#tour {
	width: 100%;
	background-color: var(--bg-color-blue);
	padding: 10vw 0;
	.h2logo {
		width: 54vw;
		margin: 0 auto 8vw;
	}
	.h2text {
		text-align: center;
		color: var(--content-color-navy-d);
		font-size: 7.0vw;
		line-height: 1.0;
		font-weight: 700;
		margin-bottom: 5vw;;
		&::before {
			font-family: "Material Symbols Rounded";
			font-weight: 400;
			content: "\e6ca";
			display: block;
		}
	}
	.title-text {
		text-align: center;
		font-size: 4.2vw;
		font-weight: 700;
		color: var(--content-color-navy-d);
		margin: 0 auto 5vw;
	}
	.arrange {
		width: 100%;
		border-top: solid 1px #ccc;
		margin-top: 2vw;
		padding-top: 2vw;
		h3 {
			font-size: 3.6vw;
			font-weight: 700;
			color: var(--content-color-navy-d);
			&::before {
				font-family: "Material Symbols Rounded";
				font-weight: 400;
				content: "\e53a";
				font-size: 4.6vw;
				display: inline-block;
				transform: translateY(0.5vw);
				margin-right: 1vw;
			}
		}
		dl {
			width: 100%;
			font-size: 3.4vw;
			font-weight: 500;
			dt {
				font-weight: 700;
				background-color: #ffe6ea;
				padding: 0.5vw 1vw;
			}
			dd {
				padding: 0.5vw 1vw;
				.add {
					font-weight: 700;
					color: #DF0D00;
					font-size: 1.3em;
					padding-left: 1vw;
				}
				.note {
					font-size: 3.0vw;
				}
			}
		}
	}
	.schedule {
		padding-top: 10vw;
		margin-bottom: 10vw;
		position: relative;
		h3 {
			text-align: center;
			color: var(--content-color-navy-d);
			font-size: 6.0vw;
			font-weight: 700;
			background: url("../images/schedule-title-bg.png") no-repeat top center / 21vw;
			padding: 5vw 0;
			margin-bottom: 5vw;
		}
		table {
			width: 100%;
			background-color: #fff;
			border-collapse: collapse;
			border: solid 1px #d7d7d7;
			th {
				width: 15%;
				background-color: #114f7f;
				color: #fff;
				font-size: 3.5vw;
				font-weight: 500;
				text-align: center;
				vertical-align: middle;
				border: solid 1px #d7d7d7;
			}
			td {
				width: 85%;
				font-size: 3.5vw;
				position: relative;
				padding: 2vw 3vw;
				border: solid 1px #d7d7d7;
				.visit {
					display: block;
					color: var(--content-color-navy-d);
					font-weight: 700;
					padding: 0.5vw 0;
					.icon {
						display: inline-block;
						background-color: var(--content-color-orange);
						color: #fff;
						padding: 0 1vw;
						font-size: 0.8em;
						margin-right: 1vw;
						font-weight: 500;
					}
				}
				.reco {
					margin-top: 1vw;
					display: inline-block;
					font-size: 0.9em;
					font-weight: 500;
					padding: 0.5vw; 1vw;
					color: var(--content-color-red);
					background-color: #fffce4;
					border: solid 1px var(--content-color-red);
					margin-bottom: 1vw;
				}
				.stay {
					position: relative;
					padding-left: 6vw;
					&::before {
						font-family: "Material Symbols Rounded";
						font-weight: 700;
						content: "\e53a";
						font-size: 1.3em;
						margin-right: 1vw;
						position: absolute;
						left: 0;
						top: -0.5vw;
						color: #8c8c8c;
					}
				}
				.meal {
					display: block;
					margin-top: 2vw;
					img {
						width: 8vw;
						margin-right: 1vw;
					}
				}
				.note {
					font-size: 0.8em;
					font-weight: normal;
					color: var(--default-color-black);
				}
			}
		}
		.okita {
			position: absolute;
			right: -2vw;
			top: 13vw;
			width: 23vw;
		}
		.bold {
			font-weight: 700;
		}
		.lounge {
			margin-top: 2vw;
			dt {
				font-weight: 700;
			}
		}
		.note {
			font-size: 3.0vw;
			margin-top: 2vw;
		}
	}
	.tour-btn {
		width: 84vw;
		margin: 0 auto;
		text-align: center;
		position: relative;
		a {
			display: block;
			background-color: #ffd800;
			color: #483000;
			border-radius: 10vw;
			font-size: 3.6vw;
			font-weight: 700;
			padding: 3vw 0;
			position: relative;
			&::after {
				font-family: "Material Symbols Rounded";
				font-weight: 400;
				content: "\e5e1";
				font-size: 4vw;
				position: absolute;
				right: 3vw;
				top: 50%;
				transform: translateY(-50%);
			}
		}			
	}
	.tour-btn-text {
		text-align: center;
		padding-top: 8vw;
		font-size: 4.0vw;
		font-weight: 700;
		margin-bottom: 1.5vw;
	}
	.tour-btn-text2 {
		text-align: center;
		padding-top: 8vw;
		font-size: 3.8vw;
		font-weight: 700;
		margin-bottom: 0.5vw;
	}
}
/*カセット調整*/
#tour .ui-static-grid-list {
	margin-bottom: 3vw;
	a {
		background-color: #fff;
	}
	.product-text {
		padding: 3vw 4vw;
	}
	.ui-static-product-card-summary {
		.note {
			display: block;
			font-size: 12px;
			line-height: 1.3;
		} 
	}
	.ui-static-price-container {
		margin-top: 16px;
		padding: 0;
		.ui-static-price-info {
			display: block;
		}
	}
	/*完売*/
	&.kanbai {
		position: relative;
		a {
			cursor: default;
			pointer-events: none;
			position: relative;
			&::before {
				content: "";
				display: block;
				position: absolute;
				left: 0;
				top:0;
				width: 100%;
				height: 100%;
				background-color: rgba(0,0,0,0.3);
				z-index: 100;
			}
			&::after {
				content: "8/3(月) 10:25～再販売予定";
				display: inline-block;
				position: absolute;
				right: 0;
				left: 0;
				top: 80vw;
				width: 70vw;
				margin: 0 auto;
				background-color: #FF0004;
				color: #fff;
				font-size: 4.6vw;
				font-weight: 700;
				text-align: center;
				z-index: 101;
			}
		}
	}
}

/*------------------------------------------------
	販売終了
--------------------------------------------------*/
#tour .end {
	text-align: center;
	font-size: 3.8vw;
}
/*------------------------------------------------
	その他ツアー
--------------------------------------------------*/
#othertour {
	width: 100%;
	padding: 8vw 0;
	background-color: #eeeeee;
	.fukidashi {
		font-size: 4.5vw;
		font-weight: 700;
		text-align: center;
		margin-bottom: 1vw;
	}
	.kanbai {
		font-size: 3.6vw;
		text-align: center;
		margin-bottom: 4vw;
	}
	.btn {
		width: 84vw;
		margin: 0 auto;
		text-align: center;
		position: relative;
		a {
			display: block;
			background-color: #004097;
			border-radius: 10vw;
			font-size: 3.6vw;
			font-weight: 700;
			padding: 3vw 0;
			color: #fff;
			position: relative;
			&::after {
				font-family: "Material Symbols Rounded";
				font-weight: 400;
				content: "\e5e1";
				font-size: 4vw;
				position: absolute;
				right: 3vw;
				top: 50%;
				transform: translateY(-50%);
			}
		}			
	}
}
/*------------------------------------------------
	固定バナー
--------------------------------------------------*/
.fix-bnr {
    display: none;
    position: fixed;
    left: 5px;
	bottom: 55px;
    z-index: 200;
	width: 100px;
	.js-scroll-btn {
		display: block;
		line-height: 0;
	}
	.close {
		position: absolute;
		right: 4px;
		top: 4px;
		font-size: 12px;
		a {
		  display: block;
			span {
				font-size: 14px;
				color: #333;
				background-color: #fff;
				border-radius: 50%;
				padding: 3px;
			}
		}
	}
}

/*------------------------------------------------
	クローズ
--------------------------------------------------*/
#close {
	background-color: #dbf6ff;
    padding: 20vw 0;
    text-align: center;
    font-size: 4.0vw;
    line-height: 1.8;
}
#close a {
    color: #1a7acd;
}