/* CSS Document */
p{color:#1a1a1a;}
#fv-region{
	width: 100%;
	aspect-ratio: 1920 / 1080;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: end;
	height: auto;
	background: #fff;
	padding-top: 12.3%;
}
@media(max-width:1440px){#fv-region{padding-top: 12.7%;}}
@media(max-width:1280px){#fv-region{padding-top: 13%;}}
@media(max-width:960px){#fv-region{padding-top: 14%;}}
@media(max-width:769px){#fv-region{padding-top: 15%;}}
#fv-movie{
	aspect-ratio: 1620 / 800;
	width: 85%;
	margin: auto auto 2%;
	background-color: black;
	color: white;
	display: flex;
	justify-content: center;
	align-items: end;
	z-index: 2;
	display: block;
    border: none;
    outline: none;
}
#fv-movie video{
	margin-bottom: -2px;
}
#fv-region-top-back{
	background-color:#f2efe9;
	position:absolute;
	top:0;
	left: 0;
	width:100%;
	height: 50%;
	z-index: 1;
}
#about {
	display: flex;
	flex-direction: column;
	width:48%;
}

.about-title {
	order: 2;
	margin: 7.5% 0;
	/*letter-spacing: 0.35vw;*/
}
.about-label {
	order: 1;
}
.about-text{
	order: 3;
}
.about-link{
	order: 4;
	width:50%;
	margin-top:10%;
}
#about-wrap{
	width:70%;
	margin: auto;
	padding:7.5% 0;
	display:flex;
	justify-content: space-between;
	align-items: flex-start;
}
#about-img{width:50%;}
/**/
#feature{
	display: flex;
	flex-direction: column;
	width:100%;
	background-color:#f2efe9;
	padding-top: 5%;
	padding-bottom: 5%;
}
#feature h2,#feature p{
	text-align: center;
	text-align-last: center;
}
#feature h2{order:2;margin-bottom:2%;}
#feature p{order:1;}
#feature1{order:3;}
#feature2{order:4;}
#feature3{order:5;}
.feature{color:#8b8c88;}

.feature-1set1,.feature-1set2{
	width:80%;
	margin: 4% auto;
	display:flex;
	justify-content: center;
}
.feature-1set2{
	flex-direction:row-reverse;
}
.feature-txt{
	background-color:white;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width:55%;
	z-index: 2;
	margin-bottom: 6%;
	padding:6%;
}
.feature-img{
	margin-top:6%;
	width:65%;
	z-index: 1;
}
.feature-1set1 .feature-txt{
	margin-right:-2.5%;
}
.feature-1set2 .feature-txt{
	margin-left:-2.5%;
}
.feature-1set1 .feature-img{
	margin-left:-14.5%;
}
.feature-1set2 .feature-img{
	margin-right:-14.5%;
}
.feature-txt h3{
	order:2;
	margin:5% auto 5% 0;
	letter-spacing: 0.2vw;
}
.feature-txt img{
	order:1;
	width:19%;
}
.feature-txt p{
	order:3!important;
	text-align: justify!important;
	text-align-last: left!important;
	font-weight:500;
}
#feature1 p{
	padding-right: 7%;}
#feature2 p{
	padding-right: 9%;}
#feature3 p{
	padding-right: 5%;}
.feature-txt a{
	order:4;
	color:#8b8c88;
	display: flex;
	align-items: center;
	gap: 3%;
	white-space: nowrap;
	margin-top:4%;
}
.feature-txt a img{
	width: 4.5%;
}

.feature-txt a,.feature-txt p,.feature-txt h3,.feature-txt img,.feature-txt span{
	margin-right: auto;
	margin-left: 0;
}
.kochira-button{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 3%;
	white-space: nowrap;
	color: white;
	background-color: #181819;
	border-radius: 50px;
	padding: 2% 10%;
}
.kochira-button img {
	width: 0.6vw;
	transition: all 0.3s;
}

.kochira-button:hover img {
	filter: brightness(0.45) contrast(1.2) grayscale(20%);
}
/**/
#point {
	display: flex;
	flex-direction: column;
	width:50%;
	padding-left: 7%;
}
.point-title {
	order: 2;
	margin: 2.5% 0;
	letter-spacing: 0.1vw;
	line-height: 1.5em;
	display:flex;
	align-items: center;
	justify-content: flex-start;
	column-gap: 2%;
	
}
.point-title img{width:25%;}
.point-label {
	order: 1;
	margin-bottom: 0;
}
.point-text{
	order: 3;
	margin-bottom: 0;
	padding-right: 10%;
}
.point-link{
	order: 4;
	width:fit-content;
	margin-top:5%;
}
#point-wrap{
	width:70%;
	margin: auto;
	padding:10% 0;
	display:flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	align-items: flex-start;
}
#point-img{width:50%;}
/**/
#seen-wrap{
	text-align: center;
}
#seen-slider-wrap{
	display: flex;
    flex-wrap: wrap;
	margin: auto;
	width:70%;
	column-gap: 6%;
	justify-content: center;
	align-items: center;
}
.seen-block{
	background-size:100% 100%;
	aspect-ratio:1/1;
	width:29%;
	position: relative;
}
.seen-block h3{
	position: absolute;
    top: 85%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.seen-shita{
	width:5%;
	margin: 1% auto 4%;
}
/**/

#gallery{
	width:100%;
	aspect-ratio:1920/1080;
	background-size:100% 100%;
	margin: 10% auto;
}

.slider {
	position: relative;
	width: 67%;
	margin: 2.5% auto auto;
	overflow: hidden;
}

.slides {
	display: flex;
	transition: transform 0.6s ease;
}

.slides img {
	width: 100%;
	flex-shrink: 0;
	display: block;
}

.arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	width: 5vw;  /* 矢印画像サイズ */
	height: 5vw;
	transition: opacity 0.3s ease;
	z-index: 1;
}

.arrow:hover {
	opacity: 0.7;
}

.arrow img {
	width: 100%;
	height: auto;
	display: block;
}

.prev { left: 1%; }   /* 画像の外側に出す場合はこの値を調整 */
.next { right: 1%; }
#gallery h2{
	text-align:center;
	padding-top:6.5%;
	font-weight: 500!important;
}
/**/
#news-wrap{
	text-align: center;
	text-align-last: center;
	margin: 10% auto;
	display: flex;
    flex-wrap: wrap;
}
#news-wrap h2,#news-wrap .kimidori,#news-wrap #nashi,#news-wrap #news-more{
	text-align: center;
	text-align-last: center;
	width:100%;
}
#news-wrap h2{
	order:2!important;
	margin: 1% auto;
}
#news-wrap .kimidori{
	order:1!important;
}
#news-wrap #toukou-wrap{
	order:3;
	width:70%;
	margin: 4% auto;
	background-color:#f2f2f2;
	padding: 3%;
}
#news-wrap #nashi{
	order:3;
}
#news-wrap #news-more{
	order: 4;
    width: 20%;
    margin: 0 40%;
	padding: 1% 0;
}
.news-region{
	display:flex;
	justify-content: space-between;
	align-items: baseline;
	border-bottom: 1px solid #8b8c88;
	width:90%;
	margin: auto;
	padding-bottom: 3%;
	margin-bottom:3%;
}
.news-region p{
	line-height: 1em;
	margin-bottom:0;
}
.news-ymd{width:15%;}
.news-titile{width:80%;}
.news-region img{
	width:1%;
	margin-right: 2%;
}
.news-region:last-of-type{
	border-bottom:unset;
	padding-bottom:0;
	margin-bottom:0;
}
/**/
#access-wrap{
	text-align:center;
	display: flex;
    flex-wrap: wrap;
	width:100%;
	margin-bottom: 10%;
}
#access-wrap h2,#access-wrap .kimidori,#access-wrap #address{
	display: block;
	width:100%;
	text-align: center;
	text-align-last: center;
}
#access-wrap h2{
	order:2!important;
	margin:1% auto;
}
#access-wrap .kimidori{
	order:1!important;
}
#access-wrap #address{
	order:3;
	margin:5% auto;
}
#access-flex{
	order:4;
	width:70%;
	margin: auto;
	display: flex;
	justify-content: space-around;
}
.access-flex-chi{
	background-color:#d9d0c1;
	border-radius:50%;
	aspect-ratio:1/1;
	width:27%;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 3vw;
}
/**/
#googlemap-wrap{
	width:100%;
	aspect-ratio:1920/722;
}
#googlemap-wrap iframe{
	width:100%;
	height:100%;
	vertical-align: bottom;
}
@media(max-width:750px){
	#fv-region{
		aspect-ratio:unset;
		padding-top:15vw;
	}
	#fv-movie{
		width:100%;
		height: auto;
		margin: auto;
		/* aspect-ratio:800/1150; */
		aspect-ratio:auto;
	}
	/*******************************/
	#about-wrap{
		width:100%;
		display: block;
		padding:15% 0 0;
	}
	.about-text{letter-spacing:0.2vw;}
	.about-title{
		margin: 10% 0;
		letter-spacing: 1vw!important;
	}
	#about{
		width:100%;
		padding: 0 10%;
	}
	#about-img{
		width:100%;
	}
	.about-link {
		width: 60%;
		margin: 10% 0;
	}
	.kochira-button{padding:2% 10%!important;}
	.kochira-button img {
		width: 1.5vw;
	}
	/*******************************/
	#feature{
		padding-top:15%;
		padding-bottom:10%;
	}
	.feature-txt img {
		width: 21%;
	}
	#feature h2 {
		margin: 2.5% auto 5%;
	}
	.feature-txt h3{white-space: nowrap;letter-spacing: 0.5vw;}
	.feature-txt p {
		padding-right: 0!important;
		letter-spacing: -0.1vw;
		line-height: 5.5vw;
	}
	/*.feature-txt .fs24{
		font-size:3vw!important;
	}*/
	.feature-1set1,.feature-1set2{
		width:100%;
		display:block;
	}
	.feature-img{width:90%;}
	.feature-txt{width:92.5%;}
	
	.feature-txt a{margin-top:3%;}
	.feature-txt {
		margin-bottom: 0;
		position: relative;
		padding: 10% 7.5%;
	}
	.feature-img {
		margin-top: -8%;
		position: relative;
	}
	.feature-1set2 .feature-txt a img{    width: 2.5%;}
	
	/*FEATURE1と3の画像*/
	.feature-1set1 .feature-img{
		margin-left:auto;
		margin-right:0;
		display: block;
	}
	
	/*FEATURE2の画像*/
	.feature-1set2 .feature-img{
		margin-left:0;
		margin-right:auto;
		display: block;
	}
	
	/*FEATURE1と3のテキスト*/
	.feature-1set1 .feature-txt{
	}	
	/*FEATURE2のテキスト*/
	.feature-1set2 .feature-txt{
		margin-left: auto;
		margin-right: 0;
	}
	/*******************************/
	#point-wrap{
		width:80%;
		display:block;
	}
	#point{padding-left:0;}
	#point,#point-img{width:100%;}
	.point-title{
		justify-content:space-between;
		margin: 0 0 2.5%;
		line-height: 1.75em;
	}
	.point-text{padding-right:0;}
	.point-link{
		margin-top:6%;
		margin-bottom:10%;
	}
	/*******************************/
	.seen-shita {
		width: 11%;
		margin: 1% auto 5%;
	}
	.point-title img {
		width: 30%;
		margin-right: 5%;
	}
	#seen-slider-wrap{
		overflow: hidden;
		width:100%;
	}

	#seen-slider-inner{
		display: flex;
		gap: 10px;
		width: max-content;
		animation: scroll-left 20s linear infinite;
	}

	@keyframes scroll-left{
		0% { transform: translateX(0); }
		100% { transform: translateX(-50%); } /* 複製分だけ流す */
	}

	.seen-block{
		flex: 0 0 auto;
		padding: 10vw;
		width:20%;
	}
	/*******************************/
	#gallery {
		aspect-ratio: 800 / 660;
	}
	#gallery h2 {
		padding-top: 10%;
		margin-bottom: 0;
	}
	.slider {
		position: relative;
		width: 90%;
		margin: 6.5% auto auto;
	}
	.arrow {
		width: 10vw;
		height: 10vw;
	}
	/*******************************/
	#news-wrap h2 ,#access-wrap h2 {
		margin: 3% auto 5%;
	}
	#news-wrap #toukou-wrap {
		width: 90%;
	}
	#news-wrap #news-more {
		width: 50%;
		margin: 7.5% auto 5%;
	}
	#news-wrap #toukou-wrap {
		order: 3;
		width: 90%;
		padding: 7.5% 5%;
	}
	.news-region {
		justify-content: flex-start;
		width: 100%;
		margin: auto;
		padding-bottom: 5%;
		margin-bottom: 5%;
	}
	.news-ymd {
		width: 25%;
	}
	.news-titile {
		width: 68%;
		margin-left: 2%;
	}
	.news-region img {
		width: 2.5%;
		margin-right: 0%;
		margin-left: 2%;
	}
	.news-region .fs30{font-size:4vw!important;}
	/*******************************/
	#access-flex{
		flex-wrap:wrap;
		width:85%;
		justify-content: space-between;
	}
	#access-flex .fs36{
		font-size: 4.5vw;
		line-height: 7vw;
	}
	#access-flex .access-flex-chi:first-child{
		width: 48%;
		display: flex;
		justify-content: center;
		margin: auto 25%;
	}
	.access-flex-chi{
		width: 48%;
	}
	#address{
		line-height:7vw;
		margin: 5% auto 10%!important;
	}
	/*******************************/
	#googlemap-wrap {
		aspect-ratio: 800 / 722;
	}

}