@charset "utf-8";

/* CSS上書き */
.copy{
	margin-top:0;
}

.center { text-align: center; }
.mtb30 { margin: 30px 0; }

/* ==================================================================
	New Infomation お知らせ
================================================================== */
.box_content{
	width:1024px;
	margin:0 auto;
}


/*リード文*/
.lead_text{
	text-align:center;
	margin:calc( 60 / 860 * 100%) 0 0;
	font-weight:bold;
	}

.tab_area{
	background:#f9f9f3;
	margin-top:calc( 64 / 980 * 100%);
}

.tab_area ul{
	background:#fff;
	border-bottom:4px solid #5b4523;
	/* flex */
	display:flex;
	justify-content:space-between;
}

.tab_area li{
	width:calc( 320 / 980 * 100%);
	border:1px solid #5b4523;
	border-bottom:none;
	/* flex */
	display:flex;
	justify-content:center;
	padding:calc( 10 / 980 * 100%) 0;
	font-weight:bold;
}

.tab_area li{
	cursor :pointer;
}

.tab_area .select{
	background:#5b4523;
	color:#fff;
}

/* ==================================================================
	Room Schedule
================================================================== */
.section_schedule{
	background:#f9f9f3;
	padding-bottom:calc( 90 / 996 * 100%);
}

.section_schedule h2{
	text-align:center;
	font-size:1.5555555555rem;
	padding-top:calc( 30 / 980 * 100%);
}

.day_link{
	width:calc( 300 / 980 * 100%);
	margin:calc( 40 / 980 * 100%) auto 0;
	/* flex */
	display:flex;
	justify-content:space-between;
}

.day_link li:nth-of-type(2){
	font-weight:bold;
}

.day_link li a{
	text-decoration:underline;
	color:#5b4523;
}

.day_link li a:hover{
	text-decoration:none;
}

.room_info{
	width: calc( 910 / 980 * 100%);
	margin: calc( 30 / 910 * 100%) auto 0;
}
.room_info ul{
	margin: calc( 30 / 910 * 100%) auto 1em;
	color: #555;
}
.room_info ul li:nth-child(3),
.room_info ul li:nth-child(4){
	padding-left: 1em;
}
.room_info ul li:nth-child(4){
	padding-top: .5em;
}
.room_info ul li h3{
	border-bottom: 1px solid #5B4526;
	color:#5B4526;
	font-size: 1.3rem;
}
.room_info ul li h3 span{
	font-size: .9rem;
	font-weight: normal;
	color:green;
}

/* 表：共通
------------------------------------------------------------------- */
[class$="_table"]{
	border:1px solid #5b4523;
	background:#fff;
}

[class$="_table"] td{
	border:1px solid #5b4523;
	height:100px;
}

[class$="_table"]{
	border:1px solid #5b4523;
	background:#fff;
}

/* カレンダー
------------------------------------------------------------------- */
/*
.calendar_table{
	width:calc( 910 / 980 * 100%);
	margin:calc( 30 / 910 * 100%) auto 0;
}
.calendar_table th{
	border:1px solid #5b4523;
	width:calc( 130 / 910 * 100%);
	text-align:center;
	background:#5b4523;
	color:#fff;
}
.calendar_table td{
	border:1px solid #5b4523;
	height:100px;
}
.calendar_table td span{
	display:block;
	width:100%;
	text-align:center;
}
.calendar_table td p{
	padding:5px;
	font-size:66.6666666666%;
	font-weight:bold;
}
*/
.section_schedule #gcalendar{
	position:relative;
	width:calc( 910 / 980 * 100%);
	height:0;
	margin:calc( 30 / 910 * 100%) auto 0;
	padding-top:75%;
}
.section_schedule #gcalendar iframe{
	position:absolute;
	top:0;
	width:100%;
	height:100%;
}

#calinfo {
	display: table;
	margin: 10px auto 0;
	color: #fff;
	text-align: center;
}
#calinfo .room-am,
#calinfo .room-pm {
	padding: 0 1em;
	border-radius: 5px;
}
#calinfo .room-am {
	margin-bottom: 5px;
	background: #C3A785;
}
#calinfo .room-pm {
	background: #8F4D1D;
}


/* 仮予約・お問い合わせはこちら */
.btn_contact{
	width:calc( 650 / 980 * 100%);
	margin:calc( 65 / 980 * 100%) auto 0;
}
.btn_contact a{
	width:calc( 650 / 980 * 100%);
	margin:calc( 65 / 980 * 100%) auto 0;
	padding:calc( 20 / 650 * 100%) 0;
	/* flex */
	display:flex;
	justify-content:center;
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	background:#5b4523;
	transition:all 0.2s ease;
	border:1px solid #5b4523;
}
.btn_contact a > span{
	width:calc( 650 / 980 * 100%);
	color:#fff;
	font-weight:bold;
}
.btn_contact a:hover{background:#ecd0b5;}
.btn_contact a:hover > span{color:#f8f7f2;}

/* 料金表
------------------------------------------------------------------- */
.box_content_price{
	width:calc( 860 / 996 * 100%);
	margin:0 auto;
}

.price_table{
	width:100%;
}

.price_table td{
	width:calc( 160 / 860 * 100%);
	text-align:center;
	vertical-align:middle;
}

.price_table td div{
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
}

.price_table .first_sell{
	width:calc( 210 / 860 * 100%);
}

.attention{
	padding-top:1rem;
}

/* 備品・設備について */
.box_equipment{
	background:#fff;
	margin-top:calc( 30 / 860 * 100%);
	padding:calc( 34 / 860 * 100%) calc( 20 / 860 * 100%) calc( 45 / 860 * 100%);
}

.box_equipment dt{
	font-weight:bold;
}

.box_equipment dd{
	border:1px solid #5b4523;
	margin-top:calc( 16 / 820 * 100%);
	padding:calc( 14 / 860 * 100%) calc( 24 / 860 * 100%);
	font-size:0.88888888rem;
	line-height:2;
}

.section_getting_started{
	margin-top:calc( 60 / 860 * 100%);
}

.section_getting_started ul{
	padding-top:calc( 15 / 860 * 100%);
}

.section_getting_started li{
	margin-top:calc( 15 / 860 * 100%);
	padding-left:1rem;
}

.section_getting_started li span{
	margin-left:-1rem;
}

/* 料金表
------------------------------------------------------------------- */
.box_content_agreement{
	padding:calc( 50 / 860 * 100%) calc( 20 / 860 * 100%) 0;
	/* flex */
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}

.box_content_agreement .branch{
	width:100%;
	/* flex */
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}

.branch li{
	width:calc( 400 / 820 * 100%);
	border-bottom:2px solid #5b4523;
	position:relative;
}

.branch li:after{
	position:absolute;
	top:0;
	bottom:-50px;
	left:0;
	margin:auto 0 auto -10px;
	content:"";
	vertical-align:middle;
	left:50%;
	width:21px;
	height:20px;
	border-top:4px solid #5b4523;
	border-right:4px solid #5b4523;
	-webkit-transform:rotate(135deg);
	transform:rotate(135deg);
}

.branch li a{
	color:#5b4523;
	display:block;
	text-align:center;
}

/* 1日契約の方・定期契約の方：共通
------------------------------------------------------------------- */
[class^="section_agreement"]{
	width:calc( 860 / 966 * 100%);
	margin:calc( 64 / 860 * 100%) auto 0;
}

.flow_item h3{
	text-align:center;
}

.flow_item > dl{
	width:100%;
	padding:calc( 26 / 860 * 100%);
	margin-top:calc( 10 / 860 * 100%);
	border:1px solid #5b4523;
	background:#fff;
	/* flex */
	display:flex;
	justify-content:space-between;
	align-items:flex-start;
}

.section_agreement_day.flow_item > dl:nth-of-type(1){
	margin-top:calc( 20 / 860 * 100%);
}

.flow_item > dl dt{
	width:calc( 234 / 808 * 100%);
	/* flex */
	display:flex;
	justify-content:space-between;
	align-items:center;
}

.flow_item > dl dt figure{
	width:calc( 58 / 234 * 100%);
}

.flow_item > dl dt span{
	width:calc( 160 / 234 * 100%);
	font-weight:bold;
}

.flow_item > dl dd{
	width:calc( 570 / 808 * 100%);
}

.flow_item > dl dd a{
	color:#5b4523;
	text-decoration:underline;
}

.flow_item > dl dd a:hover{
	text-decoration:none;
}


/* 1日契約の方
------------------------------------------------------------------- */
.section_agreement_day .btn_contact,
.section_contract .btn_contact{
	width:calc( 430 / 860 * 100%);
}

.section_agreement_day .btn_contact a,
.section_contract .btn_contact a{
	display:block;
	margin:0 auto;
	width:100%;
	padding:calc( 24 / 430 * 100%) calc( 50 / 430 * 100%);
}

.section_agreement_day .btn_contact span,
.section_contract .btn_contact span{
	width:calc( 327 / 430 * 100%);
	position:relative;
}

.section_agreement_day .btn_contact span:after,
.section_contract .btn_contact span:after{
	content: '';
	position: absolute;
	top: 50%;
	right: -15%;
	width: 14px;
	height: 14px;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg) translate(-50%,-50%);
}

.red_attention{
	color:#b41d23;
	text-align:center;
	margin-top:calc( 24 / 860 * 100%);
	font-weight:bold;
}

.red_attention a{
	color:#b41d23;
	text-decoration:underline;
}

.red_attention ahover{
	color:#b41d23;
	text-decoration:none;
}

.contract_text{
	padding:calc( 30 / 860 * 100%) 0 calc( 10 / 860 * 100%);
}

/* ご利用規約
------------------------------------------------------------------- */
.section_contract{
	width:calc( 860 / 966 * 100%);
	margin:calc( 32 / 860 * 100%) auto 0;
}

.box_contract{
	background:#fff;
	padding:calc( 20 / 860 * 100%);
	font-size:0.88888888888rem;
	max-height:504px;
	overflow:auto;
}

.box_contract dt{
	margin-top:calc( 38 / 840 * 100%);
	font-weight:bold;
}

.box_contract dt:nth-of-type(1){
	margin-top:0;
}

/* タブ用CSS */
.tab{overflow:hidden;}
.content li{background:#eee; padding:20px;}
.hide{display:none;}

/* =====================================================================================================================================================================

　SPデザイン用CSS

===================================================================================================================================================================== */
@media screen and (max-width:768px){
	.box_content{width:100%;}

	.box_content_price{
		width:calc( 690 / 740 * 100%)
	}

	.section_schedule.hide{
	display:block;
	}


/* カレンダー
------------------------------------------------------------------- */
.table_inner{
	width:90%;
	overflow:auto;
	margin:0 auto;
	padding-bottom:2%;
}
.calendar_table{
	width:980px;
	margin:calc( 30 / 910 * 100%) auto 0;
}

.calendar_table th{
	border:1px solid #5b4523;
	width:calc( 130 / 910 * 100%);
	text-align:center;
	background:#5b4523;
	color:#fff;
}

.calendar_table td{
	border:1px solid #5b4523;
	height:100px;
}

.calendar_table td span{
	display:block;
	width:100%;
	text-align:center;
}

.calendar_table td p{
	padding:5px;
	font-size:66.6666666666%;
	font-weight:bold;
}


/* 共通
------------------------------------------------------------------- */
	.table_inner table{
			width:980px;

	}

	[class^="guide_data"]{
		display:block;
		margin-top:calc( 40 / 690 * 100%);
		padding:calc( 80 / 690 * 100%) calc( 30 / 690 * 100%) ;
	}

	[class^="guide_data"] dl{
		width:100%;
	}

	.guide_data01 dt,
	.guide_data01 dd	{
	margin-top:calc( 30 / 630 * 100%);
	}

.box_content_agreement{
}


/* DM作成用の素材のご提供について
------------------------------------------------------------------- */
	.flow_item > dl{
		margin-top:calc( 40 / 860 * 100%);
		display:block;
	}

	.flow_item > dl dt{
		width:calc( 450 / 808 * 100%);
	}

	.flow_item > dl dd{
		margin-top:calc( 20 / 860 * 100%);
		width:100%;
	}

	.floar_plan{
	width:90%;
	}

	.btn_contact a,
	.section_agreement_day .btn_contact,
	.section_contract .btn_contact{
	width:calc( 750 / 980 * 100%);
	}
}