@charset "utf-8";

/* header
===================================================*/
header{
	background: url(../images/hdr_bg01.gif) repeat-x 0 0;
	padding: 5px 10px;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	z-index: 999;
}
header .meinLogo{
	width: 210px;
	float: left;
	margin-top: 1px;
}
header .menuBtn{
	display: inline-block;
	float: right;
	border: 1px solid #777;
	background-color: #111;
	padding: 5px;
}
header .menuBtn.open{
	background-color: #545454;
}
header .menuBtn span{
	display: inline-block;
	width: 18px;
	vertical-align: middle;
	margin-right: 5px;
}
header .menuBtn p{
	display: inline-block;
	vertical-align: middle;
	color: #fff;
	font-size: 85.7%;
}
.reserveAreaHdr .yearANDmonth,
header .reserveBoxHdr .yearANDmonth,
.compGnav .compGnavInner .reserveBoxHdr .yearANDmonth,
.mainViArea .reserveBoxTop .yearANDmonth{
	width: 82px;
	margin-right: 5px;
	vertical-align: middle;
}
.reserveAreaHdr .day,
header .reserveBoxHdr .day,
.compGnav .compGnavInner .reserveBoxHdr .day,
.mainViArea .reserveBoxTop .day{
	width: 35px;
	margin-right: 5px;
	vertical-align: middle;
}
.reserveAreaHdr button.calendar,
header .reserveBoxHdr button.calendar,
.compGnav .compGnavInner .reserveBoxHdr button.calendar,
.mainViArea .reserveBoxTop button.calendar{
	width: 25px;
	vertical-align: middle;
	margin: 0;
	background: url("../images/date_ic02.png") no-repeat 0 0;
	background-color: none;
}
.reserveAreaHdr .calendarAttr,
header .reserveBoxHdr .calendarAttr,
.compGnav .compGnavInner .reserveBoxHdr .calendarAttr,
.mainViArea .reserveBoxTop .calendarAttr{
	height: 1px;
	padding: 0;
	border: 0;
	display: block;
	opacity: 0;
	-ms-filter: "alpha(opacity=0)";
}
.reserveAreaHdr .itemBox .radioBox,
header .reserveBoxHdr .itemBox .radioBox,
.compGnav .compGnavInner .reserveBoxHdr .itemBox .radioBox,
.mainViArea .reserveBoxTop .itemBox .radioBox{
	display: table-cell;
	vertical-align: middle;
	width: 19px;
	height: 19px;
	position: relative;
}
.reserveAreaHdr .itemBox .radioBox .radio,
header .reserveBoxHdr .itemBox .radioBox .radio,
.compGnav .compGnavInner .reserveBoxHdr .itemBox .radioBox .radio,
.mainViArea .reserveBoxTop .itemBox .radioBox .radio{
	position: absolute;
	opacity: 0;
	z-index: 0;
	top: 0;
	left: 0;
}
.reserveAreaHdr .itemBox .radioBox img,
header .reserveBoxHdr .itemBox .radioBox img,
.compGnav .compGnavInner .reserveBoxHdr .itemBox .radioBox img,
.mainViArea .reserveBoxTop .itemBox .radioBox img{
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	padding-left: 5px;
}
.reserveAreaHdr .itemBox label,
header .reserveBoxHdr .itemBox label,
.compGnav .compGnavInner .reserveBoxHdr .itemBox label,
.mainViArea .reserveBoxTop .itemBox label{
	display: table-cell;
	vertical-align: middle;
	color: #fff;
	font-size: 107%;
	line-height: 1;
	padding-left: 15px;
}
.reserveBgArea{
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 100;
}

/* ganv
===================================================*/
.spMenu{
	display: none;
	position: fixed;
	width: 100%;
	top: 39px;
	left: 0;
	background-color: #545454;
	color: #fff;
	z-index: 999;
}
#gnavSp li{
	border-bottom: 1px solid #2c2c2c;
}
#gnavSp li a{
	display: block;
	position: relative;
	font-size: 114%;
	color: #fff;
	padding: 13px 22px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
#gnavSp li a::before{
	content: "";
	position: absolute;
	left: 10px;
	top: 16px;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #fff;
}
.spMenu .hdrLang{
	margin: 20px 10px 0;
	padding: 10px;
	text-align: center;
	border: 1px solid #777;
	background-color: #343434;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.spMenu .hdrLangHerf,
.kph_hachioji .spMenu .hdrFb, 
.kph_tama .spMenu .hdrFb{
	width: 46%;
	margin: 10px 0 20px 10px;
	float: left;
	clear: both;
}
.spMenu .hdrLangHerf .hdrLang {
	margin: 0;
}
.spMenu .hdrLang.open{
	background-color: #111;
}
.spMenu .hdrLang span{
	display: inline-block;
	/*background: url("../images/hdr_ic01.png") no-repeat left center;
	padding: 3px 0 3px 25px;*/
	padding: 3px 0;
	font-size: 92.8%;
}
.spMenu .hdrLangArea{
	display: none;
	background-color: #111;
	border-left: 1px solid #777;
	border-right: 1px solid #777;
}
.spMenu .hdrLangHerf .hdrFaq{
	margin: 0;
}
.spMenu .hdrLangArea li a{
	display: block;
	padding: 10px;
	border-bottom: 1px solid #777;
	color: #fff;
	text-align: center;
}
.spMenu .hdrMember,
.spMenu .hdrFb,
.spMenu .hdrInsta,
.spMenu .hdrYT,
.kph_hachioji .spMenu .hdrMember, 
.kph_tama .spMenu .hdrMember {
	margin: 10px 0 20px 10px;
	width: 46%;
	float: left;
}
.spMenu .hdrMember span{
	display: inline-block;
	/*background: url("../images/hdr_ic02.png") no-repeat left center;
	padding: 3px 0 3px 20px;*/
	padding: 3px 0;
}
.spMenu .hdrFaq{
	margin: 10px 0 20px 10px;
	float: left;
	width: 46%;
}
.spMenu .hdrFaq span{
	display: inline-block;
	/*background: url("../images/hdr_ic03.png") no-repeat left center;
	padding: 3px 0 3px 20px;*/
	padding: 3px 0;
}
.spMenu .hdrFb span{
	display: inline-block;
	/*background: url("../images/hdr_ic04.png") no-repeat left center;
	padding: 3px 0 3px 28px;*/
	padding: 3px 0;
}
.spMenu .hdrInsta span{
	display: inline-block;
	/*background: url("../images/hdr_ic04.png") no-repeat left center;
	padding: 3px 0 3px 28px;*/
	padding: 3px 0;
}
.spMenu .hdrYT span{
	display: inline-block;
	/*background: url("../images/hdr_ic04.png") no-repeat left center;
	padding: 3px 0 3px 28px;*/
	padding: 3px 0;
}
.spMenu .hdrMember a,
.spMenu .hdrFaq a,
.spMenu .hdrFb a,
.spMenu .hdrInsta a,
.spMenu .hdrYT a{
	display: block;
	border: 1px solid #777;
	background-color: #343434;
	padding: 10px;
	text-align: center;
	font-size: 92.8%;
	color: #fff;
}
.spMenu .hdrThai{
	margin: 20px 10px 0;
	padding: 10px;
	text-align: center;
	border: 1px solid #777;
	background-color: #343434;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.spMenu .hdrThaiHerf{
	width: 46%;
	margin: 10px 0 20px 10px;
	float: left;
}
.spMenu .hdrThaiHerf .hdrThai {
	margin: 0;
}
.spMenu .hdrThai.open{
	background-color: #111;
}
.spMenu .hdrThai span{
	display: inline-block;
	padding: 3px 0;
	font-size: 92.8%;
}
.spMenu .hdrThaiArea{
	display: none;
	background-color: #111;
	border-left: 1px solid #777;
	border-right: 1px solid #777;
}
.spMenu .hdrThaiHerf .hdrFaq{
	margin: 0;
}
.spMenu .hdrThaiHerf li a{
	display: block;
	padding: 10px;
	border-bottom: 1px solid #777;
	color: #fff;
	text-align: center;
}
.spMenu .close{
	background-color: #747474;
	text-align: center;
	font-size: 114%;
	padding: 10px;
}
.spMenu .close span{
	position: relative;
}
.spMenu .close span::before{
	content: "";
	position: absolute;
	top: 3px;
	left: -28px;
	width: 10px;
	height: 10px; 
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}
.spMenu .close span::after{
	content: "";
	position: absolute;
	top: 3px;
	left: -14px;
	width: 10px;
	height: 10px; 
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
}

/* searchArea
===================================================*/
.searchArea{
	background-color: #111;
	padding: 5px 10px;
	position: fixed;
	top: 39px;
	left: 0;
	width: 100%;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	z-index: 2;
}
.searchArea p span{
	display: inline-block;
	margin-left: 8px;
}
.searchArea .location a{
	display: block;
	position: relative;
	float: left;
	border: 1px solid #777;
	width: 48%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	text-align: center;
	color: #fff;
	padding: 7px 0;
}
.searchArea .location a::before{
	content: "";
	position: absolute;
	left: 8px;
	top: 10px;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #fff;
}
.searchArea .reservations{
	position: relative;
	float: right;
	background-color: #a1834c;
	width: 48%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	text-align: center;
	color: #fff;
	padding: 0;
}
.kph_tama .searchArea .reservations,
.kph_hachioji .searchArea .reservations {
	padding: 6px 0;
}
.searchArea .reservations.open{
	background-color: #b49c70;
}
.searchArea .reservations::before{
	content: "";
	position: absolute;
	left: 8px;
	top: 11px;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #fff;
}
.kph_tama .searchArea .reservations::before,
.kph_hachioji .searchArea .reservations::before {
	content: "";
	position: absolute;
	left: 8px;
	top: 13px;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid #fff;
}
.searchArea .reservations a {
	display: block;
	padding: 8px 0;
	color: #fff;
}
.searchArea .reservations a:hover {
	color: #fff !important;
}

.reserveAreaHdr{
	display: none;
	position: fixed;
	top: 79px;
	left: 0;
	width: 100%;
	background: url(../images/reserve_bg01.gif) repeat 0 0;
	background-size: 12px 21px;
	margin-top: -5px;
	padding: 15px 15px 0;
	border-top: 5px solid #b49c70;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	z-index: 998;
}
.reserveAreaHdr .itemBox{
	display: table;
	width: 100%;
	margin-bottom: 15px;
}
.reserveAreaHdr .itemBox .reserveTit01{
	display: table-cell;
	vertical-align: middle;
	color: #fff;
	width: 80px;
}
.reserveAreaHdr button{
	margin-bottom: 15px;
}
.reserveAreaHdr .confirmBtn a{
	display: block;
	text-align: center;
	color: #fff;
	border: 1px solid #a1834c;
	padding: 10px 10px 10px 23px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	margin-bottom: 20px;
}
.reserveAreaHdr .confirmBtn a:hover{
	background-color: rgba(255,255,255,0.15);
	color: #fff!important;
	text-decoration: none;
}
.reserveAreaHdr .confirmBtn a span{
	position: relative;
}
.reserveAreaHdr .confirmBtn a span::before{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	top: 4px;
	left: -12px;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #a1834c;
}
.reserveAreaHdr .loginLink{
	margin-bottom: 20px;
	font-size: 92.8%;
	width: 49%;
	display: inline-block;
	padding-left: 10px;
}
.reserveAreaHdr .loginLink a{
	color: #fff;
	position: relative;
}
.reserveAreaHdr .loginLink a::before{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	top: 3px;
	left: -10px;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #a1834c;
}
.reserveAreaHdr .loginLink a[target="_blank"] span{
	background: url(../images/link_ic02.gif) no-repeat center right;
	width: 11px;
	height: 10px;
	padding-right: 15px;
}
.reserveAreaHdr .close{
	background-color: #747474;
	text-align: center;
	font-size: 114%;
	padding: 10px;
	color: #fff;
	margin: 0 -15px;
}
.reserveAreaHdr .close span{
	position: relative;
}
.reserveAreaHdr .close span::before{
	content: "";
	position: absolute;
	top: 3px;
	left: -28px;
	width: 10px;
	height: 10px; 
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}
.reserveAreaHdr .close span::after{
	content: "";
	position: absolute;
	top: 3px;
	left: -14px;
	width: 10px;
	height: 10px; 
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
}

/* breadcrumb
===================================================*/
.breadcrumb{
	border-bottom: 1px solid #dfdfdf;
	padding: 15px 0;
	margin: 79px 0 25px;
	font-size: 75%;
}
.breadcrumb ul{
	width: 100%;
}
.breadcrumb li{
	display: inline-block;
	padding: 0 12px 0 10px;
}
.breadcrumb li a{
	color: #555;
	position: relative;
}
.breadcrumb li span{
	color: #555;
	font-weight: bold;
}
.breadcrumb li a::before{
	content:"";
	position: absolute;
	background: url(../images/breadcrumb_ic.gif) no-repeat 0 0;
	right: -19px;
	top: 3px;
	width: 10px;
	height: 8px;
}

/* contents
===================================================*/
#contents .sec01{
	padding: 0 10px;
	margin-bottom: 15px;
}
#contents .sec02{
	padding: 0 10px;
	margin-bottom: 30px;
}
#contents .col1 img,
#contents .col2 img,
#contents .col3 img,
#contents .col4 img{
	margin-bottom: 10px;
}
#contents .col1 p,
#contents .col2 p,
#contents .col3 p,
#contents .col4 p{
	font-size: 85.7%;
	line-height: 1.375;
	margin-bottom: 25px;
}
#contents .col2 .col2itemL,
#contents .col2 .col2itemR{
	width: 100%;
	float: none;
}
#contents .col3 .col3itemL,
#contents .col3 .col3itemR,
#contents .col4 .col4itemL,
#contents .col4 .col4itemR{
	width: 48.3%;
	float: left;
}
#contents .txtThere .col3itemL{
	margin: 3px 10px 0 0;
}
#contents .txtThere .col4itemL{
	margin: 3px 0 0 0;
}
#contents .txtThere .col3itemR{
	margin: 3px 0 0 10px;
	float: right;
}
#contents .txtThere .col4itemR{
	margin: 3px 0 0 0;
	float: right;
}
#contents .col3 .col3itemL:first-child,
#contents .col3.repeatType .col3itemL:nth-child(odd),
#contents .col3.repeatType .col3itemR,
#contents .col4 .col4itemL:nth-child(odd){
	margin-right: 3.4%;
}
#contents .col3.repeatType .col3itemR:nth-child(6){
	margin-right: 0;
}
#contents .col4.txtThere .col4itemR{
	float: left;
}
#contents .col4.txtThere .col4itemR:first-child{
	margin-right: 3.4%;
}
#contents .col2itemL,
#contents .col2itemR{
	width: 100%;
	float: none;
}
#contents .col3itemL,
#contents .col3itemR,
#contents .col4itemL,
#contents .col4itemR{
	width: 48.3%;
	float: left;
}
#contents .col3itemL.first,
#contents .col4itemL:nth-child(odd){
	margin-right: 3.4%;
}

/* lnav
===================================================*/
.lnav{
	display: none;
}
.lnav li a{
	display: block;
	position: relative;
	background-color: #f1ece4;
	border-top: 1px solid #fff;
	padding: 10px 10px 10px 20px;
	font-size: 128.5%;
	color: #333;
}
.lnav li a::before{
	content: "";
	position: absolute;
	left: 10px;
	top: 15px;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #a1834c;
}
.lnav p.lnavTop{
	padding: 0;
	text-align: left;
}
.lnav p.lnavTop a{
	color: #856832;
	font-size: 114%;
	position: relative;
	background-color: #f1ece4;
	padding: 11px 10px;
	width: 100%;
	display: block;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.lnav p.lnavTop a::before{
	content: "";
	position: absolute;
	right: 10px;
	top: 16px;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid #a1834c;
}
.lnav p{
	color: #fff;
	font-size: 114%;
	text-align: center;
	background-color: #b1996d;
	padding: 11px 0;
}
.lnav p span{
	display: inline-block;
	position: relative;
}
.lnav p span::before{
	content:"";
	position: absolute;
	left: -29px;
	top: 2px;
	width: 10px;
	height: 10px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}
.lnav p span::after{
	content:"";
	position: absolute;
	left: -15px;
	top: 2px;
	width: 10px;
	height: 10px;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}

/* footer
===================================================*/
footer .ftr{
	background: url(../images/bg01.gif) repeat 0 0;
}
footer .ftrBnrArea{
	background-color: #242424;
	padding: 20px 25px;
}
footer .ftrBnrArea .kpht{
	width: 41.85%;
	float: left;
}
footer .ftrBnrArea .life,
footer .ftrBnrArea .wifi{
	margin-bottom: 8px;
}
.kph_tama footer .ftrBnrArea div,
.kph_hachioji footer .ftrBnrArea div{
	width: 41.85%;
	float: right;
}
.kph_tama footer .ftrBnrArea .wifi,
.kph_hachioji footer .ftrBnrArea .wifi{
	width: 54%;
	float: left;
}
footer .ftrBnrArea p{
	color: #fff;
	text-align: center;
	margin-bottom: 5px;
}
footer .ftrBnrArea .TA_certificateOfExcellence{
	background-color: #fff;
}
footer .ftrBnrArea #CDSWIDCOE{
	position: relative;
	z-index: 1;
	width: 100%;
	margin: 0;
}
footer .ftrBnrArea .widCOETitle{
	margin: 8px 0 0;
	font-size: 85.7%;
	text-align: center;
	font-weight: bold;
}
footer .ftrBnrArea .widCOEDate{
	margin: 0 10px;
	text-align: center;
	background: url(../images/ta_bdr.gif) repeat-x 0 center;
}
footer .ftrBnrArea .widCOEDateText{
	background-color: #fff;
	padding: 0 5px;
	font-size: 78.5%;
}
footer .ftrBnrArea .widCOELogo{
	margin: 0;
}
footer .ftrBnrArea .widCOELink{
	background-color: #599642;
	text-align: center;
	padding: 5px 0 10px;
}
footer .ftrBnrArea .widCOELink a{
	color: #fff;
	text-decoration: underline;
}
footer .ftrBnrArea .widCOELink a:hover{
	color: #fff!important;
}
footer .ftrBnrArea .ftrBnrR{
	width: 52.6%;
	float: right;
}
.kph_tama footer .ftrBnrArea .ftrBnrR,
.kph_hachioji footer .ftrBnrArea .ftrBnrR{
	width: 100%;
	float: none;
}
footer .ftrBnrArea .ftrBnrR .fb{
	width: 26%;
	float: left;
}
footer .ftrBnrArea .ftrBnrR .insta{
	width: 26%;
	float: left;
	margin-left: 10px;
}
footer .ftrBnrArea .ftrBnrR .yt{
	width: 26%;
	float: left;
	margin-left: 10px;
}
footer .ftrBnrArea .ftrBnrR .youtube{
	width: 67%;
	float: right;
}
footer .ftrContact{
	padding: 20px 25px;
}
footer .ftrContact p{
	color: #fff;
	font-size: 71.4%;
}
footer .ftrContact .ftrConTit{
	font-size: 107%;
	color: #b8a075;
}
footer .ftrContact .ftrConName{
	font-size: 114%;
	margin-bottom: 10px;
}
footer .ftrContact a{
	color: #fff;
}
footer .ftrContact div{
	margin-bottom: 12px;
}
footer .ftrContact .ftrConL{
	width: 50%;
	float: left;
}
footer .ftrContact .ftrConR{
	width: 50%;
	float: right;
}
footer .ftrContact .sitemap{
	display: block;
	text-align: center;
	padding: 15px;
	border: 1px solid #fff;
	font-size: 107%;
}
footer .ftrContact .sitemap span{
	position: relative;
}
footer .ftrContact .sitemap span::before{
	content: "";
	position: absolute;
	left: -20px;
	top: 4px;
	width: 0;
	height: 0;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid #fff;
}
footer .goTopBtn {
	display: block;
	background-color: #111;
	padding: 10px 0;
	text-align: center;
}
footer .goTopBtn span{
	display: inline-block;
	width: 27px;
}
footer .cprAreaInner{
	background-color: #a1834c;
	padding: 14px 15px;
	text-align: center;
}
footer .cprAreaNav{
	margin-bottom: 10px;
}
footer .cprAreaNav li{
	font-size: 71.4%;
	display: inline-block;
	border-left: 1px solid #fff;
	padding: 1px 9px;
}
footer .cprAreaNav li:last-child{
	border-right: 1px solid #fff;
}
footer .cprAreaNav li a{
	color: #fff;
}
footer .cprAreaInner li a:hover{
	color: #fff!important;
}
footer .cprAreaInner p{
	color: #fff;
	font-size: 57.14%;
}