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

.br_sp { display: none;}
.br_sp2 { display: none;}
.tel-link { pointer-events: none;}

@media screen and (max-width: 768px) {
	.br_sp { display: block;}
	.br_pc { display: none;}
	.tel-link { pointer-events: auto;}
}



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

#customer_header,
#customer_footer {
	background: #fff; color: #000; min-width: 1100px;
	font-size: 14px; font-weight: normal; line-height: 1.8;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝ProN W3", "Hiragino Mincho ProN","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	-webkit-text-size-adjust: 100%;
}

#customer_header #header_wrap,
#customer_header #nav_wrap,
#customer_footer #footer_wrap {
	padding: 0; margin: 0;
}

#customer_header #header,
#customer_footer #footer .inner {
	width: 1080px; margin: 0 auto;
	-webkit-box-sizing: border-box; box-sizing: border-box;
}

#customer_header a,
#customer_footer a { color: #000; text-decoration: none;}
#customer_header a:hover { opacity: 0.75;}
#customer_footer a:hover { color: #000; text-decoration: underline;}
#customer_header a:hover img,
#customer_footer a:hover img { opacity: 0.75;}

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

/* #customer_header .ver_sp,
#customer_footer .ver_sp { display: none;} */

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

	#customer_header,
	#customer_footer { min-width: 0; font-size: 16px; line-height: 1.6;}
	#customer_header #header,
	#customer_header #footer { width: 100%;}
	#customer_footer #footer .inner { width: 95%;}
	#customer_footer #footer { padding-bottom: 83px;}


	/* #customer_header .ver_pc,
	#customer_footer .ver_pc { display: none;}
	#customer_header .ver_sp,
	#customer_footer .ver_sp { display: inline;} */
}


/* Header
------------------------------------------------------ */
#customer_header #header_wrap {  width: 100%; min-width: 1100px; font-size: 18px; background: rgba(255,255,255,0.9); position: absolute; z-index: 1000;}
#customer_header #header { display: flex; justify-content: space-between; padding: 9px 0 0 10px;}
#customer_header #header #h_logo { width: 140px; align-self: center;}

#customer_header #h_contents { width: calc(100% - 180px); display: flex; flex-wrap: wrap; justify-content: space-between;}

#customer_header #h_info { width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-end;}
#customer_header #h_info #nosmok { width: 570px; background: #dbc97c; text-align: center; font-size: 24px; margin-right: auto; display: flex; justify-content: center; align-items: center;}
#customer_header #h_info #nosmok img { width: 34px; margin-right: 10px;}

#customer_header #h_contact { display: flex; flex-wrap: wrap; justify-content: flex-end;}
#customer_header #h_contact .h_tel { font-size: 14px;}
#customer_header #h_contact .h_tel .tel-link { font-size: 25px;}
#customer_header #h_contact a:hover { text-decoration: none; opacity: 0.75;}
#customer_header #h_contact .lang { font-size: 12px; background: #dfdcc4; padding: 3px 10px; align-self: center; margin-left: 15px;}

#customer_header #h_contents .h_reserve { width: 200px; display: block; background: #78962e; color: #fff; padding: 12px 10px; text-align: center; box-sizing: border-box;}
#customer_header #h_contents .h_reserve:hover { text-decoration: none; opacity: 0.75;}


@media screen and (max-width: 768px) {
	#customer_header #header {  padding: 0;}
	#customer_header #header_wrap { min-width: 0; background: none; position: relative;}
	#customer_header #header #h_logo { display: none;}

	#customer_header #h_contents { width: auto; margin: 0 0 0 auto;}
	#customer_header #h_contents .h_tel, #customer_header #h_contents .h_reserve { display: none;}
	#customer_header #h_contents .lang { padding: 10px 20px; font-size: 14px; margin-top: 10px; position: absolute; bottom: -52px; right: 10px;}

	#customer_header #h_contents { width: 100%;}
	#customer_header #h_info #nosmok { width: 100%; padding: 10px 0;}
	#customer_header #h_info #nosmok span { display: none;}

}


/* G-nav
------------------------------------------------------ */
#customer_header .close_menu { display: none;}

#customer_header #gnav { align-self: flex-end; width: calc(100% - 210px);}
#customer_header #gnav ul { width: 100%; display: flex; align-items: flex-end; justify-content: space-between;}
#customer_header #gnav li {text-align: center; border-bottom: 2px solid transparent; margin-bottom: 10px;}
#customer_header #gnav li:hover { border-bottom: 2px solid #78962D;}
#customer_header #gnav #sp_logo { display: none;}

@media screen and (max-width: 768px) {
	#customer_header #gnav {
		width: 100%; position: fixed; top: 0; left: 0; z-index: 10000;
		background: rgba(255,255,255,0.6); overflow: auto; pointer-events: none;
		-webkit-transition: 0.75s; -o-transition: 0.75s; transition: 0.75s;

		/* アニメーションの設定 */
		/* CSSで設定しているので、デザインに合わせて表示の仕方は変えてください。 */
		/* アコーディオン形式サンプル */
		height: 0;

		/* フェードイン形式サンプル */
		/* height: 100%; */
		/* opacity: 0; */
	}
	#customer_header #gnav:target {
		pointer-events: auto;

		/* アニメーションの設定 */
		/* アコーディオン形式サンプル */
		height: 100%;

		/* フェードイン形式サンプル */
		/* opacity: 1; */
	}

	#customer_header #gnav .close_menu a { padding: 0; line-height: 2;}
	#customer_header #gnav .close_menu a:hover { background: none;}
	#customer_header #gnav .close_menu span:before,
	#customer_header #gnav .close_menu span:after { content: ''; width: 15px; height: 3px; position: absolute; left: 0;}
	#customer_header #gnav .close_menu span:before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);}
	#customer_header #gnav .close_menu span:after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
	#customer_header #gnav #close_top { padding: 5px 0; text-align: center; position: relative;}
	#customer_header #gnav #close_top span {
		width: 15px; height: 0; padding: 15px 0 0;
		position: absolute; top: 13px; right: 10px; overflow: hidden;
	}
	#customer_header #gnav #close_top span:before,
	#customer_header #gnav #close_top span:after { background: #787878; margin: -2px 0 0; top: 50%;}
	#customer_header #gnav #close_bot {
		padding: 5px; margin: 10px auto 0; background: #000;
		border: 1px solid #555; color: #fff; text-align: center;
	}
	#customer_header #gnav #close_bot a { color: #fff;}
	#customer_header #gnav #close_bot span { display: inline-block; padding: 0 0 0 20px; position: relative;}
	#customer_header #gnav #close_bot span:before,
	#customer_header #gnav #close_bot span:after { margin: -2px 0 0; top: 50%; background: #fff;}

	#customer_header #gnav #sp_logo { width: 95%; display: block; margin: 0 auto; text-align: center; padding: 0 0 10px;}
	#customer_header #gnav div { width: 95%; margin: 10px auto 0; background: #fff; padding: 15px 0;}
	#customer_header #gnav ul {
		width: 95%; flex-wrap: wrap; padding: 0;
		-webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 auto;
	}
	#customer_header #gnav li {
		display: block; width: 100%; height: auto; float: none; padding: 10px 0; margin-bottom: 0;
		background-color: #fff; font-size: 15px; line-height: 2; text-align: left;
		border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px dashed #ccc;
	}
	#customer_header #gnav li:first-child { border-top: 1px solid #ccc; border-radius: 4px 4px 0 0; border-bottom: 1px solid #ccc;}
	#customer_header #gnav li:nth-last-child(2) { border-bottom-style: solid; border-radius: 0 0 4px 4px;}
	#customer_header #gnav li:hover { border-bottom: 1px dashed #ccc;}

	#customer_header #gnav a {
		height: auto; padding: 0 0 0 20px; color: #000;
		background: none; line-height: 1.8; display: block; width: 100%;
		-webkit-box-sizing: border-box; box-sizing: border-box;
	}
	#customer_header #gnav a:hover { text-decoration: none;}

	#customer_header #gnav li:nth-last-child(2) a { border-radius: 0 0 4px 4px;}

}


/* Main img
------------------------------------------------------ */
#customer_header #main_img {
	width: 100%; padding: 65px 0; margin: 0 auto; text-align: center; height: 460px; box-sizing: border-box; display: flex; justify-content: center; align-items: center;
	background: url(../img/main.jpg) no-repeat center; background-size: cover;}
#customer_header #main_img h1 { font-size: 30px; color: #fff; text-shadow: 1px 1px 15px #000, 1px 1px 10px #000; padding-top: 113px;}
#customer_header #main_img h1 span { display: block; border-bottom: 1px solid #fff; font-size: 70px; padding: 0 20px; line-height: 1.2;}

@media screen and (max-width: 768px) {
	#customer_header #main_img { height: 250px;}
	#customer_header #main_img h1 { font-size: 26px; top: 35%; left: calc(50% - 164px); padding-top: 0;}
	#customer_header #main_img h1 span { font-size: 40px;}
}
@media screen and (max-width: 380px) {
	#customer_header #main_img h1 { font-size: 24px; left: calc(50% - 150px);}
	#customer_header #main_img h1 span { font-size: 35px;}
}


/* breadcrumb
------------------------------------------------------ */
#customer_header #breadcrumb { margin: 5px auto 25px; width: 1100px; text-align: right; box-sizing: border-box;}
#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 a { color: #486a1b;}
#customer_header #breadcrumb li:first-child:before { display: none;}

@media screen and (max-width: 1100px) {
	#customer_header #breadcrumb { padding-right: 15px;}
}

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


/* Footer
------------------------------------------------------ */
#customer_footer #f_address { background: url(../img/f_contact_bg.jpg); color: #fff;}
#customer_footer #f_address address { margin-bottom: 0; line-height: 1.8;}
#customer_footer #f_address a { color: #fff;}
#customer_footer #f_contact { border-bottom: 1px solid #505050; padding: 20px 0;}

#customer_footer #f_contact ul { display: flex; align-items: center;}
#customer_footer #f_contact .f_tel { width: 330px; display: flex;}
#customer_footer #f_contact .f_tel .icon { width: 60px; padding-right: 10px;}
#customer_footer #f_contact .f_tel p:nth-of-type(2) { width: 260px;}
#customer_footer #f_contact .f_tel .tel-link { display: block; font-size: 36px; line-height: 0.9;}
#customer_footer #f_contact li:nth-of-type(2) { width: 200px;}
#customer_footer #f_contact li:nth-of-type(2) a { display: block; border: 1px solid #505050; background: #2e2e2e; padding: 10px 0; text-align: center;}
#customer_footer #f_contact li:nth-of-type(2) a span { padding-left: 15px; vertical-align: bottom;}
#customer_footer #f_contact li:last-of-type { margin-left: auto; width: 400px;}
#customer_footer #f_contact li:last-of-type a { display: block; background: #78962e; text-align: center; padding: 20px 0; font-size: 21px;}
#customer_footer #f_contact a:hover { text-decoration: none; opacity: 0.75;}

#customer_footer #f_logo { text-align: center; padding: 45px 0; position: relative;}
#customer_footer #f_logo > p { margin-top: 20px;}
#customer_footer #f_logo span { display: inline-block;}
#customer_footer #f_logo span:not(:last-of-type) { padding-right: 10px;}
#customer_footer #f_logo .tel-link { padding-right: 10px; text-decoration: none;}

#customer_footer #f_logo #pagetop {
	display: block; position: absolute; bottom: 10px; right: 10px;
	width: 48px; height: 48px; background: url(../img/arrow2.png) no-repeat center top 5px, rgba(255,255,255,0.4); color: #3c3c3c;
	padding-top: 20px; box-sizing:border-box; font-size: 12px;
}
#customer_footer #f_logo #pagetop:hover { opacity: 0.75; text-decoration: none;}

#customer_footer #f_nav { border-bottom: 1px solid #c8c8c8; padding: 40px 0 20px;}
#customer_footer #f_nav .acc_tit { display: none;}
#customer_footer #f_nav ul { display: flex; flex-direction: column; flex-wrap: wrap; height: calc(50px * 3);}
#customer_footer #f_nav li { padding-left: 15px;}
#customer_footer #f_nav li a { display: block; height: 50px;}
#customer_footer #f_nav li a::before { content: ''; display: inline-block; height: 9px; width: 6px; padding-right: 10px; background: url(../img/fnav_arrow.png) no-repeat center; box-sizing: content-box;}
#customer_footer #f_nav li a::before:hover { text-decoration: none;}

#customer_footer #copyright { clear: both; padding: 15px 0; text-align: center; color: #646464;}

@media screen and (max-width: 768px) {
	#customer_footer #f_address address { line-height: 1.6;}
	#customer_footer #f_contact { padding: 25px 0;}
	#customer_footer #f_contact ul { flex-wrap: wrap; justify-content: center;}
	#customer_footer #f_contact .f_tel { margin: 0 auto 10px; width: 68%; justify-content: center;}
	#customer_footer #f_contact li:nth-of-type(2) { width: 30%;}
	#customer_footer #f_contact li:nth-of-type(2) img { width: 30px;}
	#customer_footer #f_contact li:last-of-type { width: 80%; margin-left: 0; margin-top: 15px;}
	#customer_footer #f_contact li:last-of-type a { font-size: 16px; padding: 5px 0;}
	#customer_footer #f_contact .f_tel .icon { width: 15%; align-self: center;}

	#customer_footer #f_logo { padding: 25px 0;}
	#customer_footer #f_logo > p { margin-top: 0;}
	#customer_footer #f_logo img { margin: 0 auto 15px; width: 35%; max-width: 166px;}
	#customer_footer #f_logo #pagetop { bottom: auto; top: 10px;}

	#customer_footer #f_nav { padding: 0;}
	#customer_footer #f_nav .acc_tit {
		display: block; width: 95%; padding: 10px 25px; margin: 10px auto; background: #d2c38a;
		position: relative; text-align: center;
		-webkit-box-sizing: border-box; box-sizing: border-box;
	}

	#customer_footer #f_nav .acc_tit:after {	content: '▼'; width: 9px; height: 9px; padding: 0 0 0 10px; font-size: 12px;}
	#customer_footer #f_nav .acc_tit.active:after { content: '▲';}
	#customer_footer #f_nav ul { flex-direction: row; padding: 0 0 10px; text-align: left; height: auto;}
	#customer_footer #f_nav li { width: 50%; padding-left: 0;}
	#customer_footer #f_nav li a { height: auto; padding: 7px 0;}

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

@media screen and (max-width: 480px){
	#customer_footer #f_contact .f_tel { width: 100%;}
	#customer_footer #f_contact li:nth-of-type(2) { width: 80%;}

}
@media screen and (max-width: 430px) {
	#customer_footer #f_nav li { font-size: 14px;}
}


/* 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; border-top: 2px solid #fff; z-index: 100;}
	#customer_footer #sp_nav ul { display: table; width: 100%; table-layout: fixed;}
	#customer_footer #sp_nav li { display: table-cell; -webkit-box-sizing: border-box; box-sizing: border-box;}
	#customer_footer #sp_nav li:nth-of-type(-n+2) { background: #f0edc8;}
	#customer_footer #sp_nav li:nth-of-type(-n+2) a { color: #78962e;}
	#customer_footer #sp_nav li:nth-of-type(n+3) { background: #78962e;}
	#customer_footer #sp_nav li:nth-of-type(n+3) a { color: #fff;}
	#customer_footer #sp_nav li:last-of-type { background: #000;}
	#customer_footer #sp_nav li + li { border-left: 1px solid #fff;}
	#customer_footer #sp_nav a { display: block; padding: 10px 0; text-align: center; font-size: 13px;}
	#customer_footer #sp_nav a::before { content: ''; display: block; width: 100%; height: 28px; margin: 0 0 5px; background: no-repeat center top; background-size: auto 100%;}
	#customer_footer #sp_nav #sp_nav1 a::before { background-image: url(../img/sp_nav1.png);}
	#customer_footer #sp_nav #sp_nav2 a::before { background-image: url(../img/sp_nav2.png);}
	#customer_footer #sp_nav #sp_nav3 a::before { background-image: url(../img/sp_nav3.png);}
	#customer_footer #sp_nav #sp_nav4 a::before { background-image: url(../img/sp_nav4.png);}
	#customer_footer #sp_nav #sp_nav5 a::before { background-image: url(../img/sp_nav5.png);}
	#customer_footer #sp_nav img { width: 50px; display: block; margin: 0 auto;}
}


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

#header:after,
#nav_wrap:after,
#contents_wrap:after,
#footer:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0;}


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



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