@charset "utf-8";
/*
Theme Name: asakura-garden-villa
Author: YES-REFORM CO., LTD.
*/

/* Body
========================================== */
html, body{
	width: 100%;
	font-size:62.5%;/*10px*/
}
body {
	color: #000;
	line-height:2.2;
	letter-spacing: 0.2em;
	/* letter-spacing: 5px; */
	font-size:1.6rem;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}
body.sub{
	margin-top: 20vh;
}
body.sub .mvWrap{
	display: none;
}
body.sub .mvWrap .mvInner{
	width: 100%;
	height: 80vh;
}

@media screen and (max-width:1280px) {
	body.sub::before{
		left: 10%;
	}
	body.sub .headerArea {
		top: 0;
	}
}
@media screen and (max-width:1000px){
	body{
		letter-spacing: 2px;
	}
}
@media screen and (max-width: 840px) {
	body{
		word-wrap:break-word;
		font-size: 1.6rem;}
	body.sub{
		margin-top: 15vh;
	}
	body.sub::before{
		content: none;
	}
}
@media screen and (max-width: 599px){
	body.sub{
		margin-top: 10vh;
	}
	.contents.sub {
		top: 3vh;
	}
}

.pc{display: block;}
.sp,.tablet{display: none;}
.pc_sp{display: block;}
.sp_pc{display: none;}
@media screen and (max-width: 1200px) {
	.pc{display: none !important;}
	.tablet{display:block!important;}
}
@media screen and (max-width: 840px) {
	.sp{display: block !important;}
	
}
@media screen and (max-width: 599px) {
	.pc_sp{display: none;}
	.sp_pc{display: block;}
}


/* headerArea
========================================== */
.headerInner{
	display: flex;
	align-items:flex-start;
}
.sub .headerInner::before{
	content: '';
	position: absolute;
	top: 0;
	left: 120px;
	width: 1px;
	height: 100%;
	background: #e5e5e5;
}
.headerArea{
	z-index: 1001;
	position: fixed;
	top: 0;
	left: 0;
	width: 120px;
	height: 100vh;
	min-height: 730px;
	background: #fff;
}
.headerArea::before{
	content: '';
	position: absolute;
	bottom: -100%;
	width: 120px;
	height: 100%;
	background-color: #fff;
}
.headerArea::after{
	content: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 120px;
	height: 100vh;
}
.headerArea.is-active::after{
	content: '';
	box-shadow: 15px 0 30px rgba(0, 0, 0, 0.06);
}
.sub .headerArea::after{
	content: none;
}
.headerArea .headerLogo{
	display: flex;
	justify-content: center;
	margin: 30px auto;
	padding: 0 15px;
}
.headerArea .headerLogo img{
	width: 100%;
	height: auto;
}
.gnav{
	position: relative;
	z-index: 999;
}
.gnav ul li{
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
}
.gnav ul li a{
	position: relative;
	display: block;
	padding: 30px 0 0;
	letter-spacing: 3px;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	-o-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	box-sizing: border-box;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: 2rem;
	font-weight: 500;
	color: #B2B2B2;
	border-left: 2px solid #fff;
	text-align: center;
	text-decoration: none;
	transition: 0.3s;
}
.gnav ul li a span{
	position: relative;
}
.gnav ul li a:hover span{
	color: #333;
}
.gnav ul li a:hover span::before{
	content:'';
	position: absolute;
	top: -3px;
	left: 0;
	width: 2px;
	height: 100%;
	background: #cbcbcb;
}
.gnav ul li.wide a{
	letter-spacing: 10px;
}
.gnav .submenu{
	position: relative;
	text-align: center;
	letter-spacing: -5px;
	transition: 0.3s;
	z-index: 9999;
}
.gnav .submenu span{
	padding: 30px 0;
	cursor: pointer;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	-o-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	box-sizing: border-box;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: clamp(2rem, 3vw, 2.4rem);
	font-weight: 500;
	letter-spacing: -10px;
	color: #B2B2B2;
}
.gnav .submenu .submenuBox{
	display: flex;
	position: absolute;
	top: -15px;
	left: 120px;
	padding: 8px 10px 8px 0;
	background: #fff;
	visibility: hidden;
	z-index: 0;
	opacity: 0;
}
.gnav .submenu:hover .submenuBox {
	z-index: 1;
	visibility: visible;
	opacity: 1;
	transition: 0.3s;
	background: #fff;
	border: 1px solid #e5e5e5;
	border-left: none;
	opacity: 1;
}
.gnav .submenu .submenuBox a{
	padding: 0;
}
.gnav .submenu .submenuBox span{
	padding: 10px 0;
	letter-spacing: 2px;
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	-o-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	box-sizing: border-box;
	font-family: "Zen Kaku Gothic New",
	sans-serif;
	font-size: clamp(1.6rem, 3vw, 1.8rem);
	font-weight: 500;
	color: #B2B2B2;
}
.gnav .submenu .submenuBox a:hover span{
	color: #333;
}
.gnav .submenu .submenuBox a:hover span::before{
	content: none;
}

.contactMenu {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 120px;
	z-index: 1002;
	background: #fff;
	border-top: 1px solid #e5e5e5;
}
.contactMenu li {
	position: relative;
	display: flex;
	justify-content: center;
}
.contactMenu li.contact {
	border-bottom: 1px solid #e5e5e5;
}
.contactMenu li.reserve {
	background: #231815;
}
.contactMenu li.contact:hover {
	background: #231815;
}
.contactMenu li.reserve:hover {
	background: #fff;
}
.contactMenu li a {
	padding: 50px 0 60px;
	letter-spacing: 1px;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: 2rem;
	font-weight: 500;
	color: #333;
	text-align: center;
	text-decoration: none;
	transition: 0.3s;
}
.contactMenu li.reserve a {
	color: #fff;
}
.contactMenu li:hover a {
	padding: 40px 0 70px;
	color: #fff;
}
.contactMenu li.reserve:hover a {
	color: #333;
}
.contactMenu li a::after {
	content: '';
	position: absolute;
	top: 70%;
	left: calc(50% - 5px);
	width: 10px;
	height: 10px;
	border: 0;
	border-bottom: solid 2px #cbcbcb;
	border-right: solid 2px #cbcbcb;
	transform: rotate(45deg);
	transition: 0.3s;
}
.contactMenu li:hover a::after {
	top: 73%;
}
.contactBnr{
	display: none;
}

.spBtn{display: none}
.drawerMenu{display: none;}

@media screen and (max-height: 1000px){
	.headerArea .headerLogo{
		width: 100%;
		margin: 20px auto;
		padding: 0 2em;
	}
	.headerArea .headerLogo img{
		width: 100%;
		height: auto;
	}
	.gnav ul li a{
		height: auto;
		padding: 0.5em 0;
		font-size: clamp(1.6rem, 3vw, 1.8rem);
		letter-spacing: 2px;
	}
	.gnav ul li.wide a {
		letter-spacing: 5px;
	}
	.gnav .submenu{
		letter-spacing: -12px;
	}
	.gnav .submenu span {
		height: auto;
		padding: 0.5em 0 1em;
	}
	.gnav .submenu .submenuBox{
		top: -31px;
		left: 119px;
	}
	.gnav .submenu .submenuBox span{
		font-size: 1.6rem;
	}
	.contactMenu {
		width: 100%;
	}
	.contactMenu li a{
		padding: 30px 0 35px;
		font-size: clamp(1.6rem, 3vw, 1.8rem);
	}
	.contactMenu li:hover a {
		padding: 25px 0 40px;
	}
}
@media screen and (max-width:1000px) {
	/* .contactMenu {
		bottom: auto;
	} */
}
@media screen and (max-width:840px){
	.headerArea{
		background: none;
	}
	.headerArea::before,
	.headerArea::after{
		content: none;
	}
	.headerArea.is-active::after {
		content: none;
	}
	.headerArea {
		width: 100%;
		height: auto;
		min-height: auto;
	}
	.headerArea.is-scroll {
		background-image: url('images/hed_bg_sp.png');
	background-repeat: repeat-x;
		
	}
	.sub .headerInner::before{
		content: none;
	}
	.headerArea .headerLogo{
		justify-content: flex-start;
		/* margin: 10px auto; */
		margin: 15px 0 0px 15px;
		padding: 0;
	}
	.headerArea .headerLogo img{
		width: auto;
		height: auto;
		max-height: 110px;
		padding-bottom: 15px;
	}
	/* .headerArea .headerLogo.is-scroll{
		display: none;
	} */
	.headerInfo,
	.gnav,
	.contactMenu{
		display: none;
	}
	.drawerMenu{}
	.drawerMenu{
		display: block;
		position: fixed;
		top: 0;
		right: -100%;
		padding: 140px 20px 60px;
		width: 100%;
		height: 100%;
		background-color: #666;
		color: #fff;
		transition: 0.5s;
		z-index: 5000;
	}
	.drawerMenu.open{right: 0;}

	.drawerMenu::-webkit-scrollbar{width: 10px;}
	.drawerMenu::-webkit-scrollbar-track{background: #fff;}
	.drawerMenu::-webkit-scrollbar-thumb {background: #fff;}
	.gnavSp{
		margin-bottom: 20px;
		padding:1em 10px;
	}
	.gnavSp li{
		margin-bottom: 1em;
		border-bottom: 1px solid #cbcbcb
	}
	.gnavSp li a{
		position: relative;
		display: block;
		padding: 0 0.5em 0.3em;
		color: #fff;
		font-size: 1.6rem;
		letter-spacing: 3px;
		text-decoration: none;
	}
	.gnavSp li a::before {
		content: '';
		width: 0.6em;
		height: 0.6em;
		border: 0;
		border-top: solid 2px #fff;
		border-right: solid 2px #fff;
		transform: rotate(45deg);
		position: absolute;
		top: 0;
		right: 0.5em;
		bottom: 0;
		margin: auto;
		transition: .3s;
	}
	.gnavSp li a:hover{
		text-decoration: none;
	}
	.gnavLogo{
		position: absolute;
		top: 20px;
		left: 0px;
		display: flex;
		justify-content: center;
		width: 100%;
		max-width: 80px;
		padding: 0 10px;
		margin: 0 10px;
	}
	.gnavLogo img{
		width: 100%;
		height: auto;
	}
	.gnavBtn{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.gnavBtn li{
		width: 48%;
	}
	.gnavBtn li a{
		display: block;
		padding: 0.5em 1em;
		background-color: #241814;
		color: #fff;
		text-align: center;
		text-decoration: none;
		transition: .3s;
	}
	.gnavBtn li a:hover{
		background-color: #919193;
	}
	.gnavBtn li.contact a{
		background-color: #fff;
		color: #241814;
	}
	.gnavBtn li.contact a:hover{
		background-color: #919193;
		color: #fff;
	}
	.gnavInsta{
		text-align: center;
	}
	.gnavInsta .img {
		width: 40px;
		margin: 30px auto 10px;
	}
	.gnavInsta .img img{
		width: 100%;
	}
	.gnavInsta p{
		font-size: 1.4rem;
		line-height: 1.6;
	}
	.spBtn{
		position:fixed;
		top: 0;
		right: 0;
		display: inline-block;
		width: 65px;
		height: 65px;
		padding: 20px 20px 15px 10px;
		cursor: pointer;
		z-index: 9999;
	}
	.spBtn div {position: relative;}
	.spBtn span {
		display: block;
		position: absolute;
		height: 3px;
		width: 100%;
		background: #231815;
		left: 0;
		-webkit-transition: .3s ease-in-out;
		-moz-transition: .3s ease-in-out;
		transition: .3s ease-in-out;
	}
	.spBtn span:nth-child(1) {top: 0;}
	.spBtn span:nth-child(2) {top: 12px;}
	.spBtn span:nth-child(3) {top: 24px;}
	.spBtn.open span:nth-child(1) {
		top: 12px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		transform: rotate(45deg);
		background: #fff;
	}
	.spBtn.open span:nth-child(2) {
		width: 0;
		left: 50%;
		background: #fff;
	}
	.spBtn.open span:nth-child(3) {
		top: 12px;
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
		background: #fff;
	}
	.contactBnr {
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: fixed;
		bottom: 0;
		width: 100%;
		padding: 1em 3em;
		background-color: #f7f7f7;
		z-index: 999;
	}
	.contactBnr li {
		width: 48.5%;
	}
	.contactBnr li a{
		display: block;
		padding: 0.8em 1em;
		background-color: #251714;
		color: #fff;
		text-align: center;
		text-decoration: none;
		transition: .3s;
		border: 1px solid #251714;
	}
	.contactBnr li a:hover{
		background-color: var(--c-pink);
		color: #251714;
	}
	.contactBnr li.contact a{
		background-color: #fff;
		color: #251714;
	}
	/* .contactBnr li.contact a:hover {
		background-color: var(--c-yellow);
	} */
	.contactBnr li a span{
		font-size: 2rem;
		letter-spacing: 5px;
	}
}
@media screen and (max-width:840px) {
	/* .sub .headerArea .headerLogo {
		display: none;
	} */
}
@media screen and (max-width:599px){
	.headerArea .headerLogo{
		width: 100px;
		/* margin: 10px 20px;
		padding: 0; */
	}
	.contactBnr li a{
		font-size: 1.6rem;
	}
	.drawerMenu.open{
		padding-bottom: 30%;
	}
	.contactBnr{
		padding: 1em;
	}
	.contactBnr li a{
		padding: 0.6em 1em;
	}
	.contactBnr li a span {
		font-size: 1.6rem;
	}
}
@media screen and (max-width:390px){
	.headerArea .headerLogo{
		width: 100px;		
	}
	.contactBnr li a span {
		font-size: 1.6rem;
	}
}
@media screen and (max-width:320px){
	.headerArea .headerLogo{
		width: 100px;
	}
}


/* mv
========================================== */
.mvWrap{
	position: relative;
	width: calc(100% - 120px);
	left: 120px;
}
.mvWrap .mvText {
	position: absolute;
	left: 10%;
	/* left: 20%; */
	bottom: -14.2em;
	/* bottom: -11.2em; */
	z-index: 2;
}
.mvWrap .mvText h1 {
	letter-spacing: 10px;
	font-size: clamp(5.2rem, 6vw, 10rem);
	/* font-size: clamp(8rem, 3vw, 11.6rem); */
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 600;
	line-height: 1.6;
}
.mvWrap .mvText span {
	border-bottom: 1px solid #fff;
}
.mvWrap .mvText P {
	letter-spacing: 2px;
	font-size: min(1.5vw, 1.4rem);
}
.mvWrap .mvInner{
	width: 100%;
	aspect-ratio: 1800 / 820;
	max-height: 80vh;
}
.mvWrap .mvInner>video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.scroll_down {
	position: absolute;
	bottom: 5%;
	right: 10%;
	animation: arrowmove 2.2s ease-in-out infinite;
	z-index: 999;
}
.scroll_down a {
	position: absolute;
	left: -24px;
	bottom: 17px;
	margin-bottom: 0.5em;
	color: #fff;
	font-size: clamp(2rem, 3vw, 2.2rem);
	font-weight: 200;
	letter-spacing: 2px;
	writing-mode: vertical-rl;
	text-decoration: none;
	text-transform: uppercase;
}
.scroll_down:before{
	content: "";
	position: absolute;
	bottom: 5px;
	left: -1px;
	width: 2.8px;
	height: 18px;
	background: #fff;
	transform: skewX(48deg);
}
.scroll_down:after{
	content: "";
	position: absolute;
	bottom: 5px;
	left: 0.6em;
	width: 2px;
	height: 6.6em;
	background: #fff;
}
@keyframes arrowmove {
	0% {
		bottom: 5%;
	}
	50% {
		bottom: 1%;
	}
	100% {
		bottom: 5%;
	}
}

@media screen and (max-width: 1650px){
	.mvWrap .mvText {
		bottom: -13.5vw;
	}
}
@media screen and (max-width: 1280px){
	/* .mvWrap .mvText {
		left: 10%;
		bottom: -15.7vw;
	} */
	/* .mvWrap .mvText h1 {
		font-size: clamp(5.7rem, 6.2vw, 8rem);
		letter-spacing: 5px;
		line-height: 1.8
	} */
}
@media screen and (max-width:840px){
	.mvWrap{
		width: 100%;
		left: 0;
	}
	.mvWrap .mvInner{
		width: 100%;
		height: 70vh;
		z-index: 1;
	}
	.mvWrap .mvText{
		display: none;
	}
}
@media screen and (max-width:390px){
	.mvWrap .mvInner{
		height: 66vh;
	}
}
@media screen and (max-width:320px){
	.mvWrap .mvInner{
		height: 58vh;
	}
}

/* sub mv
------------------------------------------ */
.mvArea {
	position: relative;
	width: 100%;
}
.mvArea .mvInner {
	position: relative;
	width: 100%;
	height: 44vw;
	max-height: 620px;
	overflow: hidden;
}
.mvArea .mvInner>video {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	min-width: 100%;
	min-height: 100%;
}
@media screen and (max-width:840px) {
	/* .mvArea,
	.mvArea .mvInner{
		width: 100%;
		margin-left: 0;
	} */
	/* .mvArea .mvInner{
		height: 85vh;
	} */
}
@media screen and (max-width:599px) {
	.mvArea .mvInner {
		height: 60vh;
	}
}


/* contents
========================================== */
.contents{
	position: relative;
	overflow: hidden;
	margin:0 auto;
	width:100%;
	padding-left: 120px;
}
.contents::before {
	content: '';
	position: absolute;
	top: 0;
	left: 120px;
	width: 1px;
	height: 100%;
	background: #e5e5e5;
}
.contentsInner{
	position: relative;
}
.contents p+p{
	margin-top: 1.5em;
	font-family: "Noto Sans JP", sans-serif;
}
.Inner{
	max-width: 1300px;
	width: 100%;
	margin: 0 auto;
	padding: 0 80px;
}
.sub .Inner{
	max-width: 1300px;
	/* max-width: 1024px; */
	width: 100%;
	margin: 0 auto;
}
.sub .Inner.p-404{
	padding: 80px 0;
}
.contentsBox{
	display: flex;
	justify-content: space-between;
	column-gap: 1em;
}
.contentsBox .txt .ttlType02 {
	margin: 2.5em 0 0.4em;
}
.contentsBox .txt{
	width: 46%;
}
.contentsBox .txt p{
	line-height: 2;
}
.contentsBox .img{
	width: 54%;
}
.contentsBox .img img{
	width: 100%;
}
.designArea .contentsBox .img img,
.accessArea .contentsBox .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media screen and (max-width:1280px){
	.Inner {
		max-width: 100%;
	}
	.sub .Inner {
		max-width: 100%;
		padding: 0 80px;
	}
	.sub .Inner.p-404{
		padding: 100px 80px;
	}
	.topArea .Inner{
		max-width: 70%;
	}
	.designArea .contentsBox .txt,
	.accessArea .contentsBox .txt{
		width: 56%;
	}
	.designArea .contentsBox .img,
	.accessArea .contentsBox .img{
		width: 44%;
	}
}
@media screen and (max-width:1000px){
	.contentsBox {
		display: block;
	}
	.contentsBox .txt,
	.contentsBox .img{
		width: 100%;
	}
	.designArea .contentsBox .txt,
	.accessArea .contentsBox .txt{
		width: 100%;
	}
	.designArea .contentsBox .img,
	.accessArea .contentsBox .img{
		width: 100%;
	}
}
@media screen and (max-width:840px){
	.contents{
		padding-left: 0;
	}
	.contents::before{
		content: none;
	}
	.sub .Inner {
		padding: 0 8%;
	}
	.sub .Inner.p-404{
		padding: 8% 8%;
	}
}
@media screen and (max-width:599px){
	.Inner {
		margin: 0;
		padding: 0 20px;
	}
	.sub .Inner{
		padding: 0 20px;
	}
	.sub .Inner.p-404{
		padding: 50px 20px;
	}
	.contentsBox .txt .ttlType02{
		font-size: 2rem;
	}
	.contentsBox .txt p {
		font-size: 1.4rem;
		line-height: 1.8;
	}
}

/* topArea
========================================== */
.topArea{
	position: relative;
	display: flex;
	justify-content: center;
	width: 100%;

}
.topArea .Inner {
	position: relative;
	max-width: 760px;
	margin: 0 auto;
	z-index: 999;
}
.topArea::before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

}
.topTtl{
	margin-bottom: 5rem;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: clamp(3rem, 3vw, 3.6rem);
	font-weight: 500;
	line-height: 1.8;
	letter-spacing: 5px;
}
.topArea p{
	font-size: 1.6rem;
}
@media screen and (max-width:1280px){
	/* .topArea{
		padding: 20% 0 100px;
	} */
	/* .topArea .Inner{
		max-width: 70%;
	} */
}
@media screen and (max-width:1000px) {
	/* .topArea {
		padding: 30% 0 100px;
	} */
	.topArea .Inner{
		max-width: 100%;
		padding: 10%;
	}
}
@media screen and (max-width:840px) {
	.topArea {
		padding: 30px 0 100px;
	}

}
@media screen and (max-width:599px){
	.topArea {
		padding: 30px 0 50px;
	}
	.topArea .Inner {
		max-width: 100%;
		padding: 0 20px;
	}
	.topArea::before{
		
	}

	.topArea .mainTitle .narrow{
		letter-spacing: 0;
	}
	.topTtl{
		margin-bottom: 2rem;
		font-size: 2rem;
		letter-spacing: 0.15em;
	}
	.topArea p{
		font-size: 1.4rem;
		line-height: 2;
	}
}
@media screen and (max-width:360px) {
	.topArea {
		padding: 20px 0 50px;
	}
	.topArea h1 {
		margin-bottom: 30px;
		letter-spacing: 2px;
	}
}
@media screen and (max-width:320px) {
	.topTtl {
		margin-top: 0.5em;
		margin-bottom: 2rem;
		font-size: 1.8rem;
	}
	.topArea p br{
		display: none;
	}
}


/* newsArea
========================================== */
.newsArea{
	padding: 54px 0;
	background-color: #f6f6f6;
}
.sub .newsArea{
	padding: 50px 0 300px;
	background-color: unset;
}
.newsArea .contentsBox{
	align-items: center;
}
.newsTtl{
	width: 280px;
	font-family: "Noto Sans", sans-serif;
	font-size: 2.8rem;
	/* font-size: clamp(3.6rem, 3vw, 4.2rem); */
	font-weight: 500;
	color: #cbcbcb;
}
.newsList{
	width: calc(100% - (280px + 1em));
	/* width: 800px; */
}
.sub .newsList{
	width: 100%;
}
.newsList li{
	margin-bottom: 10px;
}
.newsList li a{
	position: relative;
	display: block;
	padding: 1em 4em 1em 2em;
	text-decoration: none;
	border-bottom: 1px solid #dfdfdf;
}
.newsList li a::before{
	content: "";
	position: absolute;
	top: 50%;
	/* top: calc(50% - 1.5px); */
	right: 1.5em;
	transform: translateY(-50%);
	width: 45px;
	height: 2px;
	margin-top: 0px;
	background-color: #666666;
	transition: 0.3s;
}
.newsList li a::after{
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	/* top: calc(50% - 1.5px); */
	right: 1.5em;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 9px solid #555555;
	border-right: 0;
	/* width: 15px;
	height: 15px;
	margin-top: -6px; */
	/* transform: rotate(45deg); */
	/* border-top: 2px solid #666666;
	border-right: 2px solid #666666; */
	vertical-align: middle;
	transition: 0.3s;
}
.newsList li a:hover::before,
.newsList li a:hover::after{
	right: 0.5em;
}
.newsList dl{
	display: flex;
	align-items: center;
	font-family: "Zen Kaku Gothic New", sans-serif;
}
.newsList dl dt{
	letter-spacing: 2px;
	font-size: clamp(1.6rem, 3vw, 2rem);
	font-weight: 200;
	color: #808080;
}
.newsList dl dd{
	padding-left: 4rem;
	font-size: clamp(1.8rem, 1.8vw, 2.2rem);
	line-height: 1.6;
}
.newsBox{
	margin-bottom: 1em;
	padding: 3em;
	border: 1px solid #cbcbcb;
}
.newsInfo .date{
	letter-spacing: 2px;
	font-size: clamp(1.6rem, 3vw, 2rem);
	font-weight: 200;
	color: #808080;
}
.newsTxt{
	margin-top: 1em;
}
.newsSignature{
	margin-top: 2em;
	padding: 2em;
	background-color: #e5e5e5;
}

@media screen and (max-width:1200px){
	.newsList li a::before{
		width: 30px;
	}
	/* .newsList li a::after{
		width: 10px;
		height: 10px;
		margin-top: -3.5px;
	} */
}
@media screen and (max-width:1000px){
	.newsList {
		width: 100%;
	}
	.newsList dl dd{
		font-size: clamp(1.8rem, 3vw, 2.2rem);
	}
}
@media screen and (max-width:840px) {
	.newsList li a{
		padding: 1em 4em 1em 0em;
	}
}
@media screen and (max-width:599px){
	.newsArea{
		padding: 25px 0 40px;
	}
	.sub .newsArea {
		padding: 0 0 80px;
	}
	.newsList li {
		margin-bottom: 5px;
	}
	.newsList li a{
		padding: 0.5em 2.5em 0.5em 0;
	}
	.newsList li a::before {
		width: 20px;
		/* top: calc(70% - 1.5px); */
		right: 1em;
	}
	.newsList li a::after{
		/* top: calc(70% - 1.5px); */
		right: 1em;
	}
	.newsList li a:hover::before,
	.newsList li a:hover::after {
		right: 0;
	}
	.newsList dl {
		display: block;
	}
	.newsList dl dt {
		line-height: 1.6;
	}
	.newsList dl dd {
		padding-left: 0;
		font-size: 16px;
		line-height: 1.8;
	}
	.newsBox{
		padding: 1em 1.5em 1.5em;
	}
	.newsSignature{
		padding: 1em 1.5em;
		font-size: 1.4rem;
	}
	.newsTxt{
		font-size: 1.4rem;
	}
}
@media screen and (max-width:390px){
	.newsList li a {
		padding: 1em 2.5em 1em 0em;
	}
}


/* designArea
========================================== */
.designArea{
	padding: 100px 0 100px;
	background-size: contain;
}
.designArea .contentsBox .txt{
	padding-right: 45px
}
.designArea .contentsBox .img{
	aspect-ratio: 72 / 50;
	overflow: hidden;
}
.designArea .contentsBox .img video{
	width: auto;
	height: 100%;
}
.designArea .btnMore{
	margin-top: 1.8em;
}
.designImg{
	display: flex;
	justify-content: flex-end;
	margin: 100px auto 30px;
}
.designImg li{
	width: 34%;
}
.designImg li:last-child{
	padding: 120px 0 0 24px;
}
.designImg li img{
	width: 100%;
}

@media screen and (max-width:1280px){
	.designArea{
		padding: 150px 0 100px;
	}
	.designArea .contentsBox .txt{
		padding-right: 2.6em;
	}
}
@media screen and (max-width:1000px){
	.designArea {
		padding: 100px 0;
	}
	.designArea .contentsBox .txt{
		margin-bottom: 50px;
		padding-right: 0;
	}
	.designImg{
		margin: 50px auto 30px;
	}
	.designImg li{
		width: 50%;
	}
	.designImg li img{
		width: 100%;
	}
}
@media screen and (max-width:599px){
	.designArea {
		padding: 50px 0;
		background: none;
	}
	.designArea .ttlMain{
		margin-bottom: 60px;
	}
	.designArea .contentsBox .txt{
		margin-bottom: 20px;
	}
	.designArea .contentsBox .txt .ttlType02{
		margin: 1em 0 0.8em;
		line-height: 1.8;
	}
	.designArea .btnMore{
		display: flex;
		justify-content: center;
	}
	.designArea .contentsBox .img{
		aspect-ratio: 72 / 60;
	}
	.designImg{
		margin: 20px auto 0;
		justify-content: space-between;
	}
	.designImg li{
		width: 48%;
	}
	.designImg li:last-child{
		padding: 0;
	}
	.designArea .btnMore{
		margin-top: 3.5em;
	}
}


/* accessArea
========================================== */
.accessArea{
	padding: 0px 0 80px;
}
.accessArea .contentsBox .txt{
	padding-left: 45px;
}
.accessArea .btnMore {
	margin-top: 1.8em;
}
.accessImg{
	display: flex;
	justify-content: space-between;
	margin: 100px auto 30px;
}
.accessImg li {
	width: 32.5%;
}
.accessImg li img{
	width: 100%;
}

@media screen and (max-width:1280px){
	.accessArea {
		padding: 0px 0 80px;
	}
	.accessArea .contentsBox .txt{
		padding-left: 2.6em;
	}
}
@media screen and (max-width:1000px){
	.accessArea {
		padding: 0px 0 80px;
	}
	.accessArea .contentsBox .txt {
		margin-top: 0px;
		padding-left: 0;
	}
	.accessImg{
		margin: 50px auto 20px;
	}
}
@media screen and (max-width:599px){
	.accessArea {
		padding: 0px 0 60px;
	}
	.accessArea .ttlMain {
		margin-bottom: 60px;
	}
	.accessArea .contentsBox .txt .ttlType02 {
		margin: 1em 0 0.8em;
		line-height: 1.8;
	}
	.accessImg {
		margin: 20px auto 0;
		justify-content: space-between;
	}
	.accessImg li {
		width: 48%;
	}
	.accessImg li:last-child {
		padding: 0;
	}
	.accessArea .btnMore {
		display: flex;
		justify-content: center;
		margin-top: 3.5em;
	}
}


/* reviewArea
========================================== */
.reviewAreaWrap{
	position: relative;
}
.reviewArea{
	position: relative;
	padding: 55px 0 50px;
	background-image: linear-gradient(90deg, transparent, #f6f6f6 50%, transparent);
	z-index: -1;
}
.reviewArea::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(90deg, #ffffff, #ffffff80 10%, transparent 20% 100%);
	z-index: 2;
}
.reviewArea::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(90deg, #ffffff33, transparent 80%, #ffffff);
	z-index: 1;
}
.reviewSlider ul li{
	padding: 1em 1.6em 2em;
	border: 1px solid #c7c7c7;
	border-radius: 10px;
}
.reviewSlider dl{
	width: 100%;
	/*height: 385px;*/
	overflow: hidden;
}
.reviewSlider dl dt{
	padding: 0 0.5em;
	font-size: clamp(2.2rem, 3vw, 2.8rem);
}
.reviewSlider dl dd{
	font-size: clamp(1.4rem, 2.6vw, 1.6rem);
	line-height: 1.8;
}
.reviewSlider .star{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 2em;
	padding-left: 0.4em;
}
.reviewSlider .star span{
	margin-right: 0.6em;
	width: 18px;
	height: 18px;
	background: url(images/review_star.png) no-repeat;
	background-size: contain;
}
.reviewBtn{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	/* width: calc(100% - 120px);
	margin-top: -16%;
	margin-bottom: 16%; */
}
.specificationBtn,
.sightseeingBtn{
	position: absolute;
	width: 100%;
	margin-top: -16%;
}
.specificationBtn{
	left: 120px;
	margin-top: -15%;
}
.sightseeingBtn{
	left: 120px;
	margin-top: -16%;
}
.reviewBtn .swiper-button-prev,
.reviewBtn .swiper-button-next,
.specificationBtn .swiper-button-prev,
.specificationBtn .swiper-button-next,
.sightseeingBtn .swiper-button-prev,
.sightseeingBtn .swiper-button-next{
	width: 4.5em!important;
	height: 4.5em!important;
	background: #fff;
	border-radius: 5em;
	color: #000;
	box-shadow: 5px 5px 5px #666;
}
.reviewBtn .swiper-button-prev,
.specificationBtn .swiper-button-prev,
.sightseeingBtn .swiper-button-prev{
	position: absolute;
	left: 3%;
	z-index: 9999;
}
.reviewBtn .swiper-button-next{
	position: absolute;
	right: 5%;
	z-index: 9999;
}
.specificationBtn .swiper-button-next,
.sightseeingBtn .swiper-button-next {
	position: absolute;
	right: 10%;
	z-index: 9999;
}
.reviewBtn .swiper-button-prev::after,
.specificationBtn .swiper-button-prev::after,
.sightseeingBtn .swiper-button-prev::after{
	content: '';
	position: absolute;
	left: calc(50% - 10px);
	width: 25px;
	height: 25px;
	border-top: solid 2px #000;
	border-left: solid 2px #000;
	transform: rotate(315deg);
}
.reviewBtn .swiper-button-next::after,
.specificationBtn .swiper-button-next::after,
.sightseeingBtn .swiper-button-next::after{
	content: '';
	position: absolute;
	right: calc(50% - 9px);
	width: 25px;
	height: 25px;
	border-top: solid 2px #000;
	border-right: solid 2px #000;
	transform: rotate(45deg);
}

@media screen and (max-width:1800px){
	/* .reviewBtn .swiper-button-next,
	.specificationBtn .swiper-button-next,
	.sightseeingBtn .swiper-button-next{
		right: 5%;
	} */
	.reviewBtn{
		width: 100%;
	}
	.specificationBtn,
	.sightseeingBtn {
		width: calc(100% - 120px);
	}
	.sightseeingBtn {
		margin-top: -20vw;
	}
	.reviewBtn .swiper-button-next,
	.specificationBtn .swiper-button-next,
	.sightseeingBtn .swiper-button-next {
		right: 3%;
	}
}

@media screen and (max-width:1280px){
	/* .reviewSlider dl{
		height: 40vh;
	} */
	.reviewSlider dl dt{
		padding: 0;
	}
	/* .reviewSlider dl dd{
		font-size: 1.8rem;
		line-height: 2;
	} */
	.reviewSlider .star{
		left: 1.8em;
	}
	.reviewSlider .star span{
		margin-right: 0.2em;
	}
	.specificationBtn{
		margin-top: -18%;
	}
	.sightseeingBtn {
		margin-top: -26%;
	}

	.reviewBtn .swiper-button-prev,
	.reviewBtn .swiper-button-next,
	.specificationBtn .swiper-button-prev,
	.specificationBtn .swiper-button-next,
	.sightseeingBtn .swiper-button-prev,
	.sightseeingBtn .swiper-button-next{
		width: 4.2em!important;
		height: 4.2em!important;
	}
	.reviewBtn .swiper-button-prev::after,
	.specificationBtn .swiper-button-prev::after,
	.sightseeingBtn .swiper-button-prev::after{
		width: 25px;
		height: 25px;
	}
	.reviewBtn .swiper-button-next::after,
	.specificationBtn .swiper-button-next::after,
	.sightseeingBtn .swiper-button-next::after{
		width: 25px;
		height: 25px;
	}

}
@media screen and (max-width:1000px){
	/* .reviewSlider dl{
		height: 30vh;
	} */
	/* .reviewBtn{
		margin-top: -35%;
		margin-bottom: 35%;
	} */
	.specificationBtn{
		margin-top: -24%;
	}
	.sightseeingBtn{
		margin-top: -28%;
	}
}
@media screen and (max-width:840px){
	/* .reviewSlider dl dd{
		font-size: 1.5rem;
	} */
	.specificationBtn{
		left: 0;
		width: 100%;
		margin-top: -30%;
	}
	.sightseeingBtn{
		width: 100%;
		left: 0;
		margin-top: -30%;
	}

	.sightseeingBtn .swiper-button-prev{
		left: 3%;
		/* left: -15%; */
	}
	.reviewBtn,
	.specificationBtn,
	.sightseeingBtn{
		z-index: 999;
	}
	.reviewBtn .swiper-button-prev,
	.reviewBtn .swiper-button-next,
	.specificationBtn .swiper-button-prev,
	.specificationBtn .swiper-button-next,
	.sightseeingBtn .swiper-button-prev,
	.sightseeingBtn .swiper-button-next{
		width: 3.6em!important;
		height: 3.6em!important;
	}
	.reviewBtn .swiper-button-prev::after,
	.specificationBtn .swiper-button-prev::after,
	.sightseeingBtn .swiper-button-prev::after{
		width: 20px;
		height: 20px;
		left: calc(50% - 7px);
	}
	.reviewBtn .swiper-button-next::after,
	.specificationBtn .swiper-button-next::after,
	.sightseeingBtn .swiper-button-next::after{
		width: 20px;
		height: 20px;
		right: calc(50% - 7px);
	}
}
@media screen and (max-width:599px){
	/* .reviewSlider dl{
		height: 40vh;
	} */
	/* .reviewBtn{
		margin-top: -60%;
	} */
	.specificationBtn{
		margin-top: calc(-50% + 10px);
	}
	.sightseeingBtn {
		left: auto;
		width: 100%;
		margin-top: -62%;
	}
	.sightseeingBtn .swiper-button-prev {
		left: 5%;
	}
	.reviewBtn .swiper-button-prev,
	.reviewBtn .swiper-button-next,
	.specificationBtn .swiper-button-prev,
	.specificationBtn .swiper-button-next,
	.sightseeingBtn .swiper-button-prev,
	.sightseeingBtn .swiper-button-next {
		width: 2.4em !important;
		height: 2.4em !important;
		box-shadow: 3px 3px 5px #666;
	}
	.reviewBtn .swiper-button-prev::after,
	.specificationBtn .swiper-button-prev::after,
	.sightseeingBtn .swiper-button-prev::after {
		content: '';
		position: absolute;
		left: calc(50% - 5px);
		width: 14px;
		height: 14px;
		border-top: solid 1px #000;
		border-left: solid 1px #000;
		transform: rotate(315deg);
	}
	.reviewBtn .swiper-button-next::after,
	.specificationBtn .swiper-button-next::after,
	.sightseeingBtn .swiper-button-next::after {
		content: '';
		position: absolute;
		right: calc(50% - 5px);
		width: 14px;
		height: 14px;
		border-top: solid 1px #000;
		border-right: solid 1px #000;
		transform: rotate(45deg);
	}
	.reviewSlider dl dd{
		font-size: 1.4rem;
	}
	.reviewSlider .star span{
		width: 15px;
		height: 15px;
	}
}


/* faqArea
========================================== */
.faqArea{
	padding: 100px 0 0px;
}
.sub .faqArea {
	padding: 0
}
.sub .faqArea .Inner {
	max-width: 1024px;
}
.faqList{
	margin: 100px auto;
	padding: 60px 0 100px;
	background-color: #f6f6f6;
}
.sub .faqList{
	margin: 0 auto;
	background-color: #f1f1f1;
}
.faqList .accordion:not([open]) {
	margin-bottom: 60px;
}
.faqList .accordion summary{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	position: relative;
	padding-bottom: 10px;
	padding-right: 3em;
	letter-spacing: 3px;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: clamp(2.2rem, 3vw, 2.4rem);
	font-weight: normal;
	line-height: 1.6;
	border-bottom: 1px dotted;
	cursor: pointer;
}
.faqList .accordion summary span{
	margin-right: 10px;
}
.faqList .accordion summary::-webkit-details-marker {
	display: none;
}
.faqList .accordion summary::before,
.faqList .accordion summary::after{
	width: 3px;
	height: .9em;
	border-radius: 5px;
	background-color: #cfcfcf;
	content: '';
}
.faqList .accordion summary::before{
	position: absolute;
	top: .3em;
	right: 2em;
	rotate: 90deg;
}
.faqList .accordion summary::after{
	transition: rotate .3s;
	position: absolute;
	top: .3em;
	right: 2em;
}
.faqList .accordion[open] summary::after{
	rotate: 90deg;
}
.faqList .accordion .answer{
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 1em 2em 2em 2em;
	transition: transform .2s, opacity .2s;
}
.faqList .accordion[open] .answer{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	transform: none;
	opacity: 1;
	margin: 40px auto 60px;
	padding: 1em;
	letter-spacing: 1px;
	font-size: clamp(1.6rem, 3vw, 2rem);
	background: #fff;
}
.faqList .accordion[open] .answer span{
	margin-right: 10px;
	font-size: 1.8rem;
	line-height: 2.4;
}
.faqList .accordion[open] .answer a{
	text-underline-offset: 5px;
}
.faqList .btnMore{
	display: flex;
	justify-content: center;
}
@media screen and (max-width:1280px){
	.faqArea{
		padding: 100px 0 0;
	}
	.faqList{
		margin: 100px auto 0;
	}
	.faqList .accordion summary{
		font-size: 2.2rem;
	}
}
@media screen and (max-width:1000px){
	.faqArea{
		padding: 80px 0 0;
	}
	.faqList{
		padding: 60px 0;
	}
	.faqList .accordion[open] .answer{
		display: block;
	}
}
@media screen and (max-width:840px){

	.faqList .accordion:not([open]){
		margin-bottom: 40px;
	}
	.faqList .accordion summary{
		padding-right: 2em;
	}
	.faqList .accordion summary::before,
	.faqList .accordion summary::after {
		right: 1em;
	}
	.faqList .accordion[open] .answer{
		margin: 30px auto 40px;
		line-height: 1.8;
	}
	.faqList .accordion[open] .answer span{
		line-height: 1.8;
	}
	.faqList .btnMore{
		margin-top: 50px;
	}
}
@media screen and (max-width:599px){
	.faqArea{
		padding: 60px 0 0;
	}
	.faqList{
		margin: 60px auto 0;
		padding: 60px 0 50px;
	}
	.faqList .accordion summary{
		font-size: 1.6rem;
	}
	.faqList .accordion[open] .answer{
		font-size: 1.4rem;
	}
	.faqList .btnMore {
		margin-top: 30px;
	}
}


/* reserveArea
========================================== */
.reserveArea{
	padding: 100px 0 50px;
}
.sub .reserveArea{
	padding: 0px 0 50px;
}
/* .reserveArea iframe{
	position: relative;
	margin: 100px auto 0;
}
.sub .reserveArea iframe{
	margin: 0 auto;
} */
.reserveArea .Inner_iframe{
	margin: 100px auto 0;
	height: 1150px;
}
.reserveArea iframe{
	width: 100%;
	height: 100%;
}
@media screen and (max-width:1335px){
	.reserveArea .Inner_iframe{
		height: 1200px;
	}
}
@media screen and (max-width:1280px){
	.reserveArea .Inner_iframe{
		height: 1350px;
	}
	/* .reserveArea iframe{
		height: 135vh;
	} */
}
@media screen and (max-width:1000px){
	/* .reserveArea iframe{
		width: 100%;
		height: 100vh;
		margin: 50px auto 0;
	} */
}
@media screen and (max-width:840px){
	.reserveArea{
		position: relative;
		background-color: #fff;
	}
	.reserveArea .Inner_iframe{
		margin: 60px auto 0;
	}
	/* .reserveArea iframe {
		width: 150%;
		left: -25%;
	} */
}
@media screen and (max-width:599px){
	.reserveArea .Inner_iframe{
		height: 1200px;
	}
	/* .reserveArea iframe{
		width: 100%;
		height: 110vh;
		left: 0;
	} */
}


/* ruleArea
========================================== */
.ruleArea{
	padding: 50px 0;
	background-color: #f6f6f6;
}
.sub .ruleArea{
	padding: 0 0 160px;
	background-color: unset;
}
.ruleArea .details-summary {
	position: relative;
	display: block;
	padding: 10px 40px;
	font-size: 24px;
	font-weight: 700;
	border-radius: 10px;
	background-color: #fff;
	transition: all .25s;
	p{
		display: block;
		position: relative;
		width: 100%;
		padding: 0 5px;
		font-family: "Zen Kaku Gothic New", sans-serif;
		font-size: clamp(2rem, 3vw, 2.8rem);
	}
	.btn {
		position: absolute;
		top: 37%;
		right: 5%;
		width: 25px;
		height: 25px;
		transform-origin: center center;
		transition-duration: 0.2s;
		&:before,
		&:after {
			content: "";
			background-color: #a6a6a6;
			border-radius: 10px;
			width: 25px;
			height: 2px;
			position: absolute;
			top: 11px;
			left: 0;
			transform-origin: center center;
		}
		&:before {
			width: 2px;
			height: 25px;
			top: 0;
			left: 12px;
		}
	}
	&.is-active {
		.btn {
			-webkit-transform: rotate(-180deg);
			transform: rotate(-180deg);
			&:before {
				content: none;
			}
		}
		p {
			border-bottom: 1px dotted;
		}
	}
}
.ruleArea .details-summary::-webkit-details-marker {
	display: none;
}
.ruleArea .details-content {
	margin-top: -10px;
	padding: 15px 50px 25px;
	background: #fff;
	border-radius: 0 0 10px 10px;
	> ul {
		margin-top: 1.2em;
	}
	ul li{
			position: relative;
			margin-bottom: 0.6em;
			padding-left: 1em;
			letter-spacing: 2px;
			line-height: 1.6;
		}
	ul li::before{
			content: '';
			position: absolute;
			top: 5px;
			left: -5px;
			width: 13px;
			height: 13px;
			background-color: #000;
		}
}
.ruleBox h2{
	margin-bottom: 0.5em;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: clamp(3rem, 3vw, 5rem);
	font-weight: 500;
}
.ruleBox ul{
	padding: 2.4em 0;
	border-top: 1px solid #666666;
	border-bottom: 1px solid #666666;
}
.ruleBox ul li{
	position: relative;
	margin-bottom: 0.6em;
	padding-left: 1em;
	letter-spacing: 2px;
	line-height: 1.6;
}
.ruleBox ul li:last-child{
	margin-bottom: 0;
}
.ruleBox ul li::before {
	content: '';
	position: absolute;
	top: 7px;
	left: 0;
	width: 13px;
	height: 13px;
	background-color: #000;
}

@media screen and (max-width:1000px) {
	.ruleArea .details-summary{
		padding: 20px;
	}
	.ruleArea .details-summary p{
		padding-left: 0.3em;
		font-size: 2rem;
	}
	.ruleArea .details-summary {
		.btn {
			width: 20px;
			height: 20px;
			&:before,
			&:after {
				content: "";
				width: 20px;
				height: 2px;
				position: absolute;
				top: 9px;
				left: 0;
			}
			&:before {
				width: 2px;
				height: 20px;
				top: 0;
				left: 9px;
			}
		}
	}
}
@media screen and (max-width:840px) {
	.sub .ruleArea{
		padding: 0 0 100px;
	}
	.ruleBox h2 {
		font-size: clamp(3.6rem, 3vw, 4rem);
	}
}
@media screen and (max-width:599px) {
	.ruleArea {
		padding: 35px 0;
	}
	.sub .ruleArea {
		padding: 0 0 50px;
	}
	.ruleArea .details-content {
		padding: 15px 30px 25px;
	}
	.ruleBox h2{
		font-size: clamp(3rem, 3vw, 3.4rem);
	}
	.ruleBox ul {
		padding: 2em 0;
	}
	.ruleBox ul li{
		font-size: 14px;
	}
	.ruleArea .details-content ul li {
		font-size: 1.4rem;
	}
}
@media screen and (min-width:600px) {
	.ruleArea .details-summary {
		&:hover {
			cursor: pointer;
			background-color: #808080;
			color: #fff;
			.btn {
				&:before,
				&:after {
					background-color: #fff;
				}
			}
		}
	}
}


/* mapArea
========================================== */
.mapArea{
	position: relative;
	padding-top: 85px;
}
.sub .mapArea{
	padding: 0 0 150px;
}
.mapInner{
	width: 100%;
	max-width: 740px;
	position: absolute;
	padding: 100px 180px 30px;
	top: 0;;
	left: 0;
	background: #fff;
	z-index: 2;
}
.mapArea .ttlMain{
	margin-bottom: 1.8em;
}
.mapArea iframe{
	position: relative;
	filter: grayscale(1);
	opacity: 0.8;
	z-index: 1;
}
.mapArea .btnMore{
	position: relative;
}
.mapTxt{
	margin-top: 2em;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: 1.8rem;
	font-weight: 400;
	line-height: 1.8;
}
.mapTxt .mapInfo + .mapInfo{
	margin-top: 32px;
}
.mapTxt h3{
	font-size: 2.2rem;
	font-weight: 600;
	letter-spacing: 0.12em;
}
.mapTxt h4{
	margin-top: 0.8em;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.1em;
}
.mapTxt .mapSub + .mapSub{
	margin-top: 20px;
}
.mapTxt p{
	margin-top: 0.6em;
	font-size: 1.6rem;
}
.mapTxt p + p{
	margin-top: 0.6em;
}
.mapTxt .note{
	margin-top: 0.6em;
	color: #555;
	font-size: 1.5rem;
}

@media screen and (max-width:1280px) {
	.mapTxt{
		font-size: 1.8rem;
	}
	.mapInner {
		padding: 70px 80px 50px;
	}
}
@media screen and (max-width:1000px){
	.sub .mapArea{
		padding: 0 0 100px;
	}
	.mapInner{
		width: 100%;
	}
}
@media screen and (max-width:599px){
	.mapInner {	
		padding: 50px 20px 30px;
		font-weight: 400;
	}
	.mapArea iframe{
		margin-bottom: -30%;
		padding-bottom: 30%;
		z-index: 0;
	}
	.mapTxt {
		margin-top: 30px;	
		font-size: 1.6rem;
	}
	.mapTxt p{
		font-size: 1.4rem;
	}
	.mapArea .btnMore{
		padding: 40px 0 100px;
		text-align: center;
	}
}


/* design
==========================================*/
.specificationArea{
	position: relative;
	padding: 85px 0;
	background: #fff;
	border-left: 1px solid #e5e5e5;
	z-index: -1;
}
.specificationArea::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(90deg, #ffffff, #fffffff2 5%, #ffffff99 10%, transparent 15%);
	z-index: 2;
}
.specificationArea::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(90deg, transparent, transparent 85%, #ffffff80 90%, #ffffff);
	z-index: 1;
}
.specificationArea ul li{
	position: relative;
	overflow: hidden;
}
.specificationArea ul li::before{
	content: "";
	padding-top: 100%;
	display: block;
}
.specificationArea ul li img{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
.specificationArea ul li video{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	object-fit: cover;
}
.specificationArea01{
	padding: 0px 0 0px;
}
.specificationArea01 .contentsBox{
	margin-bottom: 120px;
}
.specificationArea01 .contentsBox:last-child,
.specificationArea02 .contentsBox:last-child{
	margin-bottom: 0;
}
.specificationArea01 .contentsBox div{
	width: 50%;
}
.specificationArea01 .contentsBox div img{
	width: 100%;
}
.specificationArea01 .contentsBox .txt_l{
	padding-right: 6em;
}
.specificationArea01 .contentsBox .txt_r{
	padding: 6em 0 0 8%;
}
.specificationArea01 .contentsBox .ttlType03{
	margin-bottom: 6%;
}
.specificationArea01 .contentsBox .ttlType02{
	margin: 2em 0 1em;
}
.specificationAreaHeading-pc {
	display: block;
}
.specificationAreaHeading-sp {
	display: none;
}
.specificationArea02{
	padding: 100px 0;
}
.specificationArea02 .contentsBox{
	margin: 0px auto 100px;
}
.specificationArea02 .contentsBox .txt01{
	padding-right: 3.4em;
}
.specificationArea02 .contentsBox .txt02{
	padding-left: 3.4em;
}
.specificationArea02 .contentsBox .imgBox{
	display: flex;
	justify-content: space-between;

}
.specificationArea02 .contentsBox .imgBox li{
	width: 49%;
	margin-top: 10px;
}
.facilityImg{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 80px;
}
.facilityImg li{
	width: 32%;
}
.facilityImg li img{
	width: 100%;
}
.facilityList{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
.facilityList dl{
	width: 31%;
	margin-top: 3em;
	margin-right: 3%;
}
.facilityList dl:nth-child(3n){
	margin-right: 0;
}
.facilityList dl dt{
	margin-bottom: 0.5em;
	font-size: 2.6rem;
	font-weight: 600;
	color: #808080;
	border-bottom: 2px solid #c8c8c9;
	line-height: 1.6;
}
.facilityList dl dd{
	font-size: clamp(1.6rem, 3vw, 1.8rem);
	letter-spacing: 0.15em;
	line-height: 1.8;
}

@media screen and (max-width:1280px){
	.specificationArea01{
		padding: 80px 0 100px;
	}
	.specificationArea01 .contentsBox{
		margin-bottom: 80px;
	}
	.specificationArea01 .contentsBox .txt_r{
		padding: 3em 0 0 3em;
	}
	.specificationArea01 .contentsBox .txt_l{
		padding-right: 3em;
	}
	.specificationArea02{
		padding: 100px 0;
	}
	.facilityList dl{
		margin-top: 2em;
	}
	.facilityList dl dd{
		/* font-size: 1.8rem; */
		font-size: 1.5rem;
	}
}
@media screen and (max-width:1000px){
	.specificationArea01 .contentsBox,
	.specificationArea02 .contentsBox{
		display: flex;
		flex-direction: column;
		row-gap: 2.2em;
		flex-wrap: wrap;
	}
	.specificationArea01 .contentsBox div{
		width: 100%;
	}
	.specificationArea01 .contentsBox .img_l{
		padding-right: 0;
	}
	.specificationArea01 .contentsBox .img_r{
		order: 1;
		padding-left: 0;
	}
	.specificationArea01 .contentsBox .txt_l{
		order: 2;
		padding-right: 0;
	}
	.specificationArea01 .contentsBox .txt_r{
		padding: 0;
	}
	.specificationAreaHeading-pc {
		display: none;
	}
	.specificationAreaHeading-sp {
		display: block;
	}
	.specificationArea02 .contentsBox .txt01{
		margin-bottom: 3em;
		padding-right: 0;
	}
	.specificationArea02 .contentsBox .txt02{
		order: 1;
		margin-bottom: 3em;
		padding-left: 0;
	}
	.specificationArea02 .contentsBox .img02{
		order: 2;
	}
	.facilityList{
		justify-content: space-between;
	}
	.facilityList dl,
	.facilityList dl:nth-child(3n) {
		width: 46%;
		margin-right: 0;
	}
}
@media screen and (max-width:599px) {
	.specificationArea{
		padding: 0;
		border-left: none;
	}
	.specificationArea::before,
	.specificationArea::after{
		background-image: none;
	}
	.specificationArea ul li::before{
		padding-top: 90%;
	}
	.specificationArea ul li img,
	.specificationArea ul li video{
		height: 90%;
	}
	.specificationArea01{
		padding: 60px 0 100px;
	}
	.specificationArea01 .contentsBox{
		margin-bottom: 50px;
		padding-top: 30px;
		border-top:1px solid #ccc;
	}
	.specificationArea01 .contentsBox:first-child{
		padding-top: 0;
		border-top: none;
	}
	.specificationArea01 .contentsBox .ttlType02{
		margin: 1.5em 0 0.5em;
	}
	.specificationArea01 .contentsBox .ttlType03{
		font-size: 2rem;
	}
	.specificationArea01 .contentsBox .img_l,
	.specificationArea01 .contentsBox .img_r{
		display: flex;
		justify-content: space-between;
	}
	.specificationArea01 .contentsBox .img_l img,
	.specificationArea01 .contentsBox .img_r img{
		width: 90%;
	}
	.specificationArea02{
		padding: 40px 0 70px;
	}
	.specificationArea02.spaceType01{
		padding: 0px 0;
	}
	.specificationArea02.spaceType02{
		padding: 30px 0 0px;
	}
	.specificationArea02.spaceType03{
		padding: 20px 0 40px;
	}
	.specificationArea02 .contentsBox {
		margin: 20px auto 40px;
	}
	.specificationArea02 .contentsBox .txt01{
		order: 1;
		margin: 20px auto 2em;
	}
	.specificationArea02 .contentsBox .txt02{
		margin-bottom: 0;
	}
	.specificationArea02 .contentsBox .img02 {
		order: 1;
		margin-bottom: 20px;
	}
	.facilityImg{
		margin-bottom: 30px;
	}
	.facilityImg li{
		width: 49%;
	}
	.facilityList dl,
	.facilityList dl:nth-child(3n){
		width: 100%;
		margin-top: 1.8em;
	}
	.facilityList dl dt{
		font-size: 2rem;
		letter-spacing: 5px;
	}
}


/* sightseeing
==========================================*/
.sightseeingArea .subimgSlider{
	position: relative;
	padding: 85px 0 125px;
	background: #fff;
	z-index: 0;
}
.sightseeingArea .subimgSlider::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100px;
	height: 100%;
	/* background-image: linear-gradient(90deg, #ffffff, #fffffff2 5%, #ffffff99 10%, transparent 15%); */
	background-image: linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,0.8) 35%, rgba(255,255,255,0.6) 65%, transparent 100%);
	z-index: 2;
}



.sightseeingArea .subimgSlider::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100px;
	height: 100%;
	/* background-image: linear-gradient(90deg, transparent, transparent 85%, #ffffff80 90%, rgba(255,255,255, 0.8)); */
	background-image: linear-gradient(90deg, transparent, rgba(255,255,255,0.6) 35%, rgba(255,255,255,0.8) 65%, rgba(255,255,255, 1) 100%);
	z-index: 1;
}
.sightseeingArea .subimgSlider li {
	position: relative;
	overflow: hidden;
}
.sightseeingArea .subimgSlider li a {
	display: block;
}
/* .sightseeingArea .subimgSlider li::before {
	content: "";
	padding-top: 100%;
	display: block;
} */
.sightseeingArea .subimgSlider li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 100/100;
	/* position: absolute;
	top: 0;
	left: 0; */
}
.sightseeingImg{
	display: flex;
	align-items: center;
	position: relative;
	overflow: hidden;
	aspect-ratio: 165 / 75;
}
.sightseeingImg img{
	width: 100%;
	height: auto;
}
.sightseeingList{
	display: flex;
	justify-content: flex-start;
	/* align-items: flex-start; */
	flex-wrap: wrap;
	margin-bottom: 70px;
}
.sightseeingList li{
	width: calc((100% - 3% * 2) / 3);
	margin-right: 3%;
	margin-bottom: 60px;
	display: flex;
	flex-direction: column;
	row-gap: 1.5em;
}
.sightseeingList li:nth-child(3n){
	margin-right: 0;
}
.sightseeingList li > .info {
	display: flex;
	flex-direction: column;
	row-gap: 1.2em;
	flex-grow: 1;
}
.sightseeingList li .imgArea img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 100 / 100;
}
.sightseeingList dl .upper{
	display: flex;
	flex-direction: column;
	row-gap: 0.4em;
}
.sightseeingList dl .lower{
	display: flex;
	flex-direction: column;
	row-gap: 1.2em;
	flex-grow: 1;
}
.sightseeingList .descArea{
	display: flex;
	flex-direction: column;
	row-gap: 1.2em;
	flex-grow: 1;
}
.sightseeingList dl dt{
	display: flex;
	/* margin-bottom: 5px;
	padding-top: 10px; */
	font-family: "Zen Kaku Gothic New",sans-serif;
	font-size: 2.2rem;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.6;
}
.sightseeingList dl .title{
	display: flex;
	font-family: "Zen Kaku Gothic New",sans-serif;
	font-size: clamp(2rem, 1.8vw, 2.4rem);
	/* font-size: 2.2rem; */
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.6;
}
/* .sightseeingList dl dt.narrow,
.sightseeingList dl .title.narrow{
	font-size: 2.1rem;
} */
.sightseeingList dl dt ruby,
.sightseeingList dl .title ruby{
	margin-top: -0.3em;
	ruby-position: over;
}
.sightseeingList dl dd{
	letter-spacing: 0;
	line-height: 2;
}
.sightseeingList li .access{
	display: flex;
	flex-direction: column;
	row-gap: 0.5em;
	padding: 1em 1.2em 1em;
	background-color: #f0f0f0;
	line-height: 1.6;
}
.sightseeingList li .access .address{
	flex-grow: 1;
	height: 6em;
}
.sightseeingList dl .lower .txt{
	flex-grow: 1;
}
.sightseeingList .category{
	display: flex;
	justify-content: left;
	/* margin-bottom: 1em; */
}
.sightseeingList .category span{
	content: '';
	width: auto;
	height: auto;
	margin-right: 8px;
	padding: 0 20px;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: 1.5rem;
	font-weight: 500;
	letter-spacing: 3px;
	line-height: 1.4;
	border-radius: 10px;
}
.sightseeingList .category span.food{
	background-color: var(--c-yellow);
}
.sightseeingList .category span.spot{
	background-color: var(--c-green);
}
.sightseeingList .category span.other{
	background-color: var(--c-pink);
}

@media screen and (max-width:1200px){
	.sightseeingList{
		justify-content: space-between;
		margin-bottom: 0;
	}
	.sightseeingList li{
		width: 48%;
		margin-right: 0;
	}
}
@media screen and (max-width:840px){
	#sightseeing {
    margin-top: -68px;
		padding-top: 68px;
	}
	.sightseeingArea .subimgSlider{
		padding: 100px 0;
	}
	.sightseeingList dl dt,
	.sightseeingList dl dt.narrow,
	.sightseeingList dl .title,
	.sightseeingList dl .title.narrow{
		font-size: 2.4rem;
	}
	.sightseeingList dl dt,
	.sightseeingList dl .title{
		line-height: 1.4;
	}
	.sightseeingList li .access{
		font-size: 15px;
	}
}
@media screen and (max-width:599px){
	.sightseeingArea {
		margin-bottom: 50px;
	}
	.sightseeingArea .ttlType01{
		position: relative;
		padding: 1em 8% 0.7em;
		line-height: 1.2;
	}
	.sightseeingArea .ttlType01::before {
		content: '';
		position: absolute;
		top: 2.2em;
		left: 8%;
		width: 84%;
		height: 1px;
		background-color: #e1e1e1;
	}
	.sightseeingArea .subimgSlider::before,
	.sightseeingArea .subimgSlider::after{
		width: 60px;
		background-image: none;
	}
	.sightseeingArea .subimgSlider li img{
		height: 80%;
	}
	.sightseeingArea .subimgSlider{
		padding: 0;
	}
	.sightseeingList{
		margin-bottom: 50px;
	}
	.sightseeingList li{
		/* display: block; */
		width: 100%;
		margin-bottom: 50px;
	}
	/* .sightseeingList li div {
		width: 100%;
		height: 100%;
	} */
	.sightseeingList dl {
		width: 100%;
		padding-left: 0;
	}
	.sightseeingList dl dd{
		line-height: 2;
	}
	.sightseeingList dl .lower .txt{
		font-size: 1.4rem;
	}
	.sightseeingList li .access .address{
		height: auto;
	}

	/* .sightseeingList .category {
		margin: 0 0 0.5em;
	} */
}
@media screen and (max-width:390px){
	.sightseeingArea .ttlType01 {
		padding: 1em 20px 0.7em;
	}
}
@media screen and (max-width:320px) {
	.sightseeingList dl dt,
	.sightseeingList dl dt.narrow,
	.sightseeingList dl .title,
	.sightseeingList dl .title.narrow{
		font-size: 2rem;
	}
}






/* company
========================================== */
.companyArea{
	margin: 50px auto 160px;
}
.companyArea .tableType01 th,
.companyArea .tableType01 td{
	padding: 1em 2em;
	font-size: clamp(1.4rem, 2.6vw, 1.8rem);
	letter-spacing: 2px;
}
.companyArea .tableType01 th{
	width: 14em;
}
.companyArea .tableType01 td{
	line-height: 1.8;
	word-break: break-all;
}
.companyArea .tableType01 td a{
	text-decoration: none;
}
.companyArea .tableType01 td a:hover {
	text-decoration: underline 2px #cbcbcb;
	text-underline-offset: 5px;
}

@media screen and (max-width: 1280px) {
	.companyArea .tableType01 th{
		width: 10em;
	}
}
@media screen and (max-width: 599px) {
	.companyArea {
		margin: 20px auto 100px;
	}
	/* .companyArea .tableType01 th {
		width: 100%;
	} */
	/* .companyArea .tableType01 td{
		border-left: none;
	} */
	/* .companyArea .tableType01 td{
		border-left: none;
	} */
	.companyArea .tableType01 {
		display: table;
	}
	.companyArea .tableType01 tr{
		display: table-row;
	}
	.companyArea .tableType01 th,
	.companyArea .tableType01 td {
		display: table-cell;
		padding: 1em 1em;
	}
	.companyArea .tableType01 th {
		width: 8em;
		border-bottom: 1px solid #cbcbcb;
	}
	.companyArea .tableType01 td {
		width: auto;
		border-bottom: 1px solid #cbcbcb;
	}
	.companyArea .tableType01 tr:last-of-type th,
	.companyArea .tableType01 tr:last-of-type td{
		border-bottom: none;
	}
}


/* contact
========================================== */
.contactArea{
	padding: 70px 0 160px;
	background-color: #f1f1f1;
}
.contactArea .Inner{
	max-width: 1024px;
}
.contactArea dl{
	margin-bottom: 60px;
	font-family: "Sawarabi Gothic", sans-serif;
	font-weight: 400;
	letter-spacing: 2px;
	font-size: clamp(1.6rem, 3vw, 1.8rem);
}
.contactArea dl dt{
	margin-bottom: 10px;
	color: #404041;
	font-weight: 100;
	line-height: 1.8;
}
.contactArea dl dd{
	margin-bottom: 30px;
	font-size: clamp(1.6rem, 3vw, 2rem);
}
.contactArea dl dd:last-child{
	margin-bottom: 0;
}
.contactArea dl dd.checkbox{
	/* display: flex;
	justify-content: flex-start;
	flex-wrap: wrap; */
	padding: 2em 1.5em;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	background: #fff;
	box-sizing: border-box;
	color: #231815;
	letter-spacing: 2px;
}
.contactArea dl dd.checkbox label{
	display: block;
	margin-right: 1.5em;
	line-height: 2.5;
}
.contactArea dl dd.checkbox label.other{
	display: block;
	width: 100%;
	margin-right: 0;
}
.contactArea dl dd.narrow{
	padding: 2em 1.5em;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	background: #fff;
	box-sizing: border-box;
	color: #231815;
	letter-spacing: 2px;
}
.contactArea ul.narrow li{
	margin-right: 0;
	line-height: 1.8;
}
.contactPrivacy {
	font-family: "Sawarabi Gothic", sans-serif;
	font-weight: 400;
	letter-spacing: 2px;
	color: #404041;
	line-height: 1.8;
}
.contactPrivacy .Inner{
	overflow-y: scroll;
	margin: 0 auto 50px;
	padding: 1.5em 1.8em;
	width: 100%;
	height: 200px;
	border: 1px solid #a8a8aa;
	border-radius: 10px;
	background: #fff;
	text-align: left;
}
.contactPrivacy h2{
	margin-bottom: 5px;
	font-size: clamp(1.6rem, 3vw, 2rem);
	color: #404041;
}
.contactPrivacy p,
.contactPrivacy ul li{
	font-size: 1.6rem;
}
.contactPrivacy .Inner > p + ul{
	margin-top: 1.5em;
}
.contactPrivacy ul{
	padding: 0;
}
.contactPrivacy ul li{
	line-height: 1.8;
}
.contactPrivacy ul li + li{
	margin-top: 1.2em;
}
.contactPrivacy .Inner .content ul li + li{
	margin-top: 0em;
}
.contactPrivacy .Inner .heading{
	margin-bottom: 0.2em;
}
.contactPrivacy .point{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 70%;
	margin: 40px 5% 0 17%;
	font-size: clamp(1.8rem, 3vw, 2rem);
}
.contactPrivacy .point p{
	font-size: 1.5rem;
	letter-spacing: 0;
}
.contactPrivacy .check{
	display: flex;
	justify-content: center;
	margin-bottom: 40px;
	font-size: clamp(1.6rem, 3vw, 2rem);
}
.inputArea .wpcf7-not-valid-tip {
	display: none!important;
}
.confirmArea .wpcf7-not-valid-tip {
	display: none!important;
}
.wpcf7 form.sent .wpcf7-response-output {
	display: none!important;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
	display: none!important;
}
.wpcf7-spinner {
	display: none;
}

@media screen and (max-width: 1280px) {
	.contactArea dl {
		margin-bottom: 30px;
	}
	.contactArea dl dt{
		margin-bottom: 5px
	}
	.contactArea dl dd.checkbox{
		padding: 1em 1.5em 1.5em;
	}
	.contactArea dl dd.narrow{
		padding: 1.5em;
	}
}
@media screen and (max-width: 1000px){
	.contactArea dl {
		margin-bottom: 30px;
	}
	.contactArea dl dt br{
		display: none;
	}
}
@media screen and (max-width: 840px){
	.contactArea {
		padding: 70px 0 100px;
	}
	.contactPrivacy .point {
		align-items: flex-start;
		width: 100%;
		margin: 1em 0;
	}
	.contactPrivacy .point p {
		margin-left: 2em;
	}
}
@media screen and (max-width: 599px){
	.contactArea {
		padding: 20px 0 100px;
	}
	.contactArea dl dd.checkbox {
		padding: 0.8em;
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
	}
	.contactArea dl dd.checkbox label {
		margin-right: 8px;
		margin-bottom: 5px;
		line-height: 2;
	}
	/*.contactArea dl dd.checkbox label.other input{
		border: 1px solid #231815;
	}*/
	.contactArea dl dd.narrow{
		padding: 0.8em;
	}
	.contactPrivacy .Inner{
		padding: 1em 1.5em;
	}
	.contactPrivacy p,
	.contactPrivacy ul li {
		letter-spacing: 0;
	}
	.contactPrivacy ul{
		padding: 0;
	}
	.contactPrivacy .point {
		display: block;
		line-height: 1.6;
	}
	.contactPrivacy .point p {
		margin-left: 0;
		margin-top: 5px;
	}
}


/* thanks
------------------------------------------ */
.contactThanksArea{
	margin-bottom: 100px;
	text-align: center;
}
.contactThanksArea h1{
	margin-bottom: 80px;
	font-size: clamp(6rem, 3vw, 7rem);
	font-weight: 600;
	line-height: 1;
	text-align: center;
}
.contactThanksArea img{
	width: 200px;
}
.contactThanksArea h2{
	margin: 2em auto 1em;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: clamp(2.6rem, 3vw, 3.2rem);
	font-weight: 500;
	line-height: 1.5;
}
.contactThanksArea .txt{
	width: 100%;
	max-width: 520px;
	margin: 0 auto;
}
.contactThanksArea .txt p{
	text-align: left;
	font-size: 16px;
	line-height: 2;
}
.contactInstaArea{
	padding: 60px 0 80px;
	background-color: #f6f6f6;
}
.contactInstaArea .Inner{
	text-align: center;
}
.contactInstaArea a{
	text-decoration: none;
}
.contactInstaArea p{
	margin: 1em auto;
	line-height: 1.6;
}
.contactInstaArea img{
	width: 110px;
}
.contactInstaArea dl{
	margin-top: 2em;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	line-height: 1.5;
}
.contactInstaArea dl dt{
	margin-bottom: 10px;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-size: clamp(2.6rem, 3vw, 3.2rem);
	font-weight: 500;
	line-height: 1.5;
}
.contactInstaArea dl dd{
	font-size: clamp(1.8rem, 3vw, 2rem);
}

@media screen and (max-width: 1280px){
	.contactInstaArea img {
		width: 50px;
	}
	.contactInstaArea p {
		font-size: 1.4rem;
	}
}
@media screen and (max-width: 1000px) {
	.contactThanksArea h1 {
		margin-bottom: 50px;
	}
}
@media screen and (max-width: 599px){
	.contactThanksArea{
		margin-bottom: 50px;
	}
	.contactThanksArea h1 {
		margin-bottom: 50px;
		font-size: clamp(5rem, 3vw, 6rem);
	}
	.contactThanksArea h2{
		font-size: clamp(2rem, 3vw, 2.4rem);
	}
	.contactThanksArea .txt p{
		font-size: 14px;
		line-height: 1.6;
	}
	.contactThanksArea img{
		width: 160px;
	}
	.contactInstaArea a img{
		width: 60px;
	}
	.contactInstaArea dl dt{
		font-size: clamp(2rem, 3vw, 3rem);
	}
	.contactInstaArea dl dd {
		font-size: clamp(1.6rem, 3vw, 2rem);
	}
}


/* footer
========================================== */
footer{
	position: relative;
	padding-left: 120px;
	z-index: 1;
}
.footerInner{
	background: #676666;
}
.footerWrap{
	max-width: 760px;
	width: 100%;
	margin: 0 auto;
	padding: 60px 0 50px;
}
.footerInfo{
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
	color: #fff;
}
.footerInfo .logo{
	width: 116px;
	padding-bottom: 2px;
}
.footerInfo .logo img{
	width: 100%;
	height: auto;
}
.footerInfo .Insta.pc_sp{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.footerInfo .Insta a{
	display: flex;
	justify-content: right;
	align-items: flex-end;
	text-decoration: none;
}
.footerInfo .Insta p{
	width: 130px;
	font-size: 1rem;
	line-height: 1.4;
	letter-spacing: 2px;
	text-align: right;
}
.footerInfo .Insta img{
	width: 44px;
	padding: 0 0 2px 10px;
}
.footerInfo ul{
	letter-spacing: 3px;
}
.footerInfo ul li{
	font-size: 1.4rem;
	line-height: 1.8;
}
.footerInfo dt{
	font-weight: 400;
}
.footerNavi,
.footerLink{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.footerNavi{
	margin-bottom: 50px;
}
.footerNavi li{
	margin-bottom: 1em;
	width: 45%;
	border-bottom: 1px solid #fff;
}
.footerNavi li a{
	position: relative;
	display: block;
	padding: 0 0.5em 0.3em;
	color: #fff;
	text-decoration: none;
}
.footerNavi li a::before{
	content: '';
	width: 0.8em;
	height: 0.8em;
	border: 0;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	right: 8%;
	bottom: 0;
	margin: auto;
	transition: .3s;
}
.footerNavi li a:hover::before {
	right: 5%;
}
.copyright{
	padding: 1em 0 0;
	color: #fff;
	font-size: 1.3rem;
	letter-spacing: 2px;
}

@media screen and (max-width: 1280px){
	.footerNavi li a{
		font-size: 1.8rem;
	}
	.footerNavi li a::before{
		width: 0.6em;
		height: 0.6em;
	}
}
@media screen and (max-width: 1200px){
	.footerWrap{
		padding: 50px 10% 10px;
		width: 100%;
		max-width: 100%;
	}
}
@media screen and (max-width: 1000px){
	.footerWrap {
		padding: 50px 6% 10px;
	}
	.footerNavi li {
		width: 46%;
	}
	.footerInfo{
		font-size: 1.5rem;
		gap: 10px;
	}
	.footerInfo .logo {
		width: 80px;
	}
	.copyright {
		padding: 0;
	}
}
@media screen and (max-width: 840px){
	footer {
		padding-left: 0;
	}
	.footerWrap{
		padding-bottom: 130px;
	}
	.footerInfo{
		display: block;
	}
	.footerInfo ul {
		margin-left: 0;
	}
	.footerInfo .logo{
		padding-bottom: 1em;
	}
	.Insta {
		margin-top: -2.5em;
	}
}
@media screen and (max-width: 599px){
	footer{
		padding-bottom: 0;
	}
	.sub footer{
		margin-top: 3vh;
	}
	.footerWrap{
		padding: 50px 20px 100px;
	}
	.footerWrap .logo{
		margin: 0 auto 20px;
		text-align: center;
		width: 116px;
	}
	.footerWrap .logo img{
		width: 100%;
	}
	.footerNavi li {
		width: 100%;
	}
	.footerNavi li a {
		font-size: 1.6rem;
	}
	.footerInfo{
		position: relative;
	}
	.footerInfo .Insta.pc_sp{
		display: none;
	}
	.Insta {
		position: relative;
		margin-bottom: 20px;
		padding-top: 20px;
	}
	.footerInfo .Insta a {
		display: flex;
		justify-content: center;
		align-items: center;
	}
		.footerInfo .Insta img{
			padding: 0;
		}
	.copyright{
		text-align: center;
	}
}


/* pageTop
========================================== */
#pageTop{
	position:fixed;
	line-height: 1;
	right:20px;
	bottom:20px;
	z-index: 1000;
}
#pageTop a{
	display: block;
	position:relative;
	padding: 24px;
	background-color:#000;
	box-sizing: border-box;
	color:#fff;
	font-size: 1.2rem;
	text-decoration: none;
	transition: all .3s;
}
#pageTop a::before{
	position:absolute;
	content: "";
	top: 44%;
	left: 50%;
	margin-left: -4px;
	width: 12px;
	height: 12px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	transition: all .3s;
	}
#pageTop:hover a{opacity: 0.6;}
#pageTop:hover a::before{top:13px;}
@media screen and (max-width: 1200px) {
	#pageTop{
		right:0;}
}

@media screen and (max-width: 840px) {
	#pageTop{
		bottom: 104px;
	}
}

@media screen and (max-width: 599px) {
	#pageTop{
		bottom: 88px;
	}
}




/* スマホ側（sp_heigh_fixwr / sp_heigh_fixin がついている方）だけに適用 */

/* 1. PC用の left: 120px による右側のハミ出し・横スクロール余白を解消 */
.mvWrap.sp_heigh_fixwr {
	width: 100% !important;
	left: 0 !important;
	padding-bottom: 80px;
}

/* 2. マイナス配置（bottom: -14.2em）による下の変な隙間を解消 */
.mvWrap.sp_heigh_fixwr .mvText {
	position: absolute;
	left: 5%;
	bottom: 10%; /* マイナス値をやめ、動画内に配置 */
}

/* 3. スマホ用動画エリアの高さ調整 */
.mvWrap.sp_heigh_fixwr .mvInner.sp_heigh_fixin {
	width: 100%;
	height: auto;
}

.mvWrap.sp_heigh_fixwr .mvInner.sp_heigh_fixin video {
	display: block;
	width: 100%;
	height: auto;
}