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

#customer_header div,
#customer_header p,
#customer_header ol,
#customer_header ul,
#customer_header li,
#customer_header span,
#customer_header a,
#customer_header dl,
#customer_header dt,
#customer_header dd,
#customer_footer div,
#customer_footer p,
#customer_footer ol,
#customer_footer ul,
#customer_footer li,
#customer_footer span,
#customer_footer a,
#customer_footer dl,
#customer_footer dt,
#customer_footer dd { -webkit-box-sizing: border-box; box-sizing: border-box;}


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

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

/* IE表示用のCSS　*/
_:-ms-input-placeholder, #customer_header, #customer_footer {
	font-family: "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


#customer_header .gothic,
#customer_footer .gothic { font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro","Osaka","Verdana","Helvetica","Arial","ＭＳ Ｐゴシック", sans-serif;}

/* IE表示用のCSS　*/
_:-ms-input-placeholder, #customer_header .gothic, #customer_footer .gothic {
	font-family: "ＭＳ Ｐゴシック", sans-serif;
}


#customer_header a,
#customer_footer a { color: #000; text-decoration: none;}
#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,
#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%;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	overflow: hidden;
}

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

#customer_header .tel-link,
#customer_footer .tel-link { pointer-events: none;}

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

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

	#customer_header .tel-link,
	#customer_footer .tel-link { pointer-events: auto;}
}


/* Header
------------------------------------------------------ */
#customer_header .aed_info { display: -webkit-flex; display: -ms-flex; display: flex;}
#customer_header .aed_info p:first-child { flex-grow: 0; flex-shrink: 0;}
#customer_header .aed_info p:first-child img { width: 100%;}
#customer_header .aed_info p:last-child { margin: 0 0 0 10px;}

#customer_header #header,
#customer_header #h_nav,
#customer_header #h_nav div {
	display: -webkit-flex; display: -ms-flex; display: flex;
	-ms-align-items: center; align-items: center;
}
#customer_header #header {
	-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
	width: 1100px; max-width: 96%; padding: 5px 0 15px; margin: 0 auto;
}
#customer_header #header p.gothic { width: 100%; margin: 0 0 10px; font-size: 12px;}
#customer_header #h_nav { margin: 0 0 0 auto;}
#customer_header #h_nav .aed_info { justify-content: space-between; width: 183px; margin: 0 30px; font-size: 10px;}
#customer_header #h_nav .aed_info p:first-child { flex-basis: 43px; width: 43px;}
#customer_header #h_nav .tel { text-align: right;}
#customer_header #h_nav .tel .tel-link {
	padding: 0 0 0 30px; background: url(https://www.syuuzanso.com/common/img/icon_tel.png) no-repeat left center;
	font-family: "ヒラギノ明朝 ProN W3", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 36px; line-height: 1.3;
}
#customer_header #h_nav .tel span { display: block;}

@media screen and (max-width: 768px) {
	#customer_header #header {
		width: 100%; max-width: none; min-height: 70px;
		padding: 10px 4%; -webkit-box-sizing: border-box; box-sizing: border-box;
	}
	#customer_header #header h1 { width: 220px;}
	#customer_header #header .open_menu {
		display: -webkit-flex; display: -ms-flex; display: flex;
		-ms-align-items: center; align-items: center; justify-content: center;
		width: 50px; height: 50px; padding: 6px;
		position: fixed; right: 4%; top: 10px; z-index: 99;
		background: #019444; color: #fff;
	}
}



/* G-nav
------------------------------------------------------ */
#customer_header #gnav { clear: both; background: #019444;}
#customer_header #gnav.fixed { width: 100%; min-width: 1100px; position: fixed; top:0; left: 0; z-index: 10;}
#customer_header #gnav ul {
	display: -webkit-flex; display: -ms-flex; display: flex;
	width: 1100px; max-width: 100%; margin: 0 auto;
}
#customer_header #gnav li { width: 100%; border-left: 1px solid #fff;}
#customer_header #gnav li a {
	display:block; padding: 20px 10px; color: #fff; font-size: 18px; text-align: center;
	-webkit-transition: background 0.5s;
	-o-transition: background 0.5s;
	transition: background 0.5s;
}
#customer_header #gnav li a:hover { background: #007c38; text-decoration: none;}

#customer_header #gnav .btn_reserve a { background: #de9700;}
#customer_header #gnav .btn_reserve a:hover { background: #c48601;}


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

	#customer_header #gnav { margin: 70px 0 100px; background: rgba(255,255,255,0.9); text-align: center;}
	#customer_header #gnav .close_menu { position: relative; padding: 15px 4%; cursor: pointer;}
	#customer_header #gnav .close_menu a { display: block;}
	#customer_header #gnav .close_menu a:hover { text-decoration: 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 { border-bottom: 1px solid #ccc;}
	#customer_header #gnav #close_top span {
		width: 15px; height: 0; padding: 15px 0 0;
		position: absolute; top: calc(50% - 7.5px); right: 4%; overflow: hidden;
	}
	#customer_header #gnav #close_top span:before,
	#customer_header #gnav #close_top span:after { background: #787878; margin: -1.5px 0 0; top: 50%;}

	#customer_header #gnav ul { display: block;}
	#customer_header #gnav li { border-bottom: 1px solid #ccc;}
	#customer_header #gnav li a { position: relative; padding: 15px calc(4% + 20px); color: #000;}
	#customer_header #gnav li a::after {
		content: ''; width: 20px; height: 20px; margin: -10px 0 0;
		position: absolute; top: 50%; right: 4%;
		background: url(https://www.syuuzanso.com/common/img/arrow_s3.svg) no-repeat center center #8aae7b;
		-webkit-background-size: auto 12px; background-size: auto 12px;
	}
	#customer_header #gnav li a:hover { background: none;}

	#customer_header #gnav .btn_reserve a { background: none;}
	#customer_header #gnav .btn_reserve a:hover { background: none;}

	#customer_header #gnav #close_bot { background: #019444; color: #fff;}
	#customer_header #gnav #close_bot a { color: #fff;}
	#customer_header #gnav #close_bot span { display: inline-block; padding: 0 20px; position: relative;}
	#customer_header #gnav #close_bot span:before,
	#customer_header #gnav #close_bot span:after { margin: -1.5px 0 0; top: 50%; background: #fff;}
}

/* breadcrumb
------------------------------------------------------ */
#customer_footer #breadcrumb { padding: 0 0 42.25%; margin: calc(22.5% + 20px) 0 0; position: relative; z-index: 0; background: #f2f8e7;}
#customer_footer #breadcrumb::before {
	content: ''; width: 100%; height: 0;
	padding: 22.5% 0 0; margin: -22.5% 0 0;
	position: absolute; top: 0; left: 0;
	background: url(https://www.syuuzanso.com/common/img/bread_bg_pc.png) no-repeat center bottom;
	-webkit-background-size: 100% auto; background-size: 100% auto;
}
#customer_footer #breadcrumb::after {
	content: ''; width: 100%; height: 0; padding: 42.25% 0 0;
	position: absolute; left: 0; bottom: 0;
	background: url(https://www.syuuzanso.com/common/img/f_bg_pc.png) no-repeat center bottom;
	-webkit-background-size: 100% auto; background-size: 100% auto;
}
#customer_footer #breadcrumb ol {
	width: 1100px; max-width: 96%; padding: 10px 0; margin: 5px auto 25px;
	border-top: 1px solid #b1d1b2; border-bottom: 1px solid #b1d1b2; font-size: 0; text-align: right;
}
#customer_footer #breadcrumb li {
	display: inline-block; padding: 0 0 0 12px;
	position: relative; font-size: 13px; line-height: 1.6;
}
#customer_footer #breadcrumb li:before {
	content: ''; width: 6px; height: 100%;
	position: absolute; left: 3px; top: 0;
	background: url(https://www.syuuzanso.com/common/img/arrow_s1.svg) no-repeat left center;
	-webkit-background-size: 100% auto; background-size: 100% auto;
}
#customer_footer #breadcrumb li:first-child { padding-left: 0;}
#customer_footer #breadcrumb li:first-child:before { display: none;}


@media screen and (max-width: 768px) {
	#customer_footer #breadcrumb { margin: calc(33.5% + 20px) 0 0;}
	#customer_footer #breadcrumb::before {
		padding: 33.5% 0 0; margin: -33.5% 0 0;
		background-image: url(https://www.syuuzanso.com/common/img/bread_bg_sp.png);
	}
	#customer_footer #breadcrumb::after { background-image: url(https://www.syuuzanso.com/common/img/f_bg_sp.png);}
}


/* Footer
------------------------------------------------------ */
/* patetop */
#customer_footer #pagetop { position: fixed; right: 15px; bottom: 15px; z-index: 10;}
#customer_footer #pagetop a {
	display: block; width: 50px; height: 0; padding: 50px 0 0;
	background: #8aae7b; border: 1px solid #fff; border-radius: 4px; overflow: hidden;
	-webkit-transition: background 0.5s;
	-o-transition: background 0.5s;
	transition: background 0.5s;
}
#customer_footer #pagetop a::before,
#customer_footer #pagetop a::after {
	content: ''; width: 12px; height: 1px;
	position: absolute; top: calc(50% - 5px); left: 50%;
	background: #fff;
	-webkit-transform-origin: left 50%;
	-moz-transform-origin: left 50%;
	-ms-transform-origin: left 50%;
	-o-transform-origin: left 50%;
	transform-origin: left 50%;
}
#customer_footer #pagetop a::before {
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
#customer_footer #pagetop a::after {
	-webkit-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	transform: rotate(135deg);
}
#customer_footer #pagetop a:hover { background: #759c65;}


/* footer */
#customer_footer #footer { padding: 50px 0 0;}
#customer_footer #footer .inner { width: 1100px; max-width: 96%; padding: 0 0 60px; margin: 0 auto;}
#customer_footer #footer .inner::after { content: ""; display: block; clear: both;}

#customer_footer #f_info > div,
#customer_footer #f_con .btn_reserve,
#customer_footer #group_wrap .group_list {
	display: -webkit-flex; display: -ms-flex; display: flex;
	justify-content: space-between;
}

#customer_footer #f_logo { width: 355px; float: left;}
#customer_footer #f_logo > a { display: inline-block; margin: 0 0 10px;}

#customer_footer #f_info { width: 680px; float: right;}
#customer_footer #f_con { padding: 0 0 15px;}
#customer_footer #f_con .tel { font-size: 0;}
#customer_footer #f_con .tel a,
#customer_footer #f_con .tel span { display: inline-block; vertical-align: middle;}
#customer_footer #f_con .tel .tel-link {
	padding: 0 0 0 30px; margin: 0 15px 0 0; background: url(https://www.syuuzanso.com/common/img/icon_tel.png) no-repeat left center;
	font-family: "ヒラギノ明朝 ProN W3", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 36px; line-height: 1.3;
}
#customer_footer #f_con .tel span { font-size: 14px;}
#customer_footer #f_con .link { font-size: 14px; text-align: right;}
#customer_footer #f_con .link p { display: inline-block;}
#customer_footer #f_con .link p + p { margin: 0 0 0 5px;}
#customer_footer #f_con .link a { display: inline-block; padding: 0 0 0 18px; position: relative;}
#customer_footer #f_con .link a::before {
	content: ''; width: 12px; height: 100%; position: absolute; left: 0; top: 0;
	background: url(https://www.syuuzanso.com/common/img/arrow_l1.svg) no-repeat left center;
	-webkit-background-size: 100% auto; background-size: 100% auto;
	color: #3b7d56;
}

#customer_footer #f_con .btn_reserve {
	-ms-align-items: center; align-items: center;
	padding: 10px 30px; background: #de9700; border-radius: 4px;
	color: #fff; font-size: 20px;
}
#customer_footer #f_con .btn_reserve:hover { background: #c48601; text-decoration: none;}

#customer_footer #f_nav { justify-content: flex-start !important; padding: 15px 0 0; border-top: 1px solid #000;}
#customer_footer #f_nav ul + ul { margin: 0 0 0 70px;}
#customer_footer #f_nav li + li { margin: 5px 0 0;}
#customer_footer #f_nav a { display: inline-block; padding: 0 0 0 12px; position: relative;}
#customer_footer #f_nav a::before {
	content: ''; width: 5px; height: 100%;
	position: absolute; left: 0; top: 0;
	background: url(https://www.syuuzanso.com/common/img/arrow_s2.svg) no-repeat left center;
	-webkit-background-size: 100% auto; background-size: 100% auto;
}

#customer_footer #group_wrap { padding: 25px 0 0; background: url(https://www.syuuzanso.com/common/img/f_group_bg.jpg) center top;}
#customer_footer #group_wrap .inner { padding-bottom: 40px;}
#customer_footer #group_wrap .group_logo { margin: 0 0 30px; position: relative; text-align: center;}
#customer_footer #group_wrap .group_logo a { position: absolute; bottom: 8px; left: calc(50% + 95px);}
#customer_footer #group_wrap .group_list { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#customer_footer #group_wrap .group_list li { width: calc( 100% / 6 ); margin: 0 0 20px; font-size: 0;}
#customer_footer #group_wrap .group_list li::after { content: ""; display: block; clear: both;}
#customer_footer #group_wrap .group_list li:last-child { margin-right: auto;}
#customer_footer #group_wrap .group_list li img { border: 1px solid #fff;}
#customer_footer #group_wrap .group_list li a {
	display: inline-block; width: calc(100% - 80px);
	padding: 0 0 0 10px; margin: 10px 0 0 10px;
	position: relative; font-size: 13px; vertical-align: top;
}
#customer_footer #group_wrap .group_list li a::before {
	content: ''; width: 5px; height: 1.6em;
	position: absolute; left: 0; top: 0;
	background: url(https://www.syuuzanso.com/common/img/arrow_s1.svg) no-repeat left center;
}
#customer_footer #group_wrap .group_list li.current a { color: #019444; pointer-events: none; text-decoration: underline;}

#customer_footer #copyright { padding: 5px 0; background: #8aae7b; color: #fff; font-size: 12px; text-align: center;}

@media screen and (max-width: 768px) {
	#customer_footer #footer { text-align: center;}
	#customer_footer #footer .inner { width: 92%; padding-bottom: 40px;}

	#customer_footer #f_info > div,
	#customer_footer #f_con .btn_reserve { display: block;}

	#customer_footer #f_logo,
	#customer_footer #f_info { width: auto; float: none;}
	#customer_footer #f_logo { margin: 0 0 20px;}
	#customer_footer #f_logo > a img { width: 250px;}
	#customer_footer #f_logo address span { display: inline-block;}

	#customer_footer #f_con { padding: 0;}
	#customer_footer #f_con .tel .tel-link { display: inline-block; padding: 0 0 0 30px; margin: 0;}
	#customer_footer #f_con .tel span { display: block;}
	#customer_footer #f_con .link { margin: 15px 0; font-size: 16px; text-align: center;}
	#customer_footer #f_con .link p { margin: 2px 10px !important;}

	#customer_footer #f_con .btn_group { display: block; padding: 10px 15px; margin: 20px 0 0; border: 1px solid #000; font-size: 0;}
	#customer_footer #f_con .btn_group img,
	#customer_footer #f_con .btn_group span { display: inline-block; vertical-align: middle;}
	#customer_footer #f_con .btn_group img { width: 50px; margin: 0 5px 0 0;}
	#customer_footer #f_con .btn_group span {
		padding: 0 20px 0 0; background: url(https://www.syuuzanso.com/common/img/arrow_l2.svg) no-repeat right center;
		-webkit-background-size: 15px auto; background-size: 15px auto; font-size: 16px;
	}

	#customer_footer #copyright { padding: 5px 0 63px;}
}


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

@media screen and (max-width: 768px) {
	#customer_footer #sp_nav { width: 100%; padding-bottom: env(safe-area-inset-bottom); position: fixed; bottom: 0; left: 0; z-index: 99; background: #8aae7b;}
	#customer_footer #sp_nav ul {
		display: -webkit-flex; display: -ms-flex; display: flex;
		width: 100%; border-top: 1px solid #fff;
	}
	#customer_footer #sp_nav li { flex-grow: 2;}
	#customer_footer #sp_nav li:last-child { flex-grow: 1;}
	#customer_footer #sp_nav a { display: block; padding: 5px; color: #fff; font-size: 13px; text-align: center;}
	#customer_footer #sp_nav a:hover { text-decoration: none;}
	#customer_footer #sp_nav a span {
		display: -webkit-inline-flex; display: -ms-inline-flex; display: inline-flex;
		-ms-align-items: center; align-items: center;
		height: 48px; background: no-repeat left center;
		-webkit-background-size: auto 30px; background-size: auto 30px;
		line-height: 1.4; text-align: left;
	}
	#customer_footer #sp_nav .fix_tel span { padding: 0 0 0 25px; background-image: url(https://www.syuuzanso.com/common/img/fix_tel.svg);}
	#customer_footer #sp_nav .fix_plan { background: #de9700;}
	#customer_footer #sp_nav .fix_plan span { padding: 0 0 0 40px; background-image: url(https://www.syuuzanso.com/common/img/fix_plan.svg);}
	#customer_footer #sp_nav .fix_pagetop span { padding: 0 0 0 30px; background-image: url(https://www.syuuzanso.com/common/img/fix_pagetop.svg);}
}



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



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