@charset "utf-8";
/*
 * CSS oteire.css
 */

/* ---------------------------------------
	main_title
--------------------------------------- */
.main_title{
	background: #73C7F5;
}
.main_title .m_tit{
	background: #73C7F5;
}


/* ---------------------------------------
	section
--------------------------------------- */
.section_type{
	overflow: hidden;
	border: 2px solid #C3BDB6;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-bottom: 60px;
}
.section_type2{
	overflow: hidden;
	/* border: 2px solid #C3BDB6; */
	background-color: #f6f2ef;
	border-radius: 0 0 10px 10px;
	margin-bottom: 60px;
}
.section_type2_title{
	background-color: #f6f2ef;
	border-radius: 10px 10px 0 0 ;

	text-align: center;
	padding: 20px;
	margin-bottom: 2px;
}
.section_type2_title:before{
	content: '';
	display: inline-block;
	width: 19px;
	height: 17px;
	background: url(../img/oteire/ico_notice.png)no-repeat center / contain;
	margin-right: 10px;
	position: relative;
	top: 1px;
}
.section_type2_title span{
	position: relative;
	display: inline-block;
	font-size: 1.3em;
	font-weight: bold;
	color: #5a463f;
	line-height: 1;
	margin-right: 20px;
}
@media screen and (max-width: 767px) {
	.section_type2{
		border: 2px solid #C3BDB6;
	}
	.section_type2_title{
		display: none;
	}
}




#cnt_main{ width: 714px; float: left; }
#aside{ width: 221px; float: right; margin-bottom: 30px; }
@media screen and (max-width: 767px) {
	#cnt_main{ width: 100%; float: none; margin-bottom: 20px; }
	#aside{ width: 100%; float: none; }
}




#sec_1{ margin-bottom: 20px; }
#sec_1 .table_box{ display: table; width: 100%; }
#sec_1 .table_box dl{ display: table-row; }
#sec_1 .table_box dt,
#sec_1 .table_box dd{ display: table-cell; }
#sec_1 .table_box dt{
	width: 170px;
	padding: 20px 15px;
	text-align: center;
	vertical-align: middle;
	border-radius: 10px;
	background: #FFE4ED;
	position: relative;
	box-sizing: content-box;
}
#sec_1 .table_box dt:after{
	content: "";
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	top: 50%; right: -28px;
	margin-top: -10px;
	border: 10px solid transparent;
	border-left: 20px solid #000;
}
#sec_1 .table_box dt .cat_name{
	font-size: .9em;
	margin: 5px 0;
	font-weight: bold;
}
#sec_1 .table_box dt .tit_name{
	font-size: 1.2em;
	font-weight: bold;
}
#sec_1 .table_box dd{
	vertical-align: middle;
	padding: 0 30px;
}
#sec_1 .table_box dd p{
	display: inline;
	font-size: 1.4em;
	font-weight: bold;
}



#sec_1 .table_box.ws-room dt{ background: #FFE4ED; }
#sec_1 .table_box.ws-room dt:after{ border-left-color: #FFE4ED; }
#sec_1 .table_box.ws-room dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #FFE4ED 55%); }

#sec_1 .table_box.kitchen dt{ background: #FFE8D4; }
#sec_1 .table_box.kitchen dt:after{ border-left-color: #FFE8D4; }
#sec_1 .table_box.kitchen dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #FFE8D4 55%); }

#sec_1 .table_box.bath dt{ background: #C3E7FB; }
#sec_1 .table_box.bath dt:after{ border-left-color: #C3E7FB; }
#sec_1 .table_box.bath dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #C3E7FB 55%); }

#sec_1 .table_box.toilet dt{ background: #D6EFCA; }
#sec_1 .table_box.toilet dt:after{ border-left-color: #D6EFCA; }
#sec_1 .table_box.toilet dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #D6EFCA 55%); }
#sec_1 .table_box.door dt{ background: #FFC592; }
#sec_1 .table_box.door dt:after{ border-left-color: #FFC592; }
#sec_1 .table_box.door dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #FFC592 55%); }

#sec_1 .table_box.j-room dt{ background: #E0BDDB; }
#sec_1 .table_box.j-room dt:after{ border-left-color: #E0BDDB; }
#sec_1 .table_box.j-room dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #E0BDDB 55%); }

#sec_1 .table_box.equipment dt{ background: #73C7F5; }
#sec_1 .table_box.equipment dt:after{ border-left-color: #73C7F5; }
#sec_1 .table_box.equipment dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #73C7F5 55%); }

#sec_1 .table_box.outside dt{ background: #FFBAD4; }
#sec_1 .table_box.outside dt:after{ border-left-color: #FFBAD4; }
#sec_1 .table_box.outside dd p{ background: linear-gradient(rgba(255,255,255,0) 50%, #FFBAD4 55%); }


@media screen and (max-width: 767px) {
	#sec_1{ margin-bottom: 30px; }
	#sec_1 .table_box,
	#sec_1 .table_box dl,
	#sec_1 .table_box dt,
	#sec_1 .table_box dd{
		display: block;
		width: 100%;
		box-sizing: border-box;
	}
	#sec_1 .table_box dt{
		padding: 10px 15px;
		margin-bottom: 30px;
	}
	#sec_1 .table_box dt:after{
		top: auto; right: 50%;
		bottom: -28px;
		margin: 0 -10px 0 0;
		border: 10px solid transparent;
		border-left: 10px solid transparent;
		border-top: 20px solid #000;
	}
	#sec_1 .table_box dt:after{ border-left-color: transparent !important; }
	#sec_1 .table_box.ws-room dt:after{ border-top-color: #FFE4ED; }
	#sec_1 .table_box.kitchen dt:after{ border-top-color: #FFE8D4; }
	#sec_1 .table_box.bath dt:after{ border-top-color: #C3E7FB; }
	#sec_1 .table_box.toilet dt:after{ border-top-color: #D6EFCA; }
	#sec_1 .table_box.door dt:after{ border-top-color: #FFC592; }
	#sec_1 .table_box.j-room dt:after{ border-top-color: #E0BDDB; }
	#sec_1 .table_box.equipment dt:after{ border-top-color: #73C7F5; }
	#sec_1 .table_box.outside dt:after{ border-top-color: #FFBAD4; }
	#sec_1 .table_box dt .cat_name{
		margin: 3px 0;
	}
	#sec_1 .table_box dd{
		text-align: center!important;
	}
}


#sec_2 .tab_nav ul{
	/*text-align: center;*/
	position: relative;
	bottom: -2px;
}
#sec_2 .tab_nav ul li{
	color: #ACA29E;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	float: left;
	width: 26%;
	margin: 0 12px;
	padding: 0 12px 0;
	border-radius: 10px 10px 0 0;
	border: 2px solid #CCC6BF;
	border-bottom: none;
	background: #EBE8E2;
	box-sizing: content-box;
}
#sec_2 .tab_nav ul li.-maintenance{
	position: relative;
}
#sec_2 .tab_nav ul li.-maintenance:before{
	content: 'こんなときに！';
	display: inline-block;
	padding: 6px 15px;
	background: #74c6f6;
	color: #fff;
	position: absolute;
	z-index: 2;
	top: -20px;
	left: 10px;
	line-height: 1;
	font-size: 13px;
}
#sec_2 .tab_nav ul li.-maintenance:after{
	content: '';
	display: inline-block;
	width: 1px;
	height: 1px;
	position: absolute;
	z-index: 1;
	top: -5px;
	left: 20px;
	border-right: 0px solid transparent;
  border-top: 20px solid #74c6f6;
  border-left: 20px solid transparent; 
}

#sec_2 .tab_nav ul li>span{
	font-weight: bold;
	padding: 6px 0 8px;
	display: block;
	border-bottom: 1px solid #C4BEB7;
}
#sec_2 .tab_nav ul li.is-active,
#sec_2 .tab_nav ul li:hover{
	color: #58463D;
	background: #FFF;
	cursor: pointer;
}
#sec_2 .acd_btn{ display: none; }
#sec_2 .tab_cnt{ padding: 30px; }

#sec_2 .tab_cnt .box .box_tit{
	font-size: 1.3em;
	padding-bottom: 5px;
	font-weight: bold;
	text-align: center;
	border-bottom: 1px solid #CCC6BF;
}
#sec_2 .tab_cnt .box .arrow{
	line-height: 0;
	text-align: center;
	margin-bottom: 30px;
}
#sec_2 .tab_cnt .box{
	margin-top: 50px;
}
#sec_2 .tab_cnt .box:first-child{
	margin-top: 0;
}
#sec_2 .tab_cnt .box .inbox{
	margin-bottom: 20px;
	margin-right: -20px;
}
#sec_2 .tab_cnt .box .cnt_box{
	width: 315px;
	float: left;
}
#sec_2 .tab_cnt .box .img_box{
	width: 315px;
	float: left;
	text-align: center;
}
#sec_2 .tab_cnt .box .box_in{
	margin-right: 20px;
}
/*#sec_2 .tab_cnt .inbox_wrap .box_in{ width: 100%;}*/
/*#sec_2 .tab_cnt .inbox_wrap .cnt_txt{ width: 100%; }*/
#sec_2 .tab_cnt .raisapo_box{ margin-top: 20px; }
#sec_2 .tab_cnt .raisapo_box_l{ float: left; width: 48%; text-align: center; }
#sec_2 .tab_cnt .raisapo_box_r{ float: right; width: 48%; }
#sec_2 .tab_cnt .raisapo_box .p_name{
	font-size: 1.15em;
	font-weight: bold;
	margin-bottom: 5px;
}
#sec_2 .tab_cnt .raisapo_box .p_cap{
	margin-bottom: 5px;
}
#sec_2 .tab_cnt .w100{ width: 100%!important; margin-right: 0!important; }
#sec_2 .tab_cnt .inbox_wrap .inbox:after{ clear: none; }
#sec_2 .tab_cnt .box .table_box{
	display: table;
	width: 100%;
	height: 60px;
	margin: 10px 0;
}
#sec_2 .tab_cnt .box .table_box dl{ display: table-row; }
#sec_2 .tab_cnt .box .table_box dt,
#sec_2 .tab_cnt .box .table_box dd{
	display: table-cell;
	vertical-align: middle;
}
#sec_2 .tab_cnt .box .table_box dt{
	font-size: .9em;
	font-weight: bold;
	width: 100px;
	text-align: center;
	background: #EBE8E2;
	border-right: 5px solid #FFF;
	border-radius: 8px 0 0 8px;
	box-sizing: content-box;
}
#sec_2 .tab_cnt .box .table_box dd{
	text-align: left;
	background: #F5F3F0;
	padding: 4px 15px;
	font-weight: bold;
	border-radius: 0 8px 8px 0;

}

@media screen and (max-width: 767px) {
	.section_type{ margin-bottom: -4px; }
	#sec_2 .tab_nav{ display: none; }
	#sec_2 .acd_btn{
		display: block;
		color: #ACA29E;
		font-size: 1.2em;
		font-weight: bold;
		text-align: center;
		display: inline-block;
		width: 100%;
		padding: 6px 0 10px;
		margin: 20px 0 0;
		border-radius: 10px;
		border: 2px solid #CCC6BF;
		box-sizing: border-box;
		background: #EBE8E2 url(../img/oteire/nav_open.png) no-repeat 96% center;
		background-size: 18px;
	}
	#sec_2 .acd_btn#notice.is-active{
		background-color: #f6f2ef;
	}
	#sec_2 .acd_btn#maintenance{
		position: relative;
	}

	#sec_2 .acd_btn#maintenance:before{
		content: 'こんなときに！';
		display: inline-block;
		padding: 4px 8px 5px;
		background: #74c6f6;
		color: #fff;
		position: absolute;
		z-index: 2;
		top: -10px;
		left: 10px;
		line-height: 1;
		font-size: 12px;
	}
	#sec_2 .acd_btn#maintenance:after{
		content: '';
		display: inline-block;
		width: 1px;
		height: 1px;
		position: absolute;
		z-index: 1;
		top: -5px;
		left: 10px;
		border-right: 0px solid transparent;
		border-top: 20px solid #74c6f6;
		border-left: 20px solid transparent; 
	}
	#sec_2 .tab_nav:first-child+.acd_btn{ margin-top: 0; }
	#sec_2 .acd_btn.is-active{
		color: #58463D;
		cursor: pointer;
		border-bottom: 1px solid #C4BEB7;
		border-radius: 10px 10px 0 0;
		background: #FFF url(../img/oteire/nav_close.png) no-repeat 96% center;
		background-size: 18px;
	}
	#sec_2 .tab_cnt{
		padding: 15px;
		-webkit-border-radius: 0 0 10px 10px;
		border-radius: 0 0 10px 10px;
		border-top: none;
	}
	#sec_2 .tab_cnt .box .inbox{ margin-bottom: 10px; margin-right: 0; }
	#sec_2 .tab_cnt .box .img_box{
		width: 100%;
		float: none;
		text-align: center;
		margin-bottom: 10px;
	}
	#sec_2 .tab_cnt .box .cnt_box,
	#sec_2 .tab_cnt .inbox_wrap .cnt_txt{
		width: 100%;
		float: none;
	}
	#sec_2 .tab_cnt .box .table_box{
		height: 40px;
		margin: 4px 0;
	}
	#sec_2 .tab_cnt .box .table_box dt{
		width: 80px;
		border-right: 3px solid #FFF;
	}
	#sec_2 .tab_cnt .raisapo_box_l{ float: left; width: 38%; }
	#sec_2 .tab_cnt .raisapo_box_r{ float: right; width: 58%; }
}




#aside .side_txt1{
	padding: 10px;
	font-weight: bold;
	text-align: center;
	background: #C3E7FB;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#aside .arrow_down{
	line-height: 0;
	margin-bottom: 5px;
	text-align: center;
}
#aside .side_box1{
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: 2px solid #CCC6BF;
	margin: 0 0 20px;
}
#aside .side_box1 h3{
	font-size: 1.3em;
	font-weight: bold;
	text-align: center;
	padding: 5px;
	background: #CCC6BF;
}
#aside .side_box1 ul{ padding: 20px 20px; }
#aside .side_box1 ul li{ padding: 3px 0; }
#aside .side_box1 ul li a{text-decoration: none; }
#aside .side_box1 ul li.current{ font-weight: bold; }
#aside .side_box2{
	background: #F5F3F0;
	border-top: 2px solid #5A463F;
	border-bottom: 2px solid #5A463F;
}
#aside .side_box2 h3{
	text-align: center;
	font-weight: bold;
	margin-bottom: 15px;
	padding-bottom: 5px;
	border-bottom: 1px solid #CCC6BF;
}
#aside .side_box2 .box_in{ padding: 10px 15px 20px 15px; }
#aside .side_box2 .side_img1{ text-align: center; }
#aside .side_box2 .side_img1 img{ max-width: 130px; }

@media screen and (max-width: 767px){
	#aside .side_box1 ul{ padding: 0 0; }
	#aside .side_box1 ul li{
		float: left;
		width: 50%;
		padding: 5px;
		box-sizing: border-box;
		border-right: 1px solid #C4BEB7;
		border-top: 1px solid #C4BEB7;
	}
	#aside .side_box1 ul li:nth-child(2n){ border-right: none; }
}