@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: 1100px; background: #fff; color: #000;}

#customer_header,
#customer_footer {
	background: url(../img/bg.gif); color: #292929;
	font-size: 16px; font-weight: normal; line-height: 1.8;
	font-family: "Yu Mincho", "YuMincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif; min-width: 1100px;
	-webkit-text-size-adjust: 100%; letter-spacing: 0.1em; font-feature-settings: "palt";

	display: -webkit-flex; display: -ms-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
}

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

#customer_header a,
#customer_footer a { color: #333; text-decoration: none;}
#customer_header a:hover,
#customer_footer a:hover { color: #333; 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 (min-width: 600px) {
	#customer_header a[href^="tel:"],
	#customer_footer a[href^="tel:"] { pointer-events: none; color: inherit; }
}

@media screen and (max-width: 600px) {
	body { min-width: 0;}

	#customer_header,
	#customer_footer { min-width: 100%; line-height: 1.5; }

	#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; position: absolute; background-color: rgba(255,255,255,0.8); }
#customer_header #header { width: 100%; min-width: 1100px; margin: 0 auto; padding: 24px 2%; display: flex; box-sizing: border-box;}

#customer_header #header .close_menu { display: none;}
#customer_header #header #logo img { width: 236px; -webkit-backface-visibility: hidden; }

#customer_header #header #gnav { display: flex; margin: 0 0 0 auto; width: 860px; justify-content: flex-end;}
#customer_header #header #gnav >ul { display: flex; width: calc(96% - 130px); margin: 0 auto 0 0; font-size: 16px; justify-content: flex-end;}
#customer_header #header #gnav >ul li { padding: 0 1.8% 0 0; white-space: nowrap;}
#customer_header #header #gnav >ul li:nth-last-of-type(1) { padding: 0;}
#customer_header #gn_home { display: none;}

#customer_header #lang { position: relative; font-size: 14px;}
#customer_header #lang a { display: block; padding: 2px 25px; text-align: center; border: 1px solid #292929; color: #292929; text-decoration: none; }
#customer_header #lang a span { position: relative; padding: 0 0 0 10px;}
#customer_header #lang a span::before { content: "";
  display: block;
  position: absolute;
  top: 40%;
  left: 0;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top: 6px solid #393939;
  border-bottom-width: 0;
}
#customer_header #lang a:hover { opacity: 0.7;}
#customer_header #lang .close_menu {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	border: 0;
	box-sizing: border-box; }
#customer_header #lang_list {
	visibility: hidden;
	width: 100%;
	height: 180px;
	position: absolute;
	border: 1px solid #888;
	box-sizing: border-box;
	border-top: none;
	font-size: 14px;
}
#customer_header:target #lang_list { visibility: visible; }
#customer_header:target #lang .close_menu { display: block; }
#customer_header #lang_list li { border-top: 1px solid #888; text-align: center;}
#customer_header #lang_list li:nth-of-type(1) { border-top: none;}
#customer_header #lang_list li:hover { opacity: 0.8;}
#customer_header #lang_list li a { padding: 5px 0; display: block; border: 0; background-color: #fff;}
#customer_header #lang_list li a:hover { text-decoration: none;}

@media screen and (max-width: 1100px) {
 #customer_header #header #logo { padding: 0 2% 0 0; }

 #customer_header #header #gnav { margin: 0 0 0 auto; font-size: 17px;}
 #customer_header #header #gnav >ul li { padding: 0 1% 0 0; white-space: inherit;}
 #customer_header #lang a { padding: 2px 10px;}
 #customer_header #lang { margin: 0 0 0 auto; }
}

@media screen and (max-width: 600px) {
	#customer_header #header_wrap { display: block; position: static; min-width: auto;}
	#customer_header #header { min-width: 100%;}
	#customer_header #header #logo {
		display: flex; justify-content: center; align-items: center;
		width: 100%; text-align: center; padding: 0;}
	#customer_header #header #logo a { line-height: 1; }
	#customer_header #lang .close_menu { display: none; }
	#customer_header #lang { margin: 20px 0 30px; padding: 2px 10px; }
	#customer_header #lang>a { pointer-events: none; }
	#customer_header #lang a { border: 1px solid #888;}
	#customer_header #lang a span::before { display: none;}
	#customer_header #lang_list { display: block !important; height: auto; position: static; visibility: visible; }
	#customer_header #lang_list li:nth-of-type(2) { border-top: none;}
	#customer_header #lang_list li:nth-of-type(2),
	#customer_header #lang_list li:nth-of-type(4) { border-left: 1px solid #888;}
	#customer_header #lang_list li { float: left; width: 50%; box-sizing: border-box;}
	#customer_header #lang_list li a { background-color: inherit;}
	#customer_header #lang_list li:last-of-type { width: 100%;}

	#customer_header #header #gnav {
		display: block; height: 0;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-overflow-scrolling: touch;
		-webkit-transition: all 0.75s;
		-o-transition: all 0.75s;
		transition: all 0.75s;
		visibility: hidden;
		opacity: 0;
		position: fixed; top: 0; left: 0;
		pointer-events: none;
		width: 100%; margin: 0 auto; padding: 0 4%;
		background: rgba(255,255,255,0.9);
	}
	#customer_header #header #gnav:target {
		height: 100%;
 		visibility: visible;
		opacity: 1;
 		transform: translate(0);
		z-index: 1000;
		pointer-events: auto;
 	 }

	#customer_header #header #gnav >ul { display: block; width: auto; padding: 50px 0 0;
		position: relative; }
	#customer_header #header #gnav >ul li:not(.close_menu) { position: relative; margin: 0 0 10px; padding: 0 0 0 20px;}
	#customer_header #header #gnav >ul li:not(.close_menu)::before { position: absolute; content: ''; display: block; top: 42%; left: 0; width: 0;
	height: 0;
	border-style: solid;
	border-width: 3px 0 3px 10px;
	border-color: transparent transparent transparent #a6a6a6;}
	#customer_header #gn_home,.close_menu { display: block;}
	#customer_header #gnav .close_menu { cursor: pointer;}
	#customer_header #gnav .close_menu span:before,
	#customer_header #gnav .close_menu span:after { content: ''; width: 45px; height: 1px; 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 { position: absolute; top: 5px; right: 30px; display: block; padding: 5px 0; text-align: center;}
	#customer_header #gnav #close_top a {
		width: 45px; height: 0; padding: 45px 0 0;
		position: absolute; 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 { display: block; color: #424242; text-align: center; font-size: 12px;}
	#customer_header #gnav #close_bot span { display: inline-block; padding: 45px 0 0; position: relative;}
	#customer_header #gnav #close_bot span::before,
	#customer_header #gnav #close_bot span::after { margin: 0 0 0 -21px; top: 25px; left: 50%; background-color: #ccc;}
	#customer_header #gnav #close_bot span::before,
	#customer_header #gnav #close_bot span::after {
		content: ''; width: 45px; height: 1px;
		position: absolute; background: #434343;
	}
}


/* Main img
------------------------------------------------------ */
#customer_header #main_tit { height: 630px; text-align: center; background-repeat: no-repeat; background-size: cover; color: #fff; display: flex; justify-content: center; align-items: center;
background-image: url(../img/tit_bg_pc.jpg); }
#customer_header #main_tit span:last-child { margin: -20px 0 0; font-size: 30px; width: 100%; text-align: center; display: block;
	text-shadow: 0px 0px 12px rgba(0,0,0,0.2),
	0px 0px 12px rgba(0,0,0,0.2),
	0px 0px 12px rgba(0,0,0,0.2),
	0px 0px 12px rgba(0,0,0,0.2);}
#customer_header #main_tit h1 span { color: #fff;}
#customer_header #main_tit h1 span.tit_en { font-size: 120px; font-family: 'Allura'; line-height: 1; letter-spacing: 0; }

@media screen and (max-width: 600px) {
	#customer_header #main_tit {
	height: 300px; padding: 0 4%;
	background: url(../img/tit_bg_sp.jpg)no-repeat center/cover; }
	#customer_header #main_tit span:last-child { margin: 0; font-size: 24px;}
	#customer_header #main_tit h1 span.tit_en { font-size: 60px;}
}


/* ---------------------------------------------------
	footer
------------------------------------------------------ */
/* breadcrumb */
#customer_footer #breadcrumb { padding: 10px 4%; font-size: 13px; background-color: #e5e8ea;}
#customer_footer #breadcrumb li { display: inline-block; line-height: 1.6;}
#customer_footer #breadcrumb li:before { content: '>'; margin: 0 5px;}
#customer_footer #breadcrumb li:first-child:before { display: none;}

#customer_footer #footer_wrap { background-color: #fff;}
#customer_footer #footer { padding: 90px 0 0;}
#customer_footer #f_logo { margin: 0 0 40px; text-align: center;}
#customer_footer #footer address { margin: 40px 0 20px; line-height: 1.8; }
#customer_footer #footer address+a { display: block; margin: 0 auto 10px; padding: 25px 0; width: 400px; color: #fff; text-align: center; background: url(../img/f_btn_bg.gif)no-repeat; background-size: cover;}
#customer_footer #footer address+a span { position: relative; padding: 0 30px 0 0;}
#customer_footer #footer address+a span::after { content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -4px;}
#customer_footer #footer address+a:hover { text-decoration: none; opacity: 0.7;}
#customer_footer #footer address+a+a { position: relative; display: table; margin: 0 auto; padding: 0 0 0 15px;}
#customer_footer #footer address+a+a::before { position: absolute; content: ''; display: block; top: 42%; left: 0; width: 0;
height: 0;
border-style: solid;
border-width: 3px 0 3px 10px;
border-color: transparent transparent transparent #000000;
}
#customer_footer #f_nav { width: 1100px; max-width: 92%; margin: 0 auto; border-top: 1px solid #e1d6d7;}
#customer_footer #f_nav div { display: flex; justify-content: space-between; font-size: 13px;}
#customer_footer #f_nav .acc_tit { display: none;}
#customer_footer #f_nav ul { margin: 45px 0 0 0;}
#customer_footer #f_nav li { position: relative; margin: 0 0 10px; padding: 0 0 0 20px;}
#customer_footer #f_nav li::before { position: absolute; content: ''; display: block; top: 42%; left: 0; width: 0;
height: 0;
border-style: solid;
border-width: 3px 0 3px 10px;
border-color: transparent transparent transparent #a6a6a6;}

#customer_footer #f_nav .sub { margin-bottom: 4px; }
#customer_footer #f_nav .sub::before { display: inline-block; content: '-'; margin-right: 0.5em; border: none; position: static; width: auto; height: auto; }
#customer_footer #f_nav .bor a { text-decoration: underline; }
#customer_footer #f_nav .bor a:hover { text-decoration: none; }

#customer_footer p#copyright { margin: 60px 0 0; padding: 3px 0 5px; color: #fff; text-align: center; background-color: #6c9fcc; font-size: 12px;}

@media screen and (max-width: 600px) {
	#customer_footer #footer { padding: 30px 0 70px;}
	#customer_footer #footer address { margin: 30px 0 20px;}
	#customer_footer #footer address+a { width: 100%;}
	#customer_footer #f_logo { padding: 0 4%;}
	#customer_footer #f_logo >img { width: 230px;}
	#customer_footer #f_nav .acc_tit {
		display: block; width: 100%; padding: 10px 25px; margin: 0 0 15px;
		position: relative; background-color: #575757; color: #fff; text-align: center;
		-webkit-box-sizing: border-box; box-sizing: border-box;
	}
	#customer_footer #f_nav .acc_tit:after {
		content: ''; width: 9px; height: 9px; margin: -4px 0 0 0;
		position: absolute; top: 50%; right: 10px;
		background: url(../img/f_arrow_off.png) no-repeat left top; background-size: 100%;
	}
	#customer_footer #f_nav .acc_tit.active:after { background-image: url(../img/f_arrow_on.png);}
	#customer_footer #f_nav div { margin: 20px 0 0; flex-wrap: wrap;}
	#customer_footer #f_nav ul { width: 50%; margin: 0;}
	#customer_footer #f_nav ul:last-of-type { width: 100%;}

	#customer_footer p#copyright { margin: 30px 0 0;}
}

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

#customer_footer #sp_nav { display: none;}

@media screen and (max-width: 600px) {
	#customer_footer #sp_nav { display: block; position: fixed; bottom: 0; left: 0; background: #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(2),
	#customer_footer #sp_nav li:nth-of-type(3),
	#customer_footer #sp_nav li:nth-of-type(4) { border-left: 1px solid #fff;}
	#customer_footer #sp_nav a,
	#customer_footer #sp_nav .tel-link { display: block; padding: 10px 0; text-align: center; font-size: 12px; color: #fff;}
	#customer_footer #sp_nav img { width: 40px; }
	#customer_footer #sp_nav li span { display: block; margin: 5px auto 0;}
	#customer_footer #sp_nav li:nth-of-type(1),
	#customer_footer #sp_nav li:nth-of-type(2) { background-color: #507696;}
	#customer_footer #sp_nav li:nth-of-type(3) { width: 40%; background-color: #1586b6;}
	#customer_footer #sp_nav li:nth-of-type(4) { background-color: #bad5ec;}
	#customer_footer #sp_nav li:nth-of-type(4) a { color: #575757;}
}


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

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


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



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