@charset "utf-8";

/* noto-serif-jp-regular - latin_japanese */
@font-face {
	font-family: 'Noto Serif JP';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: local(''),
			url('../../common/fonts/noto-serif-jp-v8-latin_japanese-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
			url('../../common/fonts/noto-serif-jp-v8-latin_japanese-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* noto-serif-jp-700 - latin_japanese */
@font-face {
	font-family: 'Noto Serif JP';
	font-style: normal;
	font-weight: 700;
	src: local(''),
			url('../../common/fonts/noto-serif-jp-v8-latin_japanese-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
			url('../../common/fonts/noto-serif-jp-v8-latin_japanese-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* noto-sans-jp-regular - latin_japanese */
@font-face {
	font-family: 'Noto Sans JP';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: local(''),
			url('../../common/fonts/noto-sans-jp-v28-latin_japanese-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
			url('../../common/fonts/noto-sans-jp-v28-latin_japanese-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* ===================================================
	Reset
====================================================== */
#customer_header h1,
#customer_header h2,
#customer_header h3,
#customer_header h4,
#customer_header h5,
#customer_header h6,
#customer_footer h1,
#customer_footer h2,
#customer_footer h3,
#customer_footer h4,
#customer_footer h5,
#customer_footer h6 { margin: 0; font-weight: normal;}

#customer_header ul,
#customer_header ol,
#customer_header li,
#customer_footer ul,
#customer_footer ol,
#customer_footer li { padding: 0; margin: 0; list-style-type: none;}

#customer_header dl,
#customer_footer dl { padding: 0; margin: 0;}

#customer_header dt,
#customer_footer dt { font-weight: normal;}

#customer_header p,
#customer_footer p { padding: 0; margin: 0;}


/* ===================================================
	Custom CSS
	※ 予約番自体のコンテンツに影響するのを避けるため、
	　必ず #customer_header または #customer_footer からの継承で記述してください。
====================================================== */
body { min-width: 1100px;}

#customer_header,
#customer_footer {
	background: #fff; color: #222;
	font-size: 14px; font-weight: normal; line-height: 1.5;
	font-family: 'Noto Serif JP', serif; font-display: swap;
	-webkit-text-size-adjust: 100%;
}

#customer_header a,
#customer_footer a { color: #222; text-decoration: none;}
#customer_header a:hover,
#customer_footer a:hover { color: #222; text-decoration: underline;}
#customer_header a img,
#customer_footer a img {
	-webkit-transition: opacity 0.5s;
	-o-transition: opacity 0.5s;
	transition: opacity 0.5s;
}
#customer_header a:hover img,
#customer_footer a:hover img { opacity: 0.75;}

#customer_header img,
#customer_footer img { max-width: 100%;}

#customer_header .sp,
#customer_footer .sp { display: none;}


@media screen and (orientation:landscape) {
	body { width: 100%;}
}
@media screen and (max-width: 768px) {
	body { min-width: 0;}

	#customer_header .sp,
	#customer_footer .sp { display: block;}
	#customer_header .pc,
	#customer_footer .pc { display: none !important;}
}


/* Header
------------------------------------------------------ */
#customer_header #header_wrap {
	width: 100%; min-width: 1100px; position: absolute; z-index: 100;
	-webkit-animation: menu_act ease-in-out .5s; animation: menu_act ease-in-out .5s;
}

#customer_header #header,
#customer_header #gnav ul {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center;
}

#customer_header #header { justify-content: space-between; width: 86.25%; min-width: 1100px; margin: 0 auto;}
#customer_header #header .fixed_item { display: none;}
#customer_header #header .logo { padding: 0 20px; -webkit-box-sizing: content-box; box-sizing: content-box;}

#customer_header #gnav li { padding: 0 20px;}
#customer_header #gnav a {
  display: block; padding: 20px 0 40px; position: relative; color: #fff;
  font-size: 21px; text-shadow: 0 0 5px #000;
}
#customer_header #gnav a::before {
	content: ''; height: 2px;
	position: absolute; top: 0; left: 50%; right: 50%;
	background: #c64900;
	-webkit-transition: left 0.5s, right 0.5s;
	-o-transition: left 0.5s, right 0.5s;
	transition: left 0.5s, right 0.5s;
}
#customer_header #gnav a:hover { text-decoration: none;}
#customer_header #gnav a:hover::before { left: -5px; right: -5px;}

@media screen and (max-width: 768px) {
	#customer_header { margin: 0 0 30px;}
	#customer_header #header_wrap { min-width: 0;}

	#customer_header #header { width: 100%; min-width: 0;}
	#customer_header #header img.fixed_item,
	#customer_header #header img.flow_item {
		-webkit-transition: opacity 0.5s;
		-o-transition: opacity 0.5s;
		transition: opacity 0.5s;
	}
	#customer_header #header img.fixed_item { display: inline; position: absolute; left: 0; top: 0; z-index: -1; opacity: 0;}

	#customer_header #menu_btn,
	#customer_header #header .logo { position: relative; z-index: 100;}
	#customer_header #header .logo a { display: block; position: relative;}

	#customer_header #header .logo {
		width: 100% !important; padding: 6px 40px 6px 20px;
		margin: 0 -40px 0 0; text-align: center;
		-webkit-box-sizing: border-box; box-sizing: border-box;
	}
	#customer_header #header .logo a { width: 100px; margin: 0 auto; position: relative;}

	#customer_header #menu_btn { position: relative;}
	#customer_header #menu_btn a {
		display: -webkit-flex; display: -ms-flex; display: flex;
		-ms-align-items: center; align-items: center;
		justify-content: center; width: 40px; height: 40px;
	}
	#customer_header #menu_btn a:hover { text-decoration: none;}
	#customer_header #menu_btn span,
	#customer_header #menu_btn span:before,
	#customer_header #menu_btn span:after {
		-webkit-transition: background-color 0.5s, transform 0.5s;
		-o-transition: background-color 0.5s, transform 0.5s;
		transition: background-color 0.5s, transform 0.5s;
	}
	#customer_header #menu_btn span {
		display: block; width: 25px; height: 2px;
		position: relative; background: #fff;
	}
	#customer_header #menu_btn span:before,
	#customer_header #menu_btn span:after {
		content: ''; width: 100%; height: 2px;
		position: absolute; left: 0; background: #fff;
	}
	#customer_header #menu_btn span:before {
		top: -8px;
		-webkit-transform-origin: left top;
		-moz-transform-origin: left top;
		-ms-transform-origin: left top;
		-o-transform-origin: left top;
		transform-origin: left top;
	}
	#customer_header #menu_btn span:after {
		bottom: -8px;
		-webkit-transform-origin: left bottom;
		-moz-transform-origin: left bottom;
		-ms-transform-origin: left bottom;
		-o-transform-origin: left bottom;
		transform-origin: left bottom;
	}
	#customer_header #menu_btn a[href="#close"] { position: absolute; top: 0; left: 0; z-index: 10; pointer-events: none;}
	#customer_header #header_wrap:target #menu_btn a[href="#close"] { pointer-events: auto;}

	#customer_header #header_wrap:target #header img.fixed_item { opacity: 1;}
	#customer_header #header_wrap:target #header img.flow_item { display: inline; opacity: 0;}
	#customer_header #header_wrap:target #header .logo { background: #fff;}
	#customer_header #header_wrap:target #menu_btn span:before,
	#customer_header #header_wrap:target #menu_btn span:after { background: #000;}
	#customer_header #header_wrap:target #menu_btn span { background: transparent;}
	#customer_header #header_wrap:target #menu_btn span:before {
		-webkit-transform: translate(3px, -1px) rotate(45deg);
		-ms-transform: translate(3px, -1px) rotate(45deg);
		transform: translate(3px, -1px) rotate(45deg);
	}
  #customer_header #header_wrap:target #menu_btn span:after {
		-webkit-transform: translateX(3px) rotate(-45deg);
		-ms-transform: translateX(3px) rotate(-45deg);
		transform: translateX(3px) rotate(-45deg);
	}

	#customer_header #gnav {
		width: 100%; padding: 60px 0 30px;
		position: absolute; top: 0; left: 0;
		background: #fff; opacity: 0; pointer-events: none;
		-webkit-transition: opacity 0.5s;
		-o-transition: opacity 0.5s;
		transition: opacity 0.5s;
	}
	#customer_header #gnav ul { display: block; margin: 0 4%;}
	#customer_header #gnav li { padding: 0; border-bottom: 1px solid #ccc;}
	#customer_header #gnav a { display: block; padding: 10px 0 !important; position: relative; color: #222; font-size: 18px; text-shadow: none;}
	#customer_header #gnav a::before {
		content: ''; width: 10px; height: 6px;
		position: absolute; top: 50%; left: auto !important; right: 0 !important;
		background: url(../../common/img/search_arrow.svg) no-repeat center center;
		-webkit-transform: translateY(-50%) rotate(-90deg);
		-ms-transform: translateY(-50%) rotate(-90deg);
		transform: translateY(-50%) rotate(-90deg);
	}
	#customer_header #header_wrap:target #gnav { opacity: 1;}

	#customer_header #sp_nav {
		display: -webkit-flex; display: -ms-flex; display: flex;
		width: 100%; position: fixed; bottom: 0; left: 0; z-index: 50;
		background: #fff; border-top: 1px solid #ccc;
	}
	#customer_header #sp_nav li { width: 25%; padding: 0 0 env(safe-area-inset-bottom); -webkit-box-sizing: border-box; box-sizing: border-box;}
	#customer_header #sp_nav li + li { border-left: 1px solid #ccc;}
	#customer_header #sp_nav a { display: block; padding: 10px 0 5px; font-size: 12px; text-align: center;}
	#customer_header #sp_nav a:hover { text-decoration: none;}
	#customer_header #sp_nav a img { display: block; height: 25px; margin: 0 auto 3px;}
}


/* Main img
------------------------------------------------------ */
#customer_header .main_img { height: 450px; position: relative; overflow: hidden;}
#customer_header .main_img h1 {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center; justify-content: center;
	width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10;
	color: #fff; font-size: 60px;
}
#customer_header .main_img .ofi { width: 100%; height: 100%; object-fit: cover;}

#customer_header #breadcrumb { width: 100%; position: absolute; bottom: 10px; left: 0; color: #fff; z-index: 15;}
#customer_header #breadcrumb ol {
	width: 86.25%; min-width: 1100px; padding: 0 20px;
	list-style-type: none;
}
#customer_header #breadcrumb li { display: inline-block; font-size: 13px;}
#customer_header #breadcrumb li + li::before { content: '>'; margin: 0 5px;}
#customer_header #breadcrumb a { color: #fff;}

@media screen and (max-width: 768px) {
	#customer_header .main_img { height: 200px;}
	#customer_header .main_img h1 { font-size: 40px;}
	#customer_header .main_img h1 img{
		max-width: none;
		-webkit-transform: scale(0.5);
		-ms-transform: scale(0.5);
		transform: scale(0.5);
	}

	#customer_header #breadcrumb { display: none;}
}


/* Footer
------------------------------------------------------ */
#customer_footer #footer { background: #f8f4e9;}
#customer_footer #f_contact,
#customer_footer #f_inner {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: space-between; width: 1100px; max-width: 96%; margin: 0 auto;
}

@media screen and (max-width: 768px) {
	#customer_footer #f_contact,
	#customer_footer #f_inner { display: block; width: 100%; max-width: none;}
}


/* f_info */
#customer_footer #f_info { padding: 40px 2% 55px; background: #232323;}
#customer_footer #f_info dt { margin: 0 0 35px; color: #fff; font-size: 27px; text-align: center;}
#customer_footer #f_info dd ul,
#customer_footer #f_info dd li .txt { display: -webkit-flex; display: -ms-flex; display: flex;}
#customer_footer #f_info dd ul {
	justify-content: space-between;
	width: 1327px; max-width: 100%; margin: 0 auto;
}
#customer_footer #f_info dd li { max-width: calc((100% - 45px) / 4);}
#customer_footer #f_info dd li a { display: block; position: relative;}
#customer_footer #f_info dd li a > img {
	-webkit-filter: brightness(100%) blur(0);
	filter: brightness(100%) blur(0);
	-webkit-transition: filter 0.5s linear, -webkit-filter 0.5s linear;
	-o-transition: filter 0.5s linear, -webkit-filter 0.5s linear;
	transition: filter 0.5s linear, -webkit-filter 0.5s linear;
}
#customer_footer #f_info dd li a:hover > img {
	opacity: 1;
	-webkit-filter: brightness(90%) blur(1px);
	filter: brightness(90%) blur(1px);
}
#customer_footer #f_info dd li .txt {
	-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
	-ms-align-items: center; align-items: center;
	align-content: center; width: 100%; height: 100%;
	position: absolute; top: 0; left: 0; z-index: 10;
	color: #fff; font-size: 20px;
}
#customer_footer #f_info dd li .txt span { width: 100%; padding: 5px 0; text-align: center;}
#customer_footer #f_info dd > p {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center; justify-content: center;
	width: 645px; max-width: 100%; padding: 12px 0 10px; margin: 50px auto 0;
	border-top: 1px solid rgba(255,255,255,0.3);
	border-bottom: 1px solid rgba(255,255,255,0.3);
	color: #fff; font-size: 20px; letter-spacing: 3px;
}
#customer_footer #f_info dd > p span:last-child { padding: 0 20px;}

@media screen and (max-width: 768px) {
	#customer_footer #f_info { padding: 20px 4% 40px;}
	#customer_footer #f_info dt { margin-bottom: 10px; font-size: 20px;}
	#customer_footer #f_info dd ul {
		-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
		width: 100%;
	}
	#customer_footer #f_info dd li { width: 48%; max-width: none; margin: 2% 0;}
	#customer_footer #f_info dd li a { display: block; position: relative;}
	#customer_footer #f_info dd li .txt { font-size: 16px;}
	#customer_footer #f_info dd li .txt span { padding: 0;}
	#customer_footer #f_info dd li .txt span img {
		-webkit-transform: scale(0.7);
		-ms-transform: scale(0.7);
		transform: scale(0.7);
	}
	#customer_footer #f_info dd > p { width: 100%; padding: 8px 0; margin-top: 20px; font-size: 18px;}
	#customer_footer #f_info dd > p img { width: 32px;}
	#customer_footer #f_info dd > p span:last-child { padding: 0 10px;}
}


/* f_contact */
#customer_footer #f_contact {
	-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
	-ms-align-items: center; align-items: center;
	padding: 80px 0 40px; border-bottom: 1px solid rgba(0,0,0,0.1);
}

#customer_footer #f_contact .btn_reserve {
	width: 100%; padding: 50px 35px 50px 115px; margin: 0 0 15px; position: relative;
	background: #fff url(../../common/img/f_plan_off.svg) no-repeat 68px center;
	border: 1px solid #e2dac5; font-size: 26px;
	-webkit-box-sizing: border-box; box-sizing: border-box;
	-webkit-transition: background-color 0.5s, color 0.5s;
	-o-transition: background-color 0.5s, color 0.5s;
	transition: background-color 0.5s, color 0.5s;
}
#customer_footer #f_contact .btn_reserve span {
	display: block; padding: 0 155px 0 0; position: relative;
	background: url(../../common/img/arrow_b.svg) no-repeat;
	background-position: right calc(50% - 1.5px);
}
#customer_footer #f_contact .btn_reserve span::before {
	content: ''; width: 140px; height: 1px;
	position: absolute; top: 50%; right: 0; z-index: 0; background: #222222;
}
#customer_footer #f_contact .btn_reserve:hover {
	background-color: #c67540; background-image: url(../../common/img/f_plan_on.svg);
	color: #fff; text-decoration: none;
}
#customer_footer #f_contact .btn_reserve:hover span { background-image: url(../../common/img/arrow_w.svg);}
#customer_footer #f_contact .btn_reserve:hover span::before { background: #fff;}

#customer_footer #f_contact dl {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center;
}
#customer_footer #f_contact dt { padding: 3px 15px 0 0;}
#customer_footer #f_contact dd span { display: inline-block; vertical-align: middle;}
#customer_footer #f_contact dd .tel-link {
	padding: 0 0 0 20px; font-size: 32px;
	background: url(../../common/img/icon_tel.svg) no-repeat;
	background-position: left calc(50% + 4px);
	-webkit-background-size: 18px; background-size: 18px; pointer-events: none;
}
#customer_footer #f_contact dd span:not([class]) { padding: 5px 0 0;}
#customer_footer #f_contact .btn_cancel a {
	display: inline-block; padding: 0 20px 0 0;
	background: url(../../common/img/arrow_s.svg) no-repeat right center;
	-webkit-background-size: 12px auto;
	background-size: 12px auto;
	border-bottom: 1px solid #222;
}
#customer_footer #f_contact .btn_cancel a:hover { border-bottom-color: transparent; text-decoration: none;}

@media screen and (max-width: 768px) {
	#customer_footer #f_contact { padding: 40px 4%;}
	#customer_footer #f_contact .btn_reserve {
		display: block; padding: 25px 25px 25px 55px; margin-bottom: 20px;
		background-position: 25px center; font-size: 18px;
	}
	#customer_footer #f_contact .btn_reserve span { padding-right: 20%;}
	#customer_footer #f_contact .btn_reserve span::before { width: 19%;}

	#customer_footer #f_contact dl {
		-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
		justify-content: center; margin: 0 0 20px; font-size: 14px; text-align: center;
	}
	#customer_footer #f_contact dt,
	#customer_footer #f_contact dd { padding: 0 5px;}
	#customer_footer #f_contact dd .tel-link {
		display: inline-block; padding: 0 0 0 20px;
		-webkit-background-size: 16px auto; background-size: 16px auto;
		font-size: 24px; vertical-align: middle; pointer-events: auto;
	}

	#customer_footer #f_contact .btn_cancel { font-size: 14px; text-align: center;}
}


/* f_inner */
#customer_footer #f_inner { padding: 50px 0 65px;}

#customer_footer #f_logo address { margin: 30px 0 25px; line-height: 1.8;}
#customer_footer #f_logo address span + span { padding: 0 0 0 1em;}
#customer_footer #f_logo .link_col,
#customer_footer #copyright { display: inline-flex; vertical-align: middle;}
#customer_footer #f_logo .link_col { margin: 0 20px 0 0;}
#customer_footer #f_logo .link_col li:not(:last-child) { margin: 0 12px 0 0;}
#customer_footer #copyright { color: #c57641; font-size: 12px;}

#customer_footer #f_nav .acc_tit { display: none;}
#customer_footer #f_nav div{
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: space-between; width: 515px; padding: 23px 0 0;
}
#customer_footer #f_nav li { padding: 7px 0 7px 10px; position: relative; font-size: 16px;}
#customer_footer #f_nav li::before {
	content: ''; width: 5px; height: 1px;
	position: absolute; left: 0; top: 50%;
	background: #c57641;
}

@media screen and (max-width: 768px) {
	#customer_footer #f_inner { padding: 40px 4% 50px; text-align: center;}

	#customer_footer #f_logo .logo img { width: 120px;}
	#customer_footer #f_logo address { margin: 20px 0; line-height: 1.6;}
	#customer_footer #f_logo address span { display: inline-block; padding: 0 5px !important;}
	#customer_footer #f_logo .link_col { margin: 0 0 20px;}
	#customer_footer #f_logo .link_col li:not(:last-child) { margin: 0 20px 0 0;}
	#customer_footer #copyright { display: block;}

	#customer_footer #f_nav { width: 500px; max-width: 100%; margin: 30px auto 0;}
	#customer_footer #f_nav .acc_tit {
		display: block; padding: 5px 0;
		background: #fff; border: 1px solid #e2dac5; border-radius: 20px / 50%;
	}
	#customer_footer #f_nav div { display: block; width: auto; padding-top: 10px;}
	#customer_footer #f_nav div::after { content: ""; display: block; clear: both;}
	#customer_footer #f_nav li {
		width: 49%; float: left; text-align: left;
		-webkit-box-sizing: border-box; box-sizing: border-box;
	}
	#customer_footer #f_nav li:nth-child(2n) { float: right;}
	#customer_footer #f_nav li:nth-child(2n + 1) { clear: both;}
	#customer_footer #f_nav li::before { top: calc(0.8em + 6px);}
	#customer_footer #f_nav ul:last-child li:last-child { width: 100%;}
}


/* f_group */
#customer_footer #f_group { padding: 35px 0 55px; background: #ebe5d4; border-top: 1px solid #dad1b8;}
#customer_footer #f_group dt { margin: 0 0 25px; font-size: 18px; text-align: center;}
#customer_footer #f_group dd ul { display: -webkit-flex; display: -ms-flex; display: flex; justify-content: center;}
#customer_footer #f_group dd li { padding: 0 15px;}

@media screen and (max-width: 768px) {
	#customer_footer #f_group { padding: 20px 0 calc(env(safe-area-inset-bottom) + 70px);}
	#customer_footer #f_group dt { margin-bottom: 10px; font-size: 16px;}
	#customer_footer #f_group dd ul { display: block; text-align: center;}
	#customer_footer #f_group dd li { padding: 5px 0;}
}


/* ---------------------------------------------------
	更新履歴
------------------------------------------------------



------------------------------------------------------ */