@charset "utf-8";
/*=============================================================
 module Layout
=============================================================*/

/* products/residential/index.html
-------------------------------------------------------------*/
#page-body #title-area{
	position:relative;
	width:970px;
	height:210px;
	text-align:left;
	top:0;
	left:0px;
}
#page-body #category-title a{ display:block; width:970px; height:210px; }
#page-body #category-title #ss01 a{ background:url(../images/top_title01.jpg); }
#page-body #category-title #ss02 a{ background:url(../images/top_title02.jpg); }
#page-body #category-title #ss03 a{ background:url(../images/top_title03.jpg); }
#page-body #category-title #ss01 a:hover{ background:url(../images/top_title01_on.jpg); }
#page-body #category-title #ss02 a:hover{ background:url(../images/top_title02_on.jpg); }
#page-body #category-title #ss03 a:hover{ background:url(../images/top_title03_on.jpg); }
#page-body #category-title #ss04{ display:block; width:970px; height:210px; background:url(../images/top_title04.jpg);}
#page-body #category-title img { display:none; }
@media print{}

#page-body #title-area #category-title{
	width:970px;
	height:210px;
	overflow:hidden;
}
#page-body #title-area #category-title span{
	display:none;
	position:absolute;
	top:0;
	left:0;
	z-index:9;
}

/* list-link */
#contents ul.list-link li{
	margin-bottom:3px;
}

/* clearfix */
.cFix:after {
	content: "";
	clear: both;
	display: block;
}

/* main_visual */
.main_visual {
	background:#669cdb url(../images/mainvis_bg.jpg) center center no-repeat;
}
.main_visual .main_visual-body {
	padding: 20px 10px;
}
.main_visual .main_visual-body .main_title {
	margin-bottom: 15px;
}
.main_visual .main_visual-body .main_unit_box a {
	display: block;
	width: 1000px;
	height: 328px;
	background: url(../images/mainvis_jyutaku.jpg) top center no-repeat;
}
.main_visual .main_visual-body .main_unit_box a:hover {
	background-position: center bottom;
}
.main_visual .main_visual-body .main_unit_box a img {
	display: none;
}
/* main_visual */

/*anchor*/
.res_anc {
	width: 660px;
	padding: 15px 15px 5px;
	background-color: #f5f5f5;
	margin-bottom: 60px;
}
.res_anc ul li {
	width: 150px;
	float: left;
	margin: 0 10px 10px 0;
	text-align: center;
	text-decoration: none;
	display: table;
}
.res_anc ul li:nth-child(4n) {
	margin-right: 0;
}
.res_anc ul li a {
	width: 150px;
	font-size: 16px;
	background: #fff url(/img/meteocontrol/ank_arrow_down.jpg) center bottom 8px no-repeat;
	border: 1px solid #b4b4b4;
	vertical-align: middle;
	padding: 10px 0 20px;
	line-height: 17px;
	display: table-cell;
}
.fixed{
	position: fixed;
	top: 0;
	z-index: 10;
}
/*anchor*/

#residential p{
	line-height: 22px;
}

.fl_box .left_box{
	width: 214px;
}
.fl_box .right_box{
	width: 416px;
}

#residential {
	margin-top: 60px;
}

.new {
    margin-left: 16px;
    display: inline-block;
    color: #F00;
}

.color_red .new {
    margin: 0 10px 0 0;
}


/*============================
#セクション共通
============================*/
.un_resBlk { margin-bottom: 50px; }
.un_res_title { line-height: 1.38; padding-bottom: 12px; margin-bottom: 18px; }
.un_resCont { display: flex; margin-bottom: 20px; }
.un_resCont_title { font-size: 20px; font-weight: bold; line-height: 1.2; margin-bottom: 10px; }
.un_text_box { width: 415px; margin-right: 31px; }
.un_img_box { width: 214px; }
.un_text_box_link { line-height: 1.57; }

/*============================
#Res-top
============================*/
#Res-top{
	margin-bottom: 60px;
}
.top-text{
	padding-top: 0px;
	line-height: 22px;
}

/*============================
#Res-product
============================*/
#Res-product .residential_section_group { margin-bottom: 40px; }
#Res-product .un_resCont_subTitle { line-height: 22px; border-left: solid 20px #eb1e23; padding-left: 30px; }
#Res-product .un_resCont_subTitle .sub_ttl { display: block; float: none; font-size: 13px; font-weight: normal; }

/*============================
#Res-module
============================*/
#Res-module{
	margin-bottom: 60px;
}
.module-con01{
	margin-bottom: 30px;
}
.icon_submission{
	padding: 10px;
	margin-right: 12px;
	background: #eb1e23;
	color: #fff;
	font-size: 16px;
	font-weight: normal;
}
.border_box-txt{
	margin-bottom:20px;
}
.orange_box .fl_box .left_box{
	margin-right: 20px;
}
.orange_box .fl_box .right_box{
	width: 300px;
}
/* 20180920 */
.un_flex_reverse { display: flex; flex-direction: row-reverse; }
.un_flex_reverse .un_img_box { width: 214px; }
.un_flex_reverse .un_text_box { width: 344px; margin-right: 20px; }
.frame-ttl{
	font-size: 14px;
}
.suncri-txt01{
	margin-bottom:20px;
}
.res-link{
	padding-top:5px;
}


#Res-module .border_box-ttl.module_ttl {
	position: relative;
}


#Res-module .sp_layout.sub_ttl {
	font-size: 14px;
	font-weight: normal;
	position: absolute;
	top: -6px;
	left: 70px;
}

#Res-module .sp_layout {
	position: absolute;
	top: 8px;
	left: 70px;
}

/*============================
#Res-system
============================*/
#Res-system{
	margin-bottom: 60px;
}
.sys_cont{
	margin-bottom: 40px;
}
.sys_cont-ttl{
	margin-bottom: 10px;
	font-size: 20px;
	font-weight: bold;
}
.sys_cont-text{
	margin-bottom: 10px;
}

/*============================
#Res-assurance
============================*/
#Res-assurance{
	margin-bottom: 60px;
}
.ass_cont{
	margin-bottom: 15px;
}
.ass_cont-ttl{
	margin-bottom: 10px;
	font-size: 20px;
	font-weight: bold;
}
.ass_cont-text{
	margin-bottom: 10px;
}

/*============================
#Res-flow
============================*/
#Res-flow{
	margin-bottom: 60px;
}
.flow_cont-text{
	margin-bottom: 20px;
}

/*============================
#Res-case
============================*/
#Res-case{
	margin-bottom: 60px;
}
.res_txt{
	margin-bottom:25px;
}
.case_left_box{
	float: left;
	margin-right: 20px;
}
.case_right_box{
	float: left;
}
.case_img{
	margin-bottom: 5px;
}

/*============================
#Res-know
============================*/
#Res-know{
	margin-bottom: 60px;
}
.know_cont-text{
	margin-bottom:10px;
}

/*============================
#Res-faq
============================*/
#Res-faq{
	margin-bottom: 60px;
}
.faq_cont-text{
	margin-bottom: 10px;
}

/*============================
#Res-base
============================*/
#Res-base{
	margin-bottom: 120px;
}
.base_cont-ttl{
		margin-bottom: 15px;
	font-size: 20px;
	font-weight: bold;
}
.base_cont-text{
	margin-bottom: 10px;
}

.hp_mt30 {
	margin-top: 30px;
}

@media only screen and (max-width: 39.9375em) {

	.container{
		padding: 0 10px;
	}

	.main_visual{
		background: #e1e1e1;
	}
	.main_visual .main_visual-body{
		padding: 15px 10px;
	}
	.main_visual .main_visual-body .main_unit_box a {
		width: 100%;
		height: auto;
		background: none;
	}
	.main_visual .main_visual-body .main_unit_box a img{
		display: none;
	}
	.main_visual .main_visual-body .main_title{
		margin-bottom: 0;
		color: #333;
	}

/*anchor*/
	.anclink_area{
		display: none;
	}
	.un_anclink.anclink_area { display: block; }
	.res_anc {
		width: 100%;
		margin-bottom: 40px;
		padding: 0;
		background: none;
		border-left: 1px solid #b4b4b4;
		border-top: 1px solid #b4b4b4;
	}
	.res_anc.un_anclink_inner { margin-bottom: 15px; }
	.res_anc ul li {
		width: 50%;
		margin: 0;
		text-align: left;
		vertical-align: middle;
		border-right: 1px solid #b4b4b4;
		border-bottom: 1px solid #b4b4b4;
		display: table;
	}
	.res_anc ul li a {
		width: 50%;
		font-size: 13px;
		background: #fff url(/img/meteocontrol/ank_arrow_down.jpg) right 5px center no-repeat;
		border: none;
		line-height: 16px;
		padding: 0 20px 0 10px;
		height: 40px;
	}
	.res_anc ul li a.ank_br {
		line-height: 22px;
	}
	.fixed {
		left: 0;
		width: 100%;
		z-index: 100000;
	}
	.un_anclink_inner.fixed { left: 10px; width: calc(100% - 20px); margin-bottom: 15px; }

/*anchor*/

	#residential{
		margin-top: 30px;
	}
	#residential.un_containt_inner { margin-top: 15px; }
	#residential p,#residential a{
		font-size: 12px;
		line-height: 15px;
	}

	.fl_box .left_box{
		width: 27%;
	}
	.fl_box .right_box{
		width: 70%;
	}

	/*============================
	#セクション共通
	============================*/
	.un_resBlk { margin-bottom: 25px; }
	.un_res_title { line-height: 1.25; padding-bottom: 6px; margin-bottom: 10px; }
	.un_resCont { margin-bottom: 15px; }
	.un_resCont_title { font-size: 16px; line-height: 1; margin-bottom: 10px; }
	.un_text_box { width: 69.014%; margin-right: 2.816%; }
	.un_img_box { width: 28.169%; }
	.un_text_box_link { line-height: 1.25; }

	/*============================
	#Res-top
	============================*/
	#Res-top{
		margin-bottom: 30px;
	}
	.top-pic{
		margin-bottom: 15px;
	}
	#Res-top .fl_box .left_box{
		width: 100%;
	}
	#Res-top .fl_box .right_box{
		width: 100%;
	}

	/*============================
	#Res-product
	============================*/
	#Res-product .residential_section_group { margin-bottom: 20px; }
	#Res-product .un_resCont_subTitle { line-height: 20px; border-left: solid 15px #eb1e23; padding-left: 20px; }
	#Res-product .un_resCont_subTitle .sub_ttl { font-size: 12px; }

	/*============================
	#Res-module
	============================*/
	#Res-module{
		margin-bottom: 40px;
	}
	.module-con01{
		margin-bottom: 20px;
	}
	.border_box-ttl{
	line-height:24px;
	margin-bottom:10px;
	}
	.icon_submission{
		padding: 0px 3px;
		margin-right: 3%;
		display: block;
		float: left;
		width: 17%;
		text-align: center;
	}
	.sp_layout{
		float: left;
		width: 80%;;
	}
	.border_box-txt{
		margin-bottom:12px;
	}
	.border_box-txt p{
		line-height:15px;
	}
	.orange_box .fl_box .left_box{
		width: 100%;
		margin-right: 0;
		margin-bottom: 15px;
	}
	.orange_box .fl_box .right_box{
		width: 100%;
	}

	/* 20180920 */
	.un_flex_reverse { display: block; flex-direction: row; }
	.un_flex_reverse .un_img_box { width: 100%; margin-bottom: 15px; }
	.un_flex_reverse .un_text_box { width: 100%; margin-right: 0; }

	.suncri-txt01{
		margin-bottom:0px;
	}
	.res-link{
		font-size: 12px;
		text-align: right;
	}

	#Res-module .sp_layout.sub_ttl {
	font-size: 12px;
	top: -32%;
	left: 19%;
	}

	#Res-module .sp_layout {
	top: 28%;
	left: 19%;
	}



	/*============================
	#Res-system
	============================*/
	#Res-system{
		margin-bottom: 40px;
	}
	.sys_cont{
		margin-bottom: 20px;
		border-bottom: 1px dotted #b4b4b4;
		padding-bottom: 15px;
	}
	.sys_cont:last-child{
		margin-bottom: 0px;
		border-bottom: none;
		padding-bottom: 0;
	}
	.sys_cont-ttl{
		margin-bottom: 10px;
		font-size: 16px;
		line-height: 16px;
	}
	.sys_cont-text{
		margin-bottom: 5px;
	}

	/*============================
	#Res-assurance
	============================*/
	#Res-assurance{
		margin-bottom: 40px;
	}
	.ass_cont-ttl{
		font-size: 16px;
		line-height: 18px;
	}
	.ass_cont-text{
		margin-bottom: 5px;
	}
	.ass_cont-link{
	line-height:18px;
	}

	/*============================
	#Res-flow
	============================*/
	#Res-flow{
		margin-bottom: 40px;
	}
	.flow_cont-text{
		margin-bottom: 5px;
	}

	/*============================
	#Res-case
	============================*/
	#Res-case{
		margin-bottom: 40px;
	}
	.res_txt{
		margin-bottom:15px;
	}
	.case_left_box{
		float: none;
		margin-right: 0px;
		margin-bottom: 15px;
	}
	.case_right_box{
		float: none;
	}

	/*============================
	#Res-know
	============================*/
	#Res-know{
		margin-bottom: 40px;
	}
	.know_cont-text{
		margin-bottom: 5px;
	}

	/*============================
	#Res-faq
	============================*/
	#Res-faq{
		margin-bottom: 40px;
	}
	.faq_cont-text{
		margin-bottom: 5px;
	}

	/*============================
	#Res-base
	============================*/
	#Res-base{
		margin-bottom: 60px;
	}
	.base_cont-ttl{
		margin-bottom: 10px;
		font-size: 16px;
		line-height: 18px;
	}
	.base_cont-text{
		margin-bottom: 5px;
	}

}
