@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; min-height: 100vh; background: #000;
	-webkit-text-size-adjust: 100%;
}

#customer_header,
#customer_footer {
	color: #fff; font-size: 16px; font-weight: normal; line-height: 1.5;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

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

#customer_header input,
#customer_header select,
#customer_header textarea,
#customer_footer input,
#customer_footer select,
#customer_footer textarea { font-size: 13px;}

#customer_header *,
#customer_footer * { box-sizing: border-box; -webkit-box-sizing: border-box;}
#customer_header em,
#customer_footer em { font-style: normal;}

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

#customer_header .arrow,
#customer_footer .arrow {
	position: relative;
	color: #fff;
	vertical-align: middle;
	text-decoration: none;
}
#customer_header .arrow::before,
#customer_footer .arrow::before,
#customer_header .arrow::after,
#customer_footer .arrow::after{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}


/* ---------------------------------------------------
	Header
------------------------------------------------------ */
#customer_header { margin-bottom: 50px;}
#customer_header #header_wrap { width: 100%; min-width: 1100px; position: absolute; z-index: 1000; border-bottom: 1px solid #313131; top: 0; left: 0;}

#customer_header #header { width: 100%; min-width: 1100px; margin: 0 auto;
	background: -moz-linear-gradient(top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.8) 19%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.8) 19%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.8) 19%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}
#customer_header #header h1 { width: 16%; padding: 10px 2% 0 2%; float: left;}
#customer_header #header h1 img { width: 100%; max-width: 217px;}

#customer_header #header #lang { width: 12%; float: right; text-align: center; cursor: pointer; position: relative; font-size: 17px;}
#customer_header #header #lang p { background: url(https://www.kohro.com/common/img/h_arrow.png)no-repeat right 5% center,rgba(0,0,0,0.65); border-left: 1px solid #313131;}
#customer_header #header #lang p a[href="#header"] { padding: 35px 0; display: block;}
#customer_header #header #lang p a[href="#close"] { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none;}
#customer_header #header:target #lang p a[href="#close"] { pointer-events: auto;}

#customer_header #header #lang p a:hover { text-decoration: none;}
#customer_header #header #lang_list {
	width: 100%;
	position: absolute;
	height: 0;
	overflow: hidden;
	transition: .5s;
}
#customer_header #header:target #lang_list {
	height: 96px;
}
#customer_header #header #lang_list li { background: rgba(49, 49, 49, 0.8); border-top: 1px solid #6e6f6f;}
#customer_header #header #lang_list li:hover { opacity: 0.75;}
#customer_header #header #lang_list li a { padding: 5px 0; display: block; height: 32px; line-height: 22px;}
#customer_header #header #lang_list li a:hover { text-decoration: none;}


@media screen and (max-width: 1430px) {
	#customer_header #header #lang { width: 10%; font-size: 15px;}
	#customer_header #header h1 { padding: 16px 2% 0 1%;}
}

@media screen and (max-width: 1430px){
	#customer_header #header h1 { padding: 20px 2% 0 1%;}
}


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

#customer_header #gnav { width: 72%; float: left; position: relative;}
#customer_header #gnav .sp_logo { display: none;}
#customer_header #gnav ul { padding-top: 50px; margin-right: 2%; float: right;}
#customer_header #gnav li {
	float: left; font-size: 16px;
	-webkit-box-sizing: border-box; box-sizing: border-box;
}
#customer_header #gnav li:nth-last-child(2) { border-right:0; } /* 最後の閉じるボタンを抜かして一番最後のリスト */
#customer_header #gnav a { display:block; padding: 5px 15px 3px;}
#customer_header #gnav a:hover { text-decoration: none;}

#customer_header #gnav li a { position: relative; overflow: hidden; z-index: 2;}
#customer_header #gnav li a:before {
	content: ""; position: absolute; z-index: -1;
	left: 0; right: 100%; bottom: 0; background: #999; height: 1px;
	-webkit-transition-property: right;
	transition-property: right;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}

#customer_header #gnav div { position: absolute; top: 10px; right: 21%;}
#customer_header #gnav div p { float: left; padding-top: 10px; margin-right: 20px; color: #848383; font-size: 12px;}
#customer_header #gnav div .tel-link { display: block; float: right; font-size: 18px; padding: 0;}
#customer_header #gnav div .tel-link span { display: none;}
#customer_header #gnav div .tel-link em { font-size: 24px;}

#customer_header #gn_home,
#customer_header .gn2 { display: none;}

#customer_header #gnav #modal-open { width: 18%; min-width: 140px; float: right; padding: 35px 0 35px 30px; text-align: center; font-size: 17px; cursor: pointer;
	background: url(https://www.kohro.com/common/img/h_best_pc.png)no-repeat left 8% center,url(https://www.kohro.com/common/img/h_arrow.png)no-repeat right 8% center,#384464;}
#customer_header #gnav #modal-open span { display: none;}
#customer_header #gnav #modal-open:hover { text-decoration: none;}

@media screen and (max-width: 1430px) {
	#customer_header #gnav { width: 74%;}
	#customer_header #gnav li { font-size: 15px;}
	#customer_header #gnav a { padding: 5px 6px 3px;}
	#customer_header #gnav #modal-open { font-size: 15px;}
}


/* ---------------------------------------------------
	Main img
------------------------------------------------------ */
#customer_header #main_img { width: 100%; padding: 70px 0; margin: 92px auto 0; text-align: center;}
#customer_header #main_img h2 { padding: 2px 0; font-size: 30px; font-weight: bold; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;}
#customer_header #main_img h2 span { display: block; padding-top: 10px; color: #b9a65b; font-size: 13px; -moz-osx-font-smoothing: auto; -webkit-font-smoothing: subpixel-antialiased;}


/* ---------------------------------------------------
	breadcrumb
------------------------------------------------------ */
#customer_header #breadcrumb { margin: 5px auto; width: 1100px; max-width: 92%; font-size: 13px;}
#customer_header #breadcrumb li { display: inline-block; line-height: 1.6;}
#customer_header #breadcrumb li:nth-child(1) a { color: #b9b9b9;}
#customer_header #breadcrumb li:before { content: '>'; margin: 0 5px;}
#customer_header #breadcrumb li:first-child:before { display: none;}


/* ---------------------------------------------------
	#lead
------------------------------------------------------ */
#customer_header #lead { padding: 0; background: url(../img/lead_bg.jpg)no-repeat center; background-size: cover; text-align: center;}
#customer_header #lead .inner { padding: 80px 0;}
#customer_header #lead h3 { padding-bottom: 40px; margin: 0; font-size: 35px; font-weight: normal;}
#customer_header #lead p { line-height: 2.2;}


/* ---------------------------------------------------
	Footer
------------------------------------------------------ */
#customer_footer #pagetop { display:block; position: fixed; bottom: 30px; right: 30px; z-index: 99;}
#customer_footer #pagetop a { display: block; width: 60px; height: 60px;}

#customer_footer #footer_wrap { margin-top: 80px; background: #000; border-top: 1px solid #545454;}
#customer_footer #footer { width: 1100px; max-width: 92%; padding: 50px 0 30px; margin: 0 auto;}

#customer_footer #f_logo { width: 370px; float: left;}
#customer_footer #f_logo address { margin-bottom: 0; padding-top: 10px; color: #ccc; font-size: 14px; line-height: 1.5;}
#customer_footer #f_logo address em { display: block; margin-bottom: 5px; font-size: 16px;}
#customer_footer #f_logo address span { margin-right: 1em;}

#customer_footer #f_nav { padding: 15px 0 0; width: calc( 100% - 370px); max-width: 700px; float: right;}
#customer_footer #f_nav ul { width: 30%; margin: 0 1.5%; float: left; font-size: 14px;}
#customer_footer #f_nav li {
	padding: 0 0 0 12px; margin: 0 0 3px 0;
	background: url(https://www.kohro.com/common/img/f_arrow.png) no-repeat left center;
}
#customer_footer #f_nav li#fn_sns { font-size: 13px; }
#customer_footer #f_nav li#fn_agent{
	margin: 10px 0 0; padding: 8px 10px;
	text-align: center; background: none; border: 1px solid #ccc;
}

#customer_footer #copyright { clear: both; padding: 20px 0 0; text-align: right; color: #848484; font-size: 12px;}


/* ---------------------------------------------------
	#f_reco
------------------------------------------------------ */
#customer_footer #f_reco { padding: 50px 0; background: #2e2e2e;}
#customer_footer #f_reco .inner { width: 900px; max-width: 92%; margin: 0 auto;}
#customer_footer #f_reco .reco1 { width: 600px; float: left; padding-right: 60px; padding-bottom: 15px; box-sizing: border-box; border-right: 1px solid #535353;}
#customer_footer #f_reco .reco2 { width: 300px; float: right; padding-left: 60px; box-sizing: border-box;}
#customer_footer #f_reco h4 { margin: 0 0 20px; font-size: 16px; font-weight: normal; line-height: 1.5;}

#customer_footer #f_reco h4 .ico_hexagon { position: relative; width: 14px; height: 8.08px;
  background-color: #8277b0; margin: 4.04px 10px 4.04px 0; display: inline-block; vertical-align: text-bottom;
}
#customer_footer #f_reco .reco2 h4 .ico_hexagon { background-color: #7795b0;}

#customer_footer #f_reco h4 .ico_hexagon:before,
#customer_footer #f_reco h4 .ico_hexagon:after {
  content: ""; position: absolute; width: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}
#customer_footer #f_reco h4 .ico_hexagon:before { bottom: 100%; border-bottom: 4.04px solid #8277b0;}
#customer_footer #f_reco .reco2 h4 .ico_hexagon:before { border-bottom: 4.04px solid #7795b0;}

#customer_footer #f_reco h4 .ico_hexagon:after { top: 100%; width: 0; border-top: 4.04px solid #8277b0;}
#customer_footer #f_reco .reco2 h4 .ico_hexagon:after { border-top: 4.04px solid #7795b0;}

#customer_footer #f_reco dl { float: left; margin-left: 30px; font-size: 12px; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro","Osaka","Verdana","Helvetica","Arial","ＭＳ Ｐゴシック", sans-serif;}
#customer_footer #f_reco dl+dl { margin-left: 80px;}
#customer_footer #f_reco .reco1 dl dt { color: #a195d2; font-weight: normal;}
#customer_footer #f_reco dl dd { padding-left: 10px; line-height: 1.5; margin-bottom: 3px; background: url(https://www.kohro.com/common/img/f_arrow.png) no-repeat left center;}
#customer_footer #f_reco dl dd a { color: #afafaf;}


/* ---------------------------------------------------
	clear
------------------------------------------------------ */
#customer_header #header:after,
#customer_header #nav_wrap:after,
#customer_header #gnav:after,
#customer_header #gnav ul:after,
#customer_header #gnav div:after,
#customer_footer #footer:after,
#customer_footer #f_nav:after,
#customer_footer #f_reco:after { content: "."; display: block; height: 0px; clear: both; visibility: hidden; font-size: 0;}