@charset "utf-8";
/* ===================================================
	Reset
====================================================== */
#customer_header *,
#customer_footer * { -webkit-box-sizing: content-box; box-sizing: content-box;}

#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;}

#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 p,
#customer_footer p { padding: 0; margin: 0;}


/* ===================================================
	Custom CSS
	※ 予約番自体のコンテンツに影響するのを避けるため、
	　必ず #customer_header または #customer_footer からの継承で記述してください。
====================================================== */
body { min-width: 1300px; background: #fff url(https://www.mvhakone.jp/common/img/contents_bg.jpg); color: #151414;}

#customer_header,
#customer_footer {
	margin: 0; padding: 0;
	font-size: 16px; font-weight: normal; line-height: 2; letter-spacing: 1.5px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	-webkit-text-size-adjust: 100%;
}

#customer_header a,
#customer_footer a { color: #151414; text-decoration: none; transition: opacity .5s, background-color .5s;}
#customer_header a:hover,
#customer_footer a:hover { color: #151414;}
#customer_header a:hover img,
#customer_footer a:hover img { opacity: 0.75;}

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

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

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

	#customer_header .br_sp,
	#customer_footer .br_sp { display: inline;}
}


/* Header
------------------------------------------------------ */
#customer_header #header_wrap { background: rgba(255, 255, 255, 0.9); width: 100%; min-width: 1300px; position: absolute; top: 0; left: 0; z-index: 999;}

#customer_header #nav_logo,
#customer_header #h_nav .close_menu,
#customer_header #h_home,
#customer_header #h_sns { display: none;}

#customer_header #header { display: flex; justify-content: space-between;}
#customer_header #logo { width: 30%; display: flex; align-items: center; padding-left: 10px; box-sizing: border-box;}
#customer_header #logo a { display: inline-block; margin-right: 10px;}
#customer_header #logo img { width: 248px;}
#customer_header #logo span { color: #495a3c; font-size: 18px; line-height: 1.4;}
#customer_header #logo span span { display: block;}

#customer_header #h_nav_outer { width: 65%;}

#customer_header #h_nav { display: flex; justify-content: flex-end;}
#customer_header #h_nav li { width: 13%;}
#customer_header #h_nav li a { display: block; height: 100%; padding: 25px 0; text-align: center; box-sizing: border-box;}
#customer_header #h_nav li a:hover { text-decoration: none; background: #c3d8b4;}

#customer_header #h_nav #lg_ja{ padding: 23px 2% 0; width: 15%; box-sizing: border-box;}
#customer_header #h_nav #lg_ja a{
	padding: 5px 0; height: auto; color: #85713f; border: 1px solid #85713f;
}
#customer_header #h_nav #lg_ja a:hover { color: #fff; background: #85713f;}

#customer_header #h_nav #h_reserve { width: 20%; flex-grow: 1;}
#customer_header #h_nav #h_reserve a { background: #33581a; color: #fff; font-size: 17px;}
#customer_header #h_nav #h_reserve a:hover { opacity: 0.8;}


@media screen and (max-width: 768px) {
	#customer_header #header_wrap { min-width: 0; position: static;}
	#customer_header #logo { width: 100%; padding: 8px 0 8px; justify-content: center;}
	#customer_header #logo a { margin-right: 0;}
	#customer_header #logo span { display: none;}
	#customer_header #logo img { width: 45vw; min-width: 165px;}

	#customer_header #h_nav .close_menu,
	#customer_header #h_home,
	#customer_header #h_sns { display: block;}

	#customer_header #h_nav_outer { opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; overflow: auto; padding: 50px 0; background: rgba(0, 0, 0, 0.8); z-index: 999; pointer-events: none; transition: opacity .5s;}
	#customer_header #h_nav_outer:target { opacity: 1; pointer-events: auto;}
	#customer_header #h_nav_wrap { background: #fff; width: 88%; margin: 0 auto; padding: 45px 3% 120px; position: relative;}
	#customer_header #menuOuter.active #h_nav_wrap { display: block;}

	#customer_header #nav_logo { display: block; width: 100%; text-align: center;}
	#customer_header #nav_logo img { width: 50vw; min-width: 180px;}
	#customer_header #h_nav { flex-direction: column; width: 100%; box-sizing: border-box; margin-top: 5vw;}
	#customer_header #h_nav li { order: 2; width: 100%; border-bottom: 1px dashed #aaa;}

	#customer_header #h_nav li a { padding: 13px 0 13px 15px; text-align: left; position: relative;}
	#customer_header #h_nav li a::after {
		content: ''; display: block; width: 5px; height: 5px; border-top: 1px solid #aaa; border-right: 1px solid #aaa;
		transform: rotate(45deg); position: absolute; top: 45%; right: 10px;
	}


	#customer_header #h_nav #lg_ja{ padding-right: 0; width: 100%; text-align: center; border-bottom: 0;}
	#customer_header #h_nav #lg_ja a{ padding: 5px 15px;}
	#customer_header #h_nav #lg_ja a::after{ border-top: 1px solid #85713f; border-right: 1px solid #85713f;}

	#customer_header #h_nav #h_reserve { order: 1; border-bottom: none; margin-bottom: 20px; width: 100%;}
	#customer_header #h_nav #h_reserve a { text-align: center; font-size: 15px; padding: 3vw 0;}
	#customer_header #h_nav #h_reserve a::after { content: none;}

	#customer_header #h_nav #close_top,
	#customer_header #h_nav #close_bot { border-bottom: none; }
	#customer_header #h_nav #close_top { position: absolute; top: 20px; right: 3%; width: 30px; height: 30px;}
	#customer_header #h_nav #close_bot { display: flex; flex-direction: column; align-items: center; position: absolute; bottom: 55px; left: 50%; transform: translateX(-50%);}
	#customer_header #h_nav .close_icon { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 30px; height: 30px; cursor: pointer; padding: 0; font-size: 0;}
	#customer_header #h_nav .close_icon:hover { background: none;}
	#customer_header #h_nav .close_icon::before,
	#customer_header #h_nav .close_icon::after { content: ''; display: block; width: 100%; height: 1px; background: #434343;}
	#customer_header #h_nav .close_icon::before { transform: rotate(45deg);}
	#customer_header #h_nav .close_icon::after { transform: rotate(-45deg);}
	#customer_header #h_nav .close_icon::before,
	#customer_header #h_nav .close_icon::after { content: ''; display: block; width: 100%; height: 1px; background: #434343;}
	#customer_header #h_nav .close_icon::before { transform: rotate(45deg);}
	#customer_header #h_nav .close_icon::after { transform: rotate(-45deg); right: 0;}

	#customer_header #h_sns { display: flex; justify-content: center; padding: 8vw 0;}
	#customer_header #h_sns li:not(:last-of-type) { margin-right: 10px;}
	#customer_header #h_sns img { width: 45px;}
}


/* Main img
------------------------------------------------------ */
#customer_header #main_img { width: 100%; max-height: 100vh; min-height: 400px; margin: 0 auto; background: #f5f5f5; text-align: center; position: relative;}
#customer_header #main_img h1 {
	font-size: 31px; display: flex; justify-content: center; align-items: center; width: 100%; height: calc(100% - 80px);
	position: absolute; top:80px; left: 0; z-index: 10; color: #fff; text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.8);
}
#customer_header #main_img .flexslider { width: 100%; height: 100%;}
#customer_header #main_img img { width: 100%; max-height: 100vh; min-height: 400px; object-fit: cover;}
/* IE表示用のCSS　*/
_:-ms-input-placeholder, #customer_header #main_img img {
    max-height: auto; min-height: 0;
}

@media screen and (max-width: 768px) {
	#customer_header #main_img { min-height: 300px;}
	#customer_header #main_img h1 { font-size: 22px; height: 100%; top: 0;}
	#customer_header #main_img img { min-height: 300px;}

	/* IE表示用のCSS　*/
	_:-ms-input-placeholder, #customer_header #main_img img {
	    min-height: 0;
	}
}



/* breadcrumb
------------------------------------------------------ */
#customer_header #breadcrumb { width: 92%; max-width: 1100px; margin: 0 auto; font-size: 13px; text-align: right; padding: 10px 0;}
#customer_header #breadcrumb li { display: inline-block; line-height: 1.6;}
#customer_header #breadcrumb li:before { content: '>'; margin: 0 5px;}
#customer_header #breadcrumb li:first-child:before { display: none;}
#customer_header #breadcrumb li a { color: #555;}
#customer_header #breadcrumb li a:hover { text-decoration: underline;}

@media screen and (max-width: 768px) {
	#customer_header #breadcrumb { display: none;}
}


/* Footer
------------------------------------------------------ */
#customer_footer #pagetop { display: none; position: fixed; bottom: 35px; right: 35px; z-index: 999;}
#customer_footer #pagetop a { display: flex; justify-content: center; align-items: center; width: 66px; height: 66px; background: rgba(85, 113, 64, 0.5); border-radius: 50%;}
#customer_footer #pagetop a::before { content: ''; display: block; width: 14px; height: 14px; border-left: 2px solid #fff; border-top: 2px solid #fff; transform: rotate(45deg); margin-top: 7px;}
#customer_footer #pagetop a:hover { opacity: 0.75;}

#customer_footer #footer_wrap { background: #fff;}
#customer_footer #f_nav { background: #557240; padding: 20px 0;}
#customer_footer #f_nav .acc_tit { display: none;}
#customer_footer #f_nav ul { display: flex;}
#customer_footer #f_nav li { width: 20%; text-align: center;}
#customer_footer #f_nav a { color: #fff; position: relative; padding-left: 17px;}
#customer_footer #f_nav a::before { content: ''; display: block; border: 3px solid transparent; border-left: 7px solid #d9bf77; transition: transform .5s; position: absolute; left: 0; top: 5px;}
#customer_footer #f_nav a:hover::before { transform: translateX(50%);}

#customer_footer #f_logo { padding: 60px 4% 0; text-align: center;}
#customer_footer #f_logo img { width: 290px; margin-top: 15px;}
#customer_footer #f_logo > p{ margin: 20px 0 25px; font-size: 16px;}
#customer_footer #f_logo address { }
#customer_footer #f_logo address span { display: inline-block; padding-right: 10px; white-space: nowrap;}
#customer_footer #f_logo address .tel-link { display: inline-block; padding-right: 0;}

#customer_footer #f_sns { display: flex; justify-content: center; padding: 35px 0 20px;}
#customer_footer #f_sns li:not(:last-of-type) { margin-right: 20px;}
#customer_footer #f_sns img { width: 45px;}

#customer_footer #copyright { color: #424242; font-size: 12px; padding: 15px 0 10px; text-align: center; }

@media screen and (max-width: 768px) {
	#customer_footer #pagetop { display: block; position: static;}
	#customer_footer #pagetop a { width: 100%; height: auto; padding: 10px 0; border-radius: 0;}

	#customer_footer #footer_wrap { padding-bottom: calc(11vw + 30px);}
	#customer_footer #f_nav { display: none;}

	#customer_footer #f_logo { padding: 30px 4% 0;}
	#customer_footer #f_logo img { width: 50vw; min-width: 200px; margin-top: 10px;}
	#customer_footer #f_logo > p{ margin: 10px 0 15px;}
	#customer_footer #f_logo address { }
	#customer_footer #f_logo address span { display: block; margin: 0 0 5px; padding-right: 0;}
	#customer_footer #f_sns { padding: 20px 0;}
	#customer_footer #f_sns li:not(:last-of-type) { margin-right: 10px;}

	#customer_footer #copyright { padding: 0 0 10px;}

}

/* sp_nav
------------------------------------------------------ */

#customer_footer #sp_nav { display: none;}

@media screen and (max-width: 768px) {
	#customer_footer #sp_nav { display: block; position: fixed; bottom: 0; left: 0; width: 100%; border-top: 1px solid #557240; background: #fff; z-index: 99; padding-bottom: env(safe-area-inset-bottom); background: #557240;}
	#customer_footer #sp_nav ul { display: flex;}
	#customer_footer #sp_nav ul li { width: 20%;}
	#customer_footer #sp_nav ul a { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; padding: 3vw 3px 1vw; box-sizing: border-box; color: #557240;}
	#customer_footer #sp_nav ul a span { margin-top: 5px;}

	#customer_footer #sp_nav #sp_nav3{ width: 40%;}

	#customer_footer #sp_nav #sp_nav1 a,
	#customer_footer #sp_nav #sp_nav2 a { background: #fff; border-right: 1px solid #557240;}
	#customer_footer #sp_nav #sp_nav3 a { background: #557240; color: #fff; border-right: 1px solid #fff;}
	#customer_footer #sp_nav #sp_nav4 a { background: #e4ead6;}

	#customer_footer #sp_nav #sp_nav1 a img { width: 43%;}
	#customer_footer #sp_nav #sp_nav2 a img { width: 25%;}
	#customer_footer #sp_nav #sp_nav3 a img { width: 23%;}
	#customer_footer #sp_nav #sp_nav4 a img { width: 56%;}
}

/* clear
------------------------------------------------------ */



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



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