//@charset "utf-8";

//カラー
$color_font:#3E3A39;//フォントカラー1 
$color_font2: #FAECDF; //フォントカラー2
$color_border:rgba(0,0,0,0.2);//ボーダーカラー
$color1:#393537;//メインカラー
$color2:#B19B76;//サブカラー1
$color3:#F1F1F1;//サブカラー2



//ボタングラデ
//背景グラデ
//白カードグラデ
//ボックスシャドウ1
//ボックスシャドウ2

//白カードスタイル（色、シャドウ、角丸）


//ブレイクポイント
$break_pc:1260px;//PC用ブレイクポイント
$break_tb:960px;//タブレット用ブレイクポイント
$break_sp:767px;//スマホ用ブレイクポイント
//$break_sp: 736px; //スマホ用ブレイクポイント



//サイズ
$head_height_pc:100px;//PC用
$head_height_sp:50px;//スマホ用


//マージン
$space:60px;//セクション間マージン

//フォントサイズ
$size_font_main:1.6rem;//PC用
$size_font_main_sp:1.4rem;//スマホ用

//フォントline-height
$lh_main:2.0;//PC用
$lh_main_sp:2.0;//スマホ用


// ベースフォント
//$base_font: 'Noto Sans JP', sans-serif, 'Droid Sans', '游ゴシック体', "Yu Gothic", '游ゴシック', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
//$base_font: "toppan-bunkyu-gothic-pr6n",sans-serif;
$base_font: sans-serif;
$base_font_ie: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;


//イージング
$easing1:cubic-bezier(0.000, 0.490, 0.080, 1);
$easing2:cubic-bezier(0.645, 0.045, 0.355, 1.000);
$easing3:cubic-bezier(0.000, 0.000, 0.395, 0.995);

@use "sass:math";

@function get_px($px){
	//@return $px / 786 * 100 * 1vw;
	//@return $px / 393 * 100 * 1vw;
	@return math.div($px, 393) * 100 * 1vw;
}
//margin-bottom: get_px(100);

@function get_img($px){
	//@return $px / 1440 * 100 * 1vw;
	@return math.div($px, 1440) * 100 * 1vw;
}

@function get_txt($px){
	//@return $px / 16 * 1rem;
	@return math.div($px, 16) * 1rem;
}

//大きいブラウザの時、それ以上大きくしたくない（文字など）→get_txt
//大きいブラウザの時、フレキシブルに大きくする（画像など）→get_img


@mixin btn_hover($bg-color:$color2) {
	position: relative;
	overflow: hidden;
	cursor: pointer;
	&::after {
		content: "";
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		background: $bg-color;
		transform-origin: 50% 100%;
		transform: scaleY(0);
		transition: transform ease .3s;
		z-index: 10;
	}
	a,>span{
		position: relative;
		z-index: 20;
	}

	&:hover {
		&::after {
			transform-origin: 50% 0%;
			transform: scaleY(1);
		}

		a,>span {
			color: #fff;
		}
	}
}
//@include btn_hover($color2);


.web_font_jp {
	// font-family: "Noto Serif JP", serif;
	// font-optical-sizing: auto;
	// font-style: normal;
	// font-weight: 300;
	font-family: "Shippori Mincho B1", serif;
	font-weight: 500; //midium
	font-style: normal;
	&.w_b {
			font-weight: 600; //semibold
		}

}

.web_font_jp2{
	// font-family: "Noto Sans JP", sans-serif;
	// font-optical-sizing: auto;
	// font-weight: 400;
	// font-style: normal;
	font-family: "toppan-bunkyu-gothic-pr6n",
	serif;
	font-weight: 400;//R
	font-style: normal;
	// &.w_l {
	// 	font-weight: 300; //ライト
	// }
	&.w_b {
		font-weight: 600; //DB
	}
}

//デカタイトルフォント
.web_font_en {
	font-family: "Cormorant", serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: italic;
	letter-spacing: -1%;
}

//デカ数字フォント
.web_font_num{
	font-family: "Carattere", cursive;
	font-weight: 400;
	font-style: normal;
}

//ミニセリフフォント
.web_font_en_mini1{


	font-family: "Cormorant", serif;
		font-optical-sizing: auto;
		font-weight: 400;
		font-style: normal;
		letter-spacing: -1%;
	&.w_l {
			font-weight: 300;
			
		}
}

.web_font_en_mini2 {
	font-family: "aktiv-grotesk", sans-serif;
	font-weight: 400;
	font-style: normal;
	letter-spacing: 4%;
	&.w_l{
		font-weight: 300;
	}

}




.btn_style {
	line-height: 1;
	a {
		font-size: get_txt(18);
		display: flex;
		align-items: center;
		position: relative;
	}
	.arrow {
		position: relative;
		display: inline-block;
		width: get_txt(12.4);
		height: get_txt(13.4);
		margin-left: get_txt(9);
		overflow: hidden;

		&::before,&::after {
			content: none;
		}

		span {
			position: absolute;
			inset: 0;
			transform: translateX(0);
		}

		span::before,
		span::after {
			content: "";
			position: absolute;
			top: calc(50% - 0.5px);
			right: 0;
			width: get_txt(14);
			height: 1px;
			border-radius: 9999px;
			background-color: $color_font;
			transform-origin: calc(100% - 0.5px) 50%;
		}

		span::before {
			transform: rotate(28.5deg);
		}

		span::after {
			transform: rotate(-28.5deg);
		}

		.arrow1 {
			transform: translateX(0);
		}

		.arrow2 {
			transform: translateX(-150%);
		}
	}
	// color variants：spanに当てる
	&.white {
		a {
			color: #fff;
		}
		.arrow span::before,
		.arrow span::after {
			background-color: #fff;
		}
	}
	&.white2 {
		a {
			color: $color_font2;
		}

		.arrow span::before,
		.arrow span::after {
			background-color: $color_font2;
		}
	}

	&.color1 {
		a {
			color: #B19B76;
		}

		.arrow span::before,
		.arrow span::after {
			background-color: #B19B76;
		}
	}
	&.small {
		@extend .web_font_en_mini2;
		@extend .web_font_jp2;
		a{
			font-size: get_txt(10);
		}
		.arrow {
			width: get_txt(8);
			height: get_txt(8.6);
			margin-left: get_txt(7);
			margin-top: get_txt(1);
			span::before,span::after {
				width: get_txt(9);
			}
		}
		// &:not(.jp) {
		// 	@extend .web_font_en_mini2;
		// }
	}
	&:not(.jp) {
		//@extend .web_font_en_mini1;
	}
}

.btn_style2 {
	border-radius: get_txt(4);
	height: get_txt(42);
	width: get_txt(178);
	font-size: get_txt(15);
	background: $color2;
	transition: background 0.2s ease;
	position: relative;
	overflow: hidden;
	&:after {
			display: block;
			content: '';
			width: 100%;
			height: 100%;
			background: #000;
			position: absolute;
			top: 0;
			left: 0;
			opacity: 0;
			z-index: 5;
			transition: opacity 0.2s ease;
		}
	>a {
		color: $color_font2;
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		transition: color 0.2s ease;
		z-index: 10;
		
	}
	&:hover{
		//background: $color_font;
		&:after {
			opacity: 0.2;
		}
	}

	.arrow {
		position: relative;
		display: inline-block;
		width: get_txt(12.4);
		height: get_txt(13.4);
		margin-left: get_txt(9);
		overflow: hidden;

		&::before,
		&::after {
			content: none;
		}

		span {
			position: absolute;
			inset: 0;
			transform: translateX(0);
		}

		span::before,
		span::after {
			content: "";
			position: absolute;
			top: calc(50% - 0.5px);
			right: 0;
			width: get_txt(14);
			height: 1px;
			border-radius: 9999px;
			background-color: $color_font2;
			transform-origin: calc(100% - 0.5px) 50%;
		}

		span::before {
			transform: rotate(28.5deg);
		}

		span::after {
			transform: rotate(-28.5deg);
		}

		// 初期：arrow1 表示、arrow2 は左待機
		.arrow1 {
			transform: translateX(0);
		}

		.arrow2 {
			transform: translateX(-150%);
		}
	}

	&.color2 {
		background: $color_font;
	}
	&.color3 {
		background: #fff;
		>a{
			color: $color_font !important;
		}
		.arrow {
			span::before,span::after {
				background-color: $color_font;
			}
		}
	}

}

//ボタンのarrowアニメは共通トリガーで
.btn_anm_trigger {

	// hover IN：1が右へ抜け、2が左から入る
	&.is-hover-in {
		.arrow1 {
			animation: arrowOut 0.55s cubic-bezier(.77, 0, .18, 1) forwards;
		}

		.arrow2 {
			animation: arrowIn 0.55s cubic-bezier(.77, 0, .18, 1) forwards;
		}

		.arrow2 {
			animation-delay: 0.12s;
		}

		// ちょい遅らせたいなら
	}

	// hover OUT：2が右へ抜け、1が左から入る（※ここも左→右）
	&.is-hover-out {
		.arrow2 {
			animation: arrowOut 0.55s cubic-bezier(.77, 0, .18, 1) forwards;
		}

		.arrow1 {
			animation: arrowIn 0.55s cubic-bezier(.77, 0, .18, 1) forwards;
		}

		.arrow1 {
			animation-delay: 0.12s;
		}
	}

}
@keyframes arrowOut {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(150%);
	}
}
@keyframes arrowIn {
	0% {
		transform: translateX(-150%);
	}

	100% {
		transform: translateX(0);
	}
}

@media screen and (max-width: $break_sp) and (orientation: portrait) {
	.btn_style {
			a {
				//font-size: get_px(21);
				font-size: get_px(14);
			}
	
			.arrow {
				width: get_px(10.1);
				height: get_px(10.8);
				margin-left: get_px(9);
	
				span::before,
				span::after {
					//width: get_px(14);
					width: get_px(11);
				}
			}
	

	
			&.small {
				a {
					font-size: get_px(10);
				}
	
				.arrow {
					width: get_txt(8);
					height: get_txt(8.8);
					margin-left: get_txt(7);
					margin-top: get_txt(1);
	
					span::before,
					span::after {
						width: get_txt(9);
					}
				}
			}
		}
	.btn_style2 {
		border-radius: get_px(4);
		height: get_px(40);
		width: 100%;
		font-size: get_px(13);

		.arrow {
			width: get_px(10.1);
			height: get_px(10.8);
			margin-left: get_px(4);

			span::before,
			span::after {
				content: "";
				width: get_px(11);
			}

		}

	}
}

 ////スプリット部分

 .splitBtnTrigger {
 	.arrow{
 		opacity: 0;
 		//transform: translate(0,0);
		//transform: translate(-50%, 0, 0);
		margin-left: get_txt(-20);
 		transition: opacity .25s ease, transform .25s ease,margin .25s ease;
 	}

 	&.is-deco {
 		.arrow{
 			opacity: 1;
			margin-left: 0;
 		}
 	}
	&.reverse{
		.arrow {
			margin-left:get_txt(20);
		}
		&.is-deco {
			.arrow {
				margin-left: 0;
			}
		}

	}
 }

 .splitBtn {
 	display: block;
 	overflow: hidden;
	

 	.text-wrap {
 		position: relative;
 		display: flex;
 		align-items: center;
 		justify-content: center;
 		text-align: center;
		
 	}

 	.after {
 		position: absolute;
 		top: 0;
 		span {
 			transform: translateY(-100%);
 		}
 	}

 	.before,.after {
 		display: flex;
 		align-items: center;
 		justify-content: center;
 		text-align: center;

 		span {
 			line-height: 1.1;
 			transition: color .3s ease-out;
			padding: get_txt(2) 0 get_txt(2);
 		}

 	}

 }
 @media screen and (max-width: $break_sp) and (orientation: portrait) {
.splitBtn {
	padding: get_px(0) 0 get_px(2);
		.before,
		.after {
			span {
				//line-height: 1.1;
				//padding: get_px(0) 0 get_px(10);
			}

		}

	}
 }



//////////////タイトル//////////////

.ttl_style {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
	line-height: 1;
	padding-top: get_txt(0);
	position: relative;
	&.anm_start{
		&:before {
			transform: scaleX(100%);
		}
	}

	&.no_border {
		padding-top: get_img(0);
		&:before {
			display: none;
		}
	}

	&:before {
		display: block;
		content: '';
		width: 100%;
		height: 1px;
		background: #000;
		position: absolute;
		top: 0;
		top:get_txt(18);
		left: 0;
		opacity: 0.28;
		transform: scaleX(0);
		transition: transform 0.65s ease;
		transform-origin: left top;
	}

	.mini {
		@extend .web_font_en_mini2;
		display: flex;
		margin-top: get_txt(38);
		.splitTTlWrapLine{
			padding: get_txt(3) 0 get_txt(3);
			margin-bottom: get_txt(0);
		}
	}

	.big {
		font-size: get_txt(90);
		display: flex;
		@extend .web_font_en;
	}
	.jp{
		font-size: get_txt(16);
		text-align: right;
		letter-spacing: 4%;
		margin-top: get_txt(16);
	}
}

@media screen and (max-width: $break_sp) and (orientation: portrait) {
	.ttl_style {
			display: flex;
			//flex-direction: column-reverse;
			//justify-content: flex-end;
			text-align: right;
			//align-items: flex-end;
			padding-top: get_px(0);

	
			.mini {
				font-size: get_px(11);
				display: block;
				margin-top: get_px(33);
				margin-top: get_px(23);

				position: absolute;
				top: 0;
				left: 0;
				text-align: left;
			}
			>div{
				margin-left: auto;
			}
	
			.big {
				//font-size: get_px(48);
				font-size: get_px(64);
				display: block;
				//margin-bottom:get_px(30);
				&.sp_db{
					display: block;
				}
			}
			.jp {
				font-size: get_px(14);
				letter-spacing: 4%;
				margin-top: get_px(30);
			}
		}

}

///////スプリット
.splitTTlWrapLine {
	overflow: hidden;
	line-height: 0.9;
	padding: get_txt(16) 0 get_txt(16);
	margin-bottom: get_txt(-22);
}
.splitLine {
	overflow: hidden;
	display: block;
	.line {
		position: relative;
		opacity: 1;
		transform: translate(0, 0);
	}
}
//////////////////////////////////////
.char {
	display: inline-block;
	position: relative;
	transform-origin: "50% 100%";

}

@media screen and (max-width: $break_sp) and (orientation: portrait) {

	.splitTTlWrapLine {
		overflow: hidden;
		padding: get_px(11) 0 get_px(11);
		margin-bottom: get_px(-32);
		//padding-top: get_px(1);
		//line-height: 0.85;
	}
}

//////////////View Moreコンテンツ//////////////

.more_contents_style {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	text-align: initial;
	transition: .3s;
	-webkit-line-clamp: 10;//適宜変更
	max-height: 108px;//適宜変更

	mask-image: linear-gradient(to bottom,
				rgba(0, 0, 0, 1) 5%,
				rgba(0, 0, 0, 0) 100%);
	-webkit-mask-image: linear-gradient(to bottom,
				rgba(0, 0, 0, 1) 5%,
				rgba(0, 0, 0, 0) 100%);

	&.sp_only {
		//解除
		overflow: visible;
		display: block;
		-webkit-line-clamp: unset;
		max-height: none;
		mask-image:none;
		-webkit-mask-image:none;
	}
	&.open{
		mask-image:none !important;
		-webkit-mask-image:none !important;
	}
}
.more_button_wrap_style{
	display: flex;
	justify-content: flex-end;
}
.more_button_style{
	border: none;
	background: none;
	color: $color_font;
	padding: 0;
	margin: 0;
	cursor: pointer;
	@extend .web_font_en_mini1;
	&.white{
		color: $color_font2;
	}
}

@media screen and (max-width: $break_sp) and (orientation: portrait) {
	.more_contents_style {

		&,&.sp_only{
			overflow: hidden;
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 10;//適宜変更
			max-height: get_px(240);//適宜変更
			mask-image: linear-gradient(to bottom,
						rgba(0, 0, 0, 1) 5%,
						rgba(0, 0, 0, 0) 100%);
			-webkit-mask-image: linear-gradient(to bottom,
						rgba(0, 0, 0, 1) 5%,
						rgba(0, 0, 0, 0) 100%);
		}

		&.pc_only{
			//解除
			overflow: visible;
			display: block;
			-webkit-line-clamp: unset;
			max-height: none;
			mask-image: none;
			-webkit-mask-image: none;
		}

	}
	.more_button_style {
		font-size: get_px(12);

	}
}

//////////////タグ//////////////

.tag_style {
	background: $color_font;
	color: $color_font2;
	font-size: get_txt(12);
	border-radius: get_txt(2);
	padding: get_txt(4) get_txt(10) get_txt(4);
	//padding: 0 get_txt(10) 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: get_txt(2);
	//height: get_txt(20);
	letter-spacing: 0;
	white-space: nowrap;
	line-height: 1;
	@extend .web_font_en_mini2;
	&.mini{
		font-size: get_txt(10);
	}

	&.white {
		background: #F2EBE0;
		color: #202020;
	}

}
@media screen and (max-width: $break_sp) and (orientation: portrait) {
	.tag_style {
			font-size: get_px(10);
			border-radius: get_px(2);
			padding: get_px(4) get_px(6) get_px(4);
			border-radius: get_px(2);
			letter-spacing: 0;
			&.mini {
				font-size: get_px(10);
				
			}
		}

}

//////////////スワイパーパーツ//////////////
/// 
/// 矢印ボタン

.swiper_btn_area_style {
	&.sp_only {
		display: none;
	}
}

@media screen and (max-width: $break_sp) and (orientation: portrait) {
	.swiper_btn_area_style {

		height: get_px(20);
		
		align-items: center;
		gap: get_px(10);
		&.sp_only{
			display: flex;
		}

		.swiper-button-prev,
		.swiper-button-next {
			width: get_px(16);
			display: flex;
			justify-content: center;

			svg {
				display: none;
			}
		}

		.swiper-button-prev {
			.arrow {
				transform: scale(-1, 1);
			}
		}

		.arrow {
			position: relative;
			display: inline-block;
			width: get_px(10.1);
			height: get_px(10.8);
			overflow: hidden;

			&::before,
			&::after {
				content: "";
				position: absolute;
				top: calc(50% - 0.5px);
				right: 0;
				width: get_px(11);
				height: 1px;
				border-radius: 9999px;
				background-color: $color_font;
				transform-origin: calc(100% - 0.5px) 50%;
			}

			&::before {
				transform: rotate(28.5deg);
			}

			&::after {
				transform: rotate(-28.5deg);
			}

			&.white{
				&::before,&::after{
					background-color: $color_font2;
				}
			}


		}
	}
}
.swiper_btn_area_style2 {

	height: get_txt(50);
	width: get_txt(131);
	display: flex;
	align-items: center;
	gap: get_txt(43);

	// &.sp_only {
	// 	display: flex;
	// }

	.swiper-button-prev,
	.swiper-button-next {
		width: get_txt(44);
		display: flex;
		justify-content: center;
		svg {
			display: none;
		}
		&.swiper-button-disabled{
			opacity: 0.2;
		}
	}

	.swiper-button-prev {
		.arrow {
			transform: scale(-1, 1);
		}
	}
		.arrow {
			position: relative;
			display: inline-block;
			width: get_txt(44);
			height: get_txt(48.1);
		}
	
		.arrow::before,
		.arrow::after {
			content: "";
			position: absolute;
			top: calc(50% - 0.5px);
			right: 0;
			width:get_txt(50);
			height: 1px;
			border-radius: 9999px;
			background-color: $color_font;
			transform-origin: calc(100% - 0.5px) 50%;
		}
	
		.arrow::before {
			transform: rotate(28.75deg);
		}
	
		.arrow::after {
			transform: rotate(-28.75deg);
		}

	// .arrow {
	// 	position: relative;
	// 	display: inline-block;
	// 	width: get_txt(10.1);
	// 	height: get_txt(10.8);
	// 	overflow: hidden;

	// 	&::before,
	// 	&::after {
	// 		content: "";
	// 		position: absolute;
	// 		top: calc(50% - 0.5px);
	// 		right: 0;
	// 		width: get_txt(11);
	// 		height: 1px;
	// 		border-radius: 9999px;
	// 		background-color: $color_font;
	// 		transform-origin: calc(100% - 0.5px) 50%;
	// 	}

	// 	&::before {
	// 		transform: rotate(28.5deg);
	// 	}

	// 	&::after {
	// 		transform: rotate(-28.5deg);
	// 	}

	// 	&.white {

	// 		&::before,
	// 		&::after {
	// 			background-color: $color_font2;
	// 		}
	// 	}


	// }
}

/// スクロールバー
/// 
.swiper-scrollbar_style {
	background-color: rgba(250, 236, 223, 0.1);
	
	height: get_txt(7);
	width: 100%;
	margin: 0 auto;
	border-radius: 100px;
	box-sizing: border-box;
	padding: get_txt(2);
	&.black{
		background-color: rgba(62, 58, 57, 0.1);
		.swiper-scrollbar-drag {
			background-color:rgba(62, 58, 57, 1);
		}
	}
	&.white {
		background-color: rgba(250, 236, 223, 0.4);
		.swiper-scrollbar-drag {
				background-color: rgba(255, 255, 255, 1);
			}
	}
	&.sp_only {
			display: none;
		}
}

.swiper-scrollbar-drag {
	//background-color: #FAECDF;
	background-color: rgba(250, 236, 223, 0.8);
	
	height: get_txt(3);
	border-radius: 100px;
	
	
}

@media screen and (max-width: $break_sp) and (orientation: portrait) {
.swiper-scrollbar_style {
	//background-color: rgba(250, 236, 223, 0.1);
	height: get_px(7);
	width: 100%;
	margin: 0 auto;
	border-radius: 100px;
	box-sizing: border-box;
	padding: get_px(2);
	&.sp_only {
			display: block;
		}

}

.swiper-scrollbar-drag {
	//background-color: #FAECDF;
	height: get_px(3);
	height: get_px(5);
	border-radius: 100px;
}
}

body.load_finish #header {
  opacity: 1;
  transform: translateY(0);
  background-color: #FAECDF;
}
#header {
  transform: translateY(-100%);
}

/*------------------------------------------------------------
#header
------------------------------------------------------------*/
#header {
  top: 0;
  position: fixed;
  z-index: 1000;
  color: #FAECDF;
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 1.5rem 1.5277777778vw;
  box-sizing: border-box;
  opacity: 0;
  transition: opacity 0.3s 0s ease, top 0.3s 0s ease, background 0.3s 0s ease, color 0.3s 0s ease, transform 0.6s 0s ease;
}
#header .nav_area a {
  transition: color 0.3s 0s ease;
}
#header .nav-toggle span {
  transition: background 0.3s 0s ease;
  color: #3E3A39;
}
#header:not(.open).is-scroll-show {
  background: #FAECDF;
  color: #3E3A39;
}
#header:not(.open).is-scroll-show, #header:not(.open).color2{
  background: #FAECDF;
  color: #3E3A39;
}
#header:not(.open).is-scroll-show .logo_area .logo .white {
  display: none;
}
#header:not(.open).is-scroll-show .logo_area .logo .black {
  display: block;
}
#header:not(.open).is-scroll-show .nav_area a {
  color: #3E3A39;
}
#header:not(.open).is-scroll-show .nav_area > ul > li a::after {
  background-color: #3E3A39;
}
#header:not(.open).is-scroll-show .nav_area > ul > li ul:before {
  background: #3E3A39;
  opacity: 0.4;
}
#header:not(.open).is-scroll-show .tel_area a {
  color: #3E3A39;
}
#header:not(.open).is-scroll-show .tel_area a .txt:before {
  background: url(../img/icon_tel.png) left top no-repeat;
  background-size: 0.625rem 0.75rem;
}
#header:not(.open).is-scroll-show .nav-toggle .txt {
  color: #3E3A39;
}
#header:not(.open).is-scroll-show .nav-toggle .btn span {
  background: #3E3A39;
}
#header a {
  color: #fff;
}
#header .header_inner {
  width: 100%;
}
#header .nav_wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  position: relative;
  z-index: 1000;
}
#header .nav_wrap .right_area {
  display: flex;
  align-items: center;
}
#header .logo_area {
  display: flex;
  align-items: center;
}
#header .logo_area .logo {
  width: 10rem;
}
#header .logo_area .logo .black {
  display: block;
}
#header .logo_area .logo .white {
  display: none;
}
#header .logo_area .txt {
  font-size: 0.78125rem;
  margin-left: 1.25rem;
  letter-spacing: 2%;
  color: #3E3A39;
}
#header .nav_area {
  margin-right: 2.9375rem;
}
#header .nav_area > ul {
  display: flex;
  align-items: center;
  gap: 1.625rem;
  font-size: 0.6875rem;
}
#header .nav_area > ul > li {
  display: flex;
  align-items: center;
  letter-spacing: 4%;
  font-weight: 500;
}
#header .nav_area > ul > li a {
  display: inline-block;
  position: relative;
  text-decoration: none;
}
#header:not(.open).is-scroll-show .tel_area .time:before, #header:not(.open).color2 .tel_area .time:before {
    background: #000;
    opacity: 0.4;
}
#header .tel_area .time {
    position: relative;
    padding-left: 0.75rem;
    margin-left: 0.625rem;
    font-size: 0.625rem;
    padding-top: 0.125rem;
    color: #3E3A39;
}
#header .nav_area > ul > li a::after {
  background-color: #fff;
  bottom: 0px;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
  width: 100%;
}
#header .nav_area > ul > li a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}
#header .nav_area > ul > li ul {
  font-size: 0.625rem;
  display: flex;
  gap: 0.75rem;
  position: relative;
  padding-left: 1.25rem;
  margin-left: 1.1875rem;
  padding-right: 0.625rem;
  font-weight: 400;
}
#header .nav_area > ul > li ul:before {
  display: block;
  content: "";
  width: 1px;
  height: 90%;
  background: #fff;
  position: absolute;
  top: 5%;
  left: 0;
  opacity: 0.4;
}
#header .tel_area {
  margin-right: 1rem;
}
#header .tel_area a {
  display: flex;
  align-items: center;
  font-size: 0.8125rem;
}
#header .tel_area a .txt {
  display: block;
  position: relative;
  padding-left: 0.9375rem;
  color: #3E3A39;
}
#header .tel_area a .txt:before {
  display: block;
  content: "";
  width: 0.625rem;
  height: 0.75rem;
  background: url(../img/icon_tel.png) left top no-repeat;
  background-size: 0.625rem 0.75rem;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate3d(0, -50%, 0);
  filter: brightness(0);
}
#header:not(.open).is-scroll-show .tel_area a .txt:before, #header:not(.open).color2 .tel_area a .txt:before {
    background: url(../img/icon_tel_b.png) left top no-repeat;
    background-size: 0.625rem 0.75rem;
}
#header .mini_cv_btn_area {
  margin-right: 1.875rem;
}
#header .mini_cv_btn_area .btn_style2 {
  height: 2.125rem;
  width: 5.625rem;
  font-size: 0.875rem;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0);
}
#header .nav-toggle {
  top: 0rem;
  cursor: pointer;
  display: flex;
  align-items: center;
}
#header .nav-toggle .txt {
  padding-right: 0.625rem;
  font-size: 0.9375rem;
  position: relative;
}
#header .nav-toggle .txt .txt2 {
  display: none;
}
#header .nav-toggle .btn {
  position: relative;
  height: 100%;
  width: 100%;
  width: 1.25rem;
  height: 0.9375rem;
}
#header .nav-toggle .btn span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #3E3A39;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
#header .nav-toggle .btn span:nth-child(1) {
  margin-top: -6px;
  background: #3E3A39;
}
#header .nav-toggle .btn span:nth-child(2) {
  margin-top: 6px;
  background: #3E3A39;
}
#header .in_wrap {
  display: block;
  position: fixed;
  z-index: 900;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  box-sizing: border-box;
  transform: translateY(-100%);
  transition: transform 0.4s 0s ease;
}
#header .in_wrap:before {
  display: block;
  content: "";
  width: 100%;
  height: 52.8472222222vw;
  height: 100%;
  background: #B19B76;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 800;
  opacity: 0;
  transition: opacity 0.4s 0s ease;
}
#header .in_wrap .in_wrap_in {
  padding: 11.25vw 4.8611111111vw 2.0833333333vw 5.5555555556vw;
  z-index: 900;
  position: relative;
  opacity: 0;
  box-sizing: border-box;
  max-height: 100vh;
  overflow-y: scroll;
  transition: opacity 0.2s 0s ease;
}
#header .in_wrap .in_wrap_in:before {
  display: block;
  content: "";
  width: calc(100% - 2.7777777778vw);
  height: 1px;
  background: #fff;
  position: absolute;
  top: 6.1111111111vw;
  left: 1.3888888889vw;
  opacity: 0.3;
}
#header .in_wrap .wrap {
  display: flex;
  justify-content: space-between;
}
#header .in_wrap .wrap .left_area .in_nav_area > ul > li {
  margin-bottom: 0.875rem;
  font-size: 0.875rem;
  letter-spacing: 4%;
}
#header .in_wrap .wrap .left_area .in_nav_area > ul > li a {
  color: #fff;
  display: inline-block;
  position: relative;
  text-decoration: none;
}
#header .in_wrap .wrap .left_area .in_nav_area > ul > li a::after {
  background-color: #fff;
  bottom: 0px;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
  width: 100%;
}
#header .in_wrap .wrap .left_area .in_nav_area > ul > li a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}
#header .in_wrap .wrap .left_area .in_nav_area > ul > li ul {
  display: flex;
  gap: 1.25rem;
  margin: 0.375rem 0 0;
  padding-bottom: 0.625rem;
}
#header .in_wrap .wrap .left_area .in_nav_area > ul > li ul li {
  opacity: 0.6;
  font-size: 0.8125rem;
}
#header .in_wrap .wrap .right_area .access_area {
  display: flex;
  margin-bottom: 6.25vw;
}
#header .in_wrap .wrap .right_area .access_area dl {
  width: 18.0555555556vw;
}
#header .in_wrap .wrap .right_area .access_area dl dt {
  font-size: 0.625rem;
  margin-bottom: 1.25rem;
}
#header .in_wrap .wrap .right_area .access_area dl dd .txt1 {
  font-size: 0.75rem;
  margin-bottom: 1.25rem;
  line-height: 1.4;
}
#header .in_wrap .wrap .right_area .access_area dl dd .txt2 {
  font-size: 0.625rem;
  line-height: 1.8;
  margin-bottom: 2.5rem;
}
#header .in_wrap .wrap .right_area .access_area dl dd .txt3 {
  font-size: 0.75rem;
  margin-bottom: 1.25rem;
  line-height: 1.6;
}
#header .in_wrap .wrap .right_area .btn_area {
  display: flex;
  gap: 0.625rem;
}
#header .in_wrap .bottom_area {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
#header .in_wrap .bottom_area .copy {
  display: block;
  font-size: 0.6875rem;
}
#header .in_wrap .bottom_area .mini_nav_area ul {
  display: flex;
  gap: 1.5rem;
  font-size: 0.625rem;
}
#header .in_wrap .bottom_area .mini_nav_area ul a {
  color: #FAECDF;
}
#header .in_wrap .bottom_area .mini_nav_area ul a {
  display: inline-block;
  position: relative;
  text-decoration: none;
}
#header .in_wrap .bottom_area .mini_nav_area ul a::after {
  background-color: #fff;
  bottom: 0px;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
  width: 100%;
}
#header .in_wrap .bottom_area .mini_nav_area ul a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}
#header .in_wrap .bottom_area .img_area {
  width: 12.5vw;
  position: relative;
}
#header .in_wrap .bottom_area .img_area:hover .img:after {
  opacity: 0.4;
}
#header .in_wrap .bottom_area .img_area:hover .img img {
  transform: scale(1.1);
}
#header .in_wrap .bottom_area .img_area button {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
  background: none;
  border: none;
  cursor: pointer;
}
#header .in_wrap .bottom_area .img_area .img {
  line-height: 0;
  overflow: hidden;
  border-radius: 0.375rem;
  position: relative;
}
#header .in_wrap .bottom_area .img_area .img:before {
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 0.375rem solid transparent;
  border-bottom: 0.375rem solid transparent;
  border-left: 0.8125rem solid #FFFFFF;
  border-right: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
  position: absolute;
}
#header .in_wrap .bottom_area .img_area .img:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 4;
  transition: opacity 0.3s ease;
}
#header .in_wrap .bottom_area .img_area .img img {
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease;
}
#header .in_wrap .bottom_area .img_area .txt {
  margin-top: 0.3125rem;
  font-size: 0.625rem;
  display: flex;
  justify-content: space-between;
}
#header .in_wrap .bottom_area .img_area .txt .jp {
  letter-spacing: 4%;
  color: #fff;
}
#header .in_wrap .bottom_area .img_area .txt .en {
  color: #FAECDF;
}
#header.open .mini_cv_btn_area .btn_style2 {
  border: 1px solid rgb(255, 255, 255);
}
#header.open .nav-toggle .txt .txt1 {
  display: none;
}
#header.open .nav-toggle .txt .txt2 {
  display: block;
}
#header.open .nav-toggle .btn span {
  margin-left: -0.625rem;
}
#header.open .nav-toggle .btn span:nth-child(1) {
  margin-top: 0;
  -webkit-transform: rotate(30deg);
  -moz-transform: rotate(30deg);
  transform: rotate(30deg);
}
#header.open .nav-toggle .btn span:nth-child(2) {
  margin-top: 0;
  -webkit-transform: rotate(-30deg);
  -moz-transform: rotate(-30deg);
  transform: rotate(-30deg);
}
#header.open .nav-toggle .btn span:nth-child(3) {
  opacity: 0;
}
#header.open .in_wrap {
  transform: translateY(0);
}
#header.open .in_wrap:before {
  opacity: 1;
}
#header.open .in_wrap .in_wrap_in {
  transition: opacity 0.2s 0.5s ease;
  opacity: 1;
}
/* ハンバーガーメニューopen時のロゴバー白字化 */
#header.open .logo_area .logo .black {
  display: none;
}
#header.open .logo_area .logo .white {
  display: block;
}
#header.open .logo_area .txt {
  color: #fff;
}
#header.open .tel_area a .txt {
  color: #fff;
}
#header.open .tel_area a .time {
  color: #fff;
}
#header.open .nav-toggle .txt {
  color: #fff;
}
#header.open .nav-toggle .btn span,
#header.open .nav-toggle .btn span:nth-child(1),
#header.open .nav-toggle .btn span:nth-child(2),
#header.open .nav-toggle .btn span:nth-child(3) {
  background: #fff;
}
#header.open .nav-toggle .txt .txt2 {
  color: #fff;
}
#header.open .tel_area .time:before {
  background: #fff;
}
#header.open .tel_area a .txt:before {
  filter: brightness(0) invert(1);
}

@media screen and (max-width: 767px) and (orientation: portrait) {
  #header {
    color: #3E3A39;
    background: #FAECDF;
    width: 100%;
    padding: 4.3256997455vw 4.0712468193vw 10.1781170483vw;
  }
  #header .logo_area {
    display: flex;
    align-items: center;
  }
  #header .logo_area .logo {
    width: 35.1145038168vw;
  }
  #header .logo_area .logo .black {
    display: block;
  }
  #header .logo_area .logo .white {
    display: none;
  }
  #header .logo_area .txt {
    display: none;
  }
  #header .nav_area {
    display: none;
  }
  #header .tel_area {
    display: none;
  }
  #header .mini_cv_btn_area {
    margin-right: 3.3078880407vw;
  }
  #header .mini_cv_btn_area .btn_style2 {
    height: 7.1246819338vw;
    width: 18.8295165394vw;
    font-size: 3.0534351145vw;
  }
  #header .nav-toggle {
    top: 0vw;
  }
  #header .nav-toggle .txt {
    display: none;
  }
  #header .nav-toggle .btn {
    width: 4.3256997455vw;
    height: 3.8167938931vw;
  }
  #header .nav-toggle .btn span {
    height: 1px;
    background: #3E3A39;
  }
  #header .nav-toggle .btn span:nth-child(1) {
    margin-top: -6px;
  }
  #header .nav-toggle .btn span:nth-child(2) {
    margin-top: 6px;
  }
  #header .in_wrap {
    bottom: 0;
    height: 100vh;
    box-sizing: border-box;
  }
  #header .in_wrap .in_wrap_in {
    height: 100vh;
    color: #fff;
    padding: 31.0432569975vw 3.0534351145vw 40.7124681934vw 19.5928753181vw;
  }
  #header .in_wrap .in_wrap_in:before {
    display: none;
  }
  #header .in_wrap .wrap {
    display: block;
    justify-content: space-between;
  }
  #header .in_wrap .wrap .left_area {
    margin-bottom: 10.1781170483vw;
  }
  #header .in_wrap .wrap .left_area .in_nav_area {
    width: 100%;
  }
  #header .in_wrap .wrap .left_area .in_nav_area > ul > li {
    font-size: 3.0534351145vw;
    margin-bottom: 0vw;
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  }
  #header .in_wrap .wrap .left_area .in_nav_area > ul > li > a {
    padding: 3.0534351145vw 0 1.0178117048vw;
  }
  #header .in_wrap .wrap .left_area .in_nav_area > ul > li ul {
    display: flex;
    gap: 4.0712468193vw;
    margin: 0 0 0;
    padding-bottom: 2.5445292621vw;
  }
  #header .in_wrap .wrap .left_area .in_nav_area > ul > li ul li {
    opacity: 0.6;
    font-size: 2.7989821883vw;
  }
  #header .in_wrap .wrap .right_area .access_area {
    display: block;
    padding: 0;
    margin-bottom: 12.7226463104vw;
  }
  #header .in_wrap .wrap .right_area .access_area dl {
    width: 100%;
    margin-bottom: 10.1781170483vw;
  }
  #header .in_wrap .wrap .right_area .access_area dl:last-child {
    margin-bottom: 0;
  }
  #header .in_wrap .wrap .right_area .access_area dl dt {
    font-size: 2.5445292621vw;
    margin-bottom: 4.0712468193vw;
    opacity: 0.4;
  }
  #header .in_wrap .wrap .right_area .access_area dl dd .txt1 {
    font-size: 3.0534351145vw;
    margin-bottom: 4.0712468193vw;
  }
  #header .in_wrap .wrap .right_area .access_area dl dd .txt2 {
    font-size: 2.5445292621vw;
    line-height: 1.8;
  }
  #header .in_wrap .wrap .right_area .access_area dl dd .txt3 {
    font-size: 3.0534351145vw;
    margin-bottom: 4.0712468193vw;
  }
  #header .in_wrap .wrap .right_area .btn_area {
    display: none;
  }
  #header .in_wrap .bottom_area {
    display: flex;
    flex-direction: column-reverse;
    justify-content: flex-start;
    align-items: flex-start;
  }
  #header .in_wrap .bottom_area .copy {
    display: block;
    font-size: 2.7989821883vw;
  }
  #header .in_wrap .bottom_area .mini_nav_area {
    margin-bottom: 15.2671755725vw;
  }
  #header .in_wrap .bottom_area .mini_nav_area ul {
    display: block;
    gap: 0;
    font-size: 2.5445292621vw;
  }
  #header .in_wrap .bottom_area .mini_nav_area ul li {
    margin-bottom: 2.5445292621vw;
  }
  #header .in_wrap .bottom_area .img_area {
    width: 60.8142493639vw;
    margin-left: 0;
    margin-bottom: 15.2671755725vw;
  }
  #header .in_wrap .bottom_area .img_area .img {
    border-radius: 1.5267175573vw;
    height: 40.7124681934vw;
  }
  #header .in_wrap .bottom_area .img_area .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #header .in_wrap .bottom_area .img_area .img:before {
    display: block;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-top: 2.2900763359vw solid transparent;
    border-bottom: 2.2900763359vw solid transparent;
    border-left: 5.0890585242vw solid #FFFFFF;
    border-right: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    position: absolute;
  }
  #header .in_wrap .bottom_area .img_area .txt {
    margin-top: 1.0178117048vw;
    font-size: 2.5445292621vw;
  }
  #header.open .logo_area .logo .black {
    display: none;
  }
  #header.open .logo_area .logo .white {
    display: block;
  }
  #header.open .nav-toggle span {
    margin-left: -4.0712468193vw;
    background: #fff;
  }
}
/*------------------------------------------------------------
#footer
------------------------------------------------------------*/
#footer {
  background: #D9CDBF;
  color: #FAECDF;
  padding: 4.8611111111vw 0 1.3888888889vw;
  position: relative;
  z-index: 10;
}
#footer:before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #393537;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 15;
  border-radius: 0.625rem 0.625rem 0 0;
}
#footer .pagetop {
  background: #4C4242;
  border-radius: 0 0.625rem 0 0.625rem;
  position: absolute;
  z-index: 20;
  top: 0;
  right: 0;
  font-size: 0.625rem;
}
#footer .pagetop a {
  color: #fff;
  width: 6.25rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
#footer .footer_inner {
  z-index: 20;
  position: relative;
}
#footer #News_area {
  margin-bottom: 4.6875rem;
}
#footer #News_area .wrap {
  padding-bottom: 2.75rem;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
#footer #News_area .wrap:before {
  display: block;
  content: "";
  width: 100%;
  height: 1px;
  background: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.2;
}
#footer #News_area .ttl_area {
  width: 23.6111111111vw;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
#footer #News_area .ttl_area .btn_area {
  display: flex;
  justify-content: flex-end;
}
#footer #News_area .content_area ul {
  display: flex;
  gap: 1.25vw;
}
#footer #News_area .content_area ul li {
  position: relative;
  width: 22.2222222222vw;
}
#footer #News_area .content_area ul li > a {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
}
#footer #News_area .content_area ul li dl {
  display: flex;
  justify-content: space-between;
}
#footer #News_area .content_area ul li dl dt {
  width: 6.9444444444vw;
  line-height: 0;
  border-radius: 0.25rem;
  overflow: hidden;
}
#footer #News_area .content_area ul li dl dd {
  width: 14.5833333333vw;
}
#footer #News_area .content_area ul li .sub_area {
  display: flex;
  align-items: center;
  margin-bottom: 0.25rem;
}
#footer #News_area .content_area ul li .sub_area .day {
  font-size: 0.625rem;
  margin-right: 0.625rem;
}
#footer #News_area .content_area ul li .sub_area .tag_area {
  display: flex;
  align-items: center;
  gap: 0.1875rem;
  margin-bottom: 0.375rem;
}
#footer #News_area .content_area ul li .txt {
  line-height: 1.4;
  font-size: 0.6875rem;
}
#footer #News_area .swiper_btn_area_style {
  display: none;
}
#footer #Access_area .wrap {
  display: flex;
  position: relative;
  padding-bottom: 4.6875rem;
}
#footer #Access_area .wrap:before {
  display: block;
  content: "";
  width: 100%;
  height: 1px;
  background: #fff;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.2;
}
#footer #Access_area .img_area {
    width: 30.3472222222vw;
    height: 16.25vw;
    margin-right: 5.4166666667vw;
    border-radius: 0.375rem;
    overflow: hidden;
}
#footer #Access_area .img_area img {
  border-radius: 0.375rem;
}
#footer #Access_area .content_area {
  display: flex;
}
#footer #Access_area .content_area dl {
  width: 18.0555555556vw;
}
#footer #Access_area .content_area dl dt {
  font-size: 0.625rem;
  margin-bottom: 2.5rem;
}
#footer #Access_area .content_area dl dd .txt1 {
  font-size: 0.75rem;
  margin-bottom: 1.25rem;
  line-height: 1.4;
}
#footer #Access_area .content_area dl dd .txt2 {
  font-size: 0.625rem;
  line-height: 1.8;
  margin-bottom: 2.5rem;
}
#footer #Access_area .content_area dl dd .txt3 {
  font-size: 0.75rem;
  margin-bottom: 1.25rem;
  line-height: 1.6;
}
#footer .bottom_top_area {
  padding-top: 1.25rem;
  margin-bottom: 5.5555555556vw;
}
#footer .bottom_top_area .wrap {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
}
#footer .bottom_top_area #Reservation_area {
  margin-top: -1.0625rem;
  width: 50%;
}
#footer .bottom_top_area #Reservation_area .ttl_area .ttl_style {
  display: flex;
  justify-content: flex-end;
  color: #B19B76;
}
#footer .bottom_top_area #Reservation_area .ttl_area .ttl_style .big {
  font-size: 6.875rem;
}
.ttl_style .big {
    font-size: 5.625rem;
    display: flex;
}
.web_font_en, #Mv_area .ttl .en, #Facility_area .top_menu_area ul li h3, #Facility_area .bottom_menu_area h3, #Case_area .content_area > section ul li dl dt h4, .ttl_style .big {
    font-family: "Cormorant", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: italic;
    letter-spacing: -1%;
}
#footer .bottom_top_area #Reservation_area .btn_area {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  margin-bottom: 5rem;
  gap: 2.0833333333vw;
}
#footer .bottom_top_area #Reservation_area .btn_area .btn_style {
  margin-bottom: -1rem;
}
#footer .bottom_top_area #Reservation_area .btn_area .btn_style.white2 {
  opacity: 0.6;
}
#footer .bottom_top_area #Reservation_area .img_area {
  margin-left: auto;
  width: 12.5vw;
  position: relative;
}
#footer .bottom_top_area #Reservation_area .img_area:hover .img:after {
  opacity: 0.4;
}
#footer .bottom_top_area #Reservation_area .img_area:hover .img img {
  transform: scale(1.1);
}
#footer .bottom_top_area #Reservation_area .img_area button {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 10;
  background: none;
  border: none;
  cursor: pointer;
}
#footer .bottom_top_area #Reservation_area .img_area .img {
  line-height: 0;
  overflow: hidden;
  border-radius: 0.375rem;
  position: relative;
}
#footer .bottom_top_area #Reservation_area .img_area .img:before {
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 0.375rem solid transparent;
  border-bottom: 0.375rem solid transparent;
  border-left: 0.8125rem solid #FFFFFF;
  border-right: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
  position: absolute;
}
#footer .bottom_top_area #Reservation_area .img_area .img:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 4;
  transition: opacity 0.3s ease;
}
#footer .bottom_top_area #Reservation_area .img_area .img img {
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease;
}
#footer .bottom_top_area #Reservation_area .img_area .txt {
  margin-top: 0.3125rem;
  font-size: 0.625rem;
  display: flex;
  justify-content: space-between;
}
#footer .bottom_top_area #Reservation_area .img_area .txt .jp {
  letter-spacing: 4%;
  color: #fff;
}
#footer .bottom_top_area #Reservation_area .img_area .txt .en {
  color: #FAECDF;
}
#footer .bottom_top_area .nav_area {
  width: 50%;
  margin-top: 1.3888888889vw;
}
#footer .bottom_top_area .nav_area > ul > li {
  margin-bottom: 0.9rem;
}
#footer .bottom_top_area .nav_area > ul > li a {
  color: #fff;
  font-size: 9.768px;
}
#footer .bottom_top_area .nav_area > ul > li a {
  display: inline-block;
  position: relative;
  text-decoration: none;
}
#footer .bottom_top_area .nav_area > ul > li a::after {
  background-color: #fff;
  bottom: 0px;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
  width: 100%;
}
#footer .bottom_top_area .nav_area > ul > li a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}
#footer .bottom_top_area .nav_area > ul > li ul {
  display: flex;
  gap: 1.25rem;
  margin: 0.375rem 0 0;
  padding-bottom: 0.625rem;
}
#footer .bottom_top_area .nav_area > ul > li ul li {
  opacity: 0.6;
}
#footer .bottom_bottom_area .wrap {
  display: flex;
  justify-content: space-between;
}
#footer .bottom_bottom_area .nav_area ul {
  display: flex;
  gap: 1.5rem;
  font-size: 0.625rem;
}
#footer .bottom_bottom_area .nav_area ul a {
  color: #FAECDF;
}
#footer .bottom_bottom_area .nav_area ul a {
  display: inline-block;
  position: relative;
  text-decoration: none;
}
#footer .bottom_bottom_area .nav_area ul a::after {
  background-color: #fff;
  bottom: 0px;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
  width: 100%;
}
#footer .bottom_bottom_area .nav_area ul a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}
#footer .bottom_bottom_area .logo {
  width: 9.7222222222vw;
}
#footer .bottom_bottom_area .right_area {
  display: flex;
}
#footer .bottom_bottom_area .right_area .sns_area {
  display: flex;
  gap: 0.375rem;
}
#footer .bottom_bottom_area .right_area .sns_area li {
  width: 1.625rem;
}
#footer .bottom_bottom_area .right_area small {
  display: block;
  margin-left: 4.1666666667vw;
  font-size: 0.6875rem;
}

@media screen and (max-width: 767px) and (orientation: portrait) {
  #footer {
    padding: 9.2315521628vw 0 25.3740458015vw;
  }
  #footer .pagetop {
    border-radius: 0 2.5445292621vw 0 2.5445292621vw;
    font-size: 2.5445292621vw;
  }
  #footer .pagetop a {
    width: 19.5928753181vw;
    height: 7.8880407125vw;
  }
  #footer #News_area {
    margin-bottom: 6.106870229vw;
  }
  #footer #News_area .wrap {
    padding-bottom: 2.5445292621vw;
    display: block;
  }
  #footer #News_area .ttl_area {
    width: 100%;
    justify-content: center;
    position: relative;
  }
  #footer #News_area .ttl_area .btn_area {
    display: flex;
    justify-content: flex-end;
  }
  #footer #News_area .content_area {
    margin-bottom: 7.1246819338vw;
  }
  #footer #News_area .content_area ul {
    display: flex;
    gap: 0;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
  #footer #News_area .content_area ul::-webkit-scrollbar {
      display: none;
  }
  #footer #News_area .content_area ul li {
    position: relative;
    width: 74.5547073791vw;
  }
  #footer #News_area .content_area ul li:before {
    display: block;
    content: "";
    width: 1px;
    height: 100%;
    background: #fff;
    position: absolute;
    top: 0;
    right: 3.8167938931vw;
    opacity: 0.2;
  }
  #footer #News_area .content_area ul li:last-child:before {
    display: none;
  }
  #footer #News_area .content_area ul li dl {
    width: 74.5547073791vw;
    padding-right: 6.3613231552vw;
    box-sizing: border-box;
  }
  #footer #News_area .content_area ul li dl dt {
    width: 25.4452926209vw;
    border-radius: 1.0178117048vw;
  }
  #footer #News_area .content_area ul li dl dd {
    width: 40.7124681934vw;
  }
  #footer #News_area .content_area ul li .sub_area .day {
    font-size: 2.5445292621vw;
    margin-right: 2.5445292621vw;
  }
  #footer #News_area .content_area ul li .sub_area .tag_area {
    gap: 0.7633587786vw;
    margin-bottom: 1.5267175573vw;
  }
  #footer #News_area .content_area ul li .txt {
    font-size: 2.5445292621vw;
    white-space: normal;
  }
  #footer #News_area .swiper_btn_area_style {
    display: flex;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  #footer #Access_area .wrap {
    display: block;
    padding-bottom: 15.2671755725vw;
  }
  #footer #Access_area .img_area {
    width: 100%;
    margin-right: 0;
    margin-bottom: 6.106870229vw;
    width: 94.9109414758vw;
    height: 50.8905852417vw;
  }
  #footer #Access_area .img_area img {
    border-radius: 1.5267175573vw;
  }
  #footer #Access_area .content_area {
    display: block;
    padding: 0 2.5445292621vw;
  }
  #footer #Access_area .content_area dl {
    width: 100%;
    margin-bottom: 10.1781170483vw;
  }
  #footer #Access_area .content_area dl:last-child {
    margin-bottom: 0;
  }
  #footer #Access_area .content_area dl dt {
    font-size: 2.5445292621vw;
    margin-bottom: 4.0712468193vw;
  }
  #footer #Access_area .content_area dl dd .txt1 {
    font-size: 3.0534351145vw;
    margin-bottom: 4.0712468193vw;
    line-height: 1.4;
  }
  #footer #Access_area .content_area dl dd .txt2 {
    font-size: 2.5445292621vw;
    line-height: 1.8;
    margin-bottom: 8.1424936387vw;
  }
  #footer #Access_area .content_area dl dd .txt3 {
  font-size: 2.75rem;
  margin-bottom: 1.25rem;
  line-height: 1.6;
}
  #footer .bottom_top_area {
    padding-top: 2.5445292621vw;
    margin-bottom: 17.8117048346vw;
  }
  #footer .bottom_top_area .wrap {
    display: block;
  }
  #footer .bottom_top_area #Reservation_area {
    width: 100%;
    margin-bottom: 15.2671755725vw;
  }
  #footer .bottom_top_area #Reservation_area .ttl_area {
    margin-bottom: 7.6335877863vw;
  }
  #footer .bottom_top_area #Reservation_area .ttl_area .ttl_style {
    display: flex;
    justify-content: flex-end;
  }
  #footer .bottom_top_area #Reservation_area .btn_area {
    margin-bottom: 10.1781170483vw;
    gap: 5.0890585242vw;
  }
  #footer .bottom_top_area #Reservation_area .btn_area .btn_style a {
    font-size: 3.8167938931vw;
  }
  #footer .bottom_top_area #Reservation_area .btn_area .btn_style.white2 {
    opacity: 0.6;
  }
  #footer .bottom_top_area #Reservation_area .img_area {
    width: 41.7302798982vw;
  }
  #footer .bottom_top_area #Reservation_area .img_area .img {
    border-radius: 1.5267175573vw;
    height: 21.3740458015vw;
  }
  #footer .bottom_top_area #Reservation_area .img_area .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #footer .bottom_top_area #Reservation_area .img_area .img:before {
    display: block;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-top: 1.5267175573vw solid transparent;
    border-bottom: 1.5267175573vw solid transparent;
    border-left: 3.3078880407vw solid #FFFFFF;
    border-right: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    position: absolute;
  }
  #footer .bottom_top_area #Reservation_area .img_area .txt {
    margin-top: 2.5445292621vw;
    font-size: 2.5445292621vw;
    display: none;
  }
  #footer .bottom_top_area .nav_area {
    width: 100%;
  }
  #footer .bottom_top_area .nav_area > ul > li {
    margin-bottom: 2.5445292621vw;
  }
  #footer .bottom_top_area .nav_area > ul > li ul {
    display: flex;
    gap: 4.0712468193vw;
    margin: 1.5267175573vw 0 0;
    padding-bottom: 2.5445292621vw;
    font-size: 2.7989821883vw;
  }
  #footer .bottom_top_area .nav_area > ul > li ul li {
    opacity: 0.6;
  }
  #footer .bottom_bottom_area .wrap {
    align-items: flex-end;
  }
  #footer .bottom_bottom_area .nav_area ul {
    display: block;
    gap: 0vw;
    font-size: 2.5445292621vw;
  }
  #footer .bottom_bottom_area .nav_area ul li {
    margin-bottom: 1.5267175573vw;
  }
  #footer .bottom_bottom_area .nav_area ul li:last-child {
    margin-bottom: 0;
  }
  #footer .bottom_bottom_area .logo {
    display: none;
  }
  #footer .bottom_bottom_area .right_area {
    display: block;
  }
  #footer .bottom_bottom_area .right_area .sns_area {
    justify-content: flex-end;
    gap: 1.5267175573vw;
    margin-bottom: 5.0890585242vw;
  }
  #footer .bottom_bottom_area .right_area .sns_area li {
    width: 6.6157760814vw;
  }
  #footer .bottom_bottom_area .right_area small {
    display: block;
    margin-left: 0;
    font-size: 2.7989821883vw;
  }
}
.btn_style {
  line-height: 1;
}
.btn_style a {
  font-size: 1.125rem;
  display: flex;
  align-items: center;
  position: relative;
}
.btn_style .arrow {
  position: relative;
  display: inline-block;
  width: 0.775rem;
  height: 0.8375rem;
  margin-left: 0.5625rem;
  overflow: hidden;
}
.btn_style .arrow::before, .btn_style .arrow::after {
  content: none;
}
.btn_style .arrow span {
  position: absolute;
  inset: 0;
  transform: translateX(0);
}
.btn_style .arrow span::before,
.btn_style .arrow span::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.5px);
  right: 0;
  width: 0.875rem;
  height: 1px;
  border-radius: 9999px;
  background-color: #3E3A39;
  transform-origin: calc(100% - 0.5px) 50%;
}
.btn_style .arrow span::before {
  transform: rotate(28.5deg);
}
.btn_style .arrow span::after {
  transform: rotate(-28.5deg);
}
.btn_style .arrow .arrow1 {
  transform: translateX(0);
}
.btn_style .arrow .arrow2 {
  transform: translateX(-150%);
}
.btn_style.white a {
  color: #fff;
}
.btn_style.white .arrow span::before,
.btn_style.white .arrow span::after {
  background-color: #fff;
}
.btn_style.white2 a {
  color: #FAECDF;
}
.btn_style.white2 .arrow span::before,
.btn_style.white2 .arrow span::after {
  background-color: #FAECDF;
}
.btn_style.color1 a {
  color: #B19B76;
}
.btn_style.color1 .arrow span::before,
.btn_style.color1 .arrow span::after {
  background-color: #B19B76;
}
.btn_style.small a {
  font-size: 0.625rem;
}
.btn_style.small .arrow {
  width: 0.5rem;
  height: 0.5375rem;
  margin-left: 0.4375rem;
  margin-top: 0.0625rem;
}
.btn_style.small .arrow span::before, .btn_style.small .arrow span::after {
  width: 0.5625rem;
}
.btn_style2 {
  border-radius: 0.25rem;
  height: 2.625rem;
  width: 11.125rem;
  font-size: 0.9375rem;
  background: #B19B76;
  transition: background 0.2s ease;
  position: relative;
  overflow: hidden;
}
.btn_style2:after {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 5;
  transition: opacity 0.2s ease;
}
.btn_style2 > a {
  color: #FAECDF;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  transition: color 0.2s ease;
  z-index: 10;
}
.btn_style2:hover:after {
  opacity: 0.2;
}
.btn_style2 .arrow {
  position: relative;
  display: inline-block;
  width: 0.775rem;
  height: 0.8375rem;
  margin-left: 0.5625rem;
  overflow: hidden;
}
.btn_style2 .arrow::before, .btn_style2 .arrow::after {
  content: none;
}
.btn_style2 .arrow span {
  position: absolute;
  inset: 0;
  transform: translateX(0);
}
.btn_style2 .arrow span::before,
.btn_style2 .arrow span::after {
  content: "";
  position: absolute;
  top: calc(50% - 0.5px);
  right: 0;
  width: 0.875rem;
  height: 1px;
  border-radius: 9999px;
  background-color: #FAECDF;
  transform-origin: calc(100% - 0.5px) 50%;
}
.btn_style2 .arrow span::before {
  transform: rotate(28.5deg);
}
.btn_style2 .arrow span::after {
  transform: rotate(-28.5deg);
}
.btn_style2 .arrow .arrow1 {
  transform: translateX(0);
}
.btn_style2 .arrow .arrow2 {
  transform: translateX(-150%);
}
.btn_style2.color2 {
  background: #3E3A39;
}
.btn_style2.color3 {
  background: #fff;
}
.btn_style2.color4 {
  background: #FC8959;
}
.btn_style2.color3 > a {
  color: #3E3A39 !important;
}
.btn_style2.color3 .arrow span::before, .btn_style2.color3 .arrow span::after {
  background-color: #3E3A39;
}

.btn_anm_trigger.is-hover-in .arrow1 {
  animation: arrowOut 0.55s cubic-bezier(0.77, 0, 0.18, 1) forwards;
}
.btn_anm_trigger.is-hover-in .arrow2 {
  animation: arrowIn 0.55s cubic-bezier(0.77, 0, 0.18, 1) forwards;
}
.btn_anm_trigger.is-hover-in .arrow2 {
  animation-delay: 0.12s;
}
.btn_anm_trigger.is-hover-out .arrow2 {
  animation: arrowOut 0.55s cubic-bezier(0.77, 0, 0.18, 1) forwards;
}
.btn_anm_trigger.is-hover-out .arrow1 {
  animation: arrowIn 0.55s cubic-bezier(0.77, 0, 0.18, 1) forwards;
}
.btn_anm_trigger.is-hover-out .arrow1 {
  animation-delay: 0.12s;
}

@keyframes arrowOut {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(150%);
  }
}
@keyframes arrowIn {
  0% {
    transform: translateX(-150%);
  }
  100% {
    transform: translateX(0);
  }
}
@media screen and (max-width: 767px) and (orientation: portrait) {
  .btn_style a {
    font-size: 3.5623409669vw;
  }
  .btn_style .arrow {
    width: 2.5699745547vw;
    height: 2.7480916031vw;
    margin-left: 2.2900763359vw;
  }
  .btn_style .arrow span::before,
  .btn_style .arrow span::after {
    width: 2.7989821883vw;
  }
  .btn_style.small a {
    font-size: 2.5445292621vw;
  }
  .btn_style.small .arrow {
    width: 0.5rem;
    height: 0.55rem;
    margin-left: 0.4375rem;
    margin-top: 0.0625rem;
  }
  .btn_style.small .arrow span::before,
  .btn_style.small .arrow span::after {
    width: 0.5625rem;
  }
  .btn_style2 {
    border-radius: 1.0178117048vw;
    height: 10.1781170483vw;
    width: 100%;
    font-size: 3.3078880407vw;
  }
  .btn_style2 .arrow {
    width: 2.5699745547vw;
    height: 2.7480916031vw;
    margin-left: 1.0178117048vw;
  }
  .btn_style2 .arrow span::before,
  .btn_style2 .arrow span::after {
    content: "";
    width: 2.7989821883vw;
  }
}
.splitBtnTrigger .arrow {
  opacity: 0;
  margin-left: -1.25rem;
  transition: opacity 0.25s ease, transform 0.25s ease, margin 0.25s ease;
}
.splitBtnTrigger.is-deco .arrow {
  opacity: 1;
  margin-left: 0;
}
.splitBtnTrigger.reverse .arrow {
  margin-left: 1.25rem;
}
.splitBtnTrigger.reverse.is-deco .arrow {
  margin-left: 0;
}

.splitBtn {
  display: block;
  overflow: hidden;
}
.splitBtn .text-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.splitBtn .after {
  position: absolute;
  top: 0;
}
.splitBtn .after span {
  transform: translateY(-100%);
}
.splitBtn .before, .splitBtn .after {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.splitBtn .before span, .splitBtn .after span {
  line-height: 1.1;
  transition: color 0.3s ease-out;
  padding: 0.125rem 0 0.125rem;
}

@media screen and (max-width: 767px) and (orientation: portrait) {
  .splitBtn {
    padding: 0vw 0 0.5089058524vw;
  }
}
.web_font_en_mini2, #header .tel_area a, #header .in_wrap .wrap .right_area .access_area dl dt, #header .in_wrap .wrap .right_area .access_area dl dd .txt2, #header .in_wrap .bottom_area .copy, #header .in_wrap .bottom_area .img_area .txt .en, #Moviefix_area .img_area .txt_big, #Moviefix_area .img_area .txt_mini, #footer .pagetop, #footer #News_area .content_area ul li .sub_area .day, #footer #Access_area .content_area dl dt, #footer #Access_area .content_area dl dd .txt2, #footer .bottom_top_area #Reservation_area .img_area .txt .en, #footer .bottom_bottom_area .right_area small, #Under_mv_area .txt_area .breadcrumbs_area, #Under_mv_area .sc_area .en, #Under_mv_area2 .breadcrumbs_area, #Under_nav_area > .btn, #Under_nav_area .list, .js_tab_style li, .tag_style, .ttl_style2 .big, .ttl_style .mini, .btn_style.small {
    font-family: "aktiv-grotesk", sans-serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 4%;
}
.web_font_jp2, #header .nav_area, #header .tel_area .time, #header .in_wrap .wrap .left_area .in_nav_area, #header .in_wrap .wrap .right_area .access_area dl dd .txt1, #header .in_wrap .wrap .right_area .access_area dl dd .txt3, #header .in_wrap .bottom_area .mini_nav_area, #header .in_wrap .bottom_area .img_area .txt, #Moviefix_area .img_area .txt_big, #footer #News_area .content_area ul li dl dd, #footer #Access_area .content_area dl dd .txt1, #footer #Access_area .content_area dl dd .txt3, #footer .bottom_top_area #Reservation_area .img_area .txt, #footer .bottom_top_area .nav_area, #footer .bottom_bottom_area .nav_area, #Column_area .content_area ul li dd > p, #Review_area .content_area ul li .txt, #Plan_area .content_area .slide_area .swiper .swiper-wrapper .swiper-slide .ttl_area > .mini, #Plan_area .content_area .slide_area .swiper .swiper-wrapper .swiper-slide .ttl_area > .jp, #Plan_area .content_area .slide_area .swiper .swiper-wrapper .swiper-slide .ttl_area > .txt, #Plan_area .content_area .slide_area .swiper .swiper-wrapper .swiper-slide .sub .ttl, #Plan_area .content_area .slide_area .swiper .swiper-wrapper .swiper-slide .sub .txt, #Plan_area .content_area .slide_area .swiper .swiper-wrapper .swiper-slide .btn_style2, .Js_acc_area .Js_acc_btn .acc_btn_style .txt, .ttl_style2 .small, .btn_style.small {
    font-family: "toppan-bunkyu-gothic-pr6n", serif;
    font-weight: 400;
    font-style: normal;
}