@charset "utf-8";
/**プラスマイリノここから**/
.plmyreno_box{display: flex; align-items: center; padding-bottom: 1em; justify-content: center;}
.plmyreno_box .plmyreno_logo{background-color: #eb6143; display: inline-block; padding: 0.4em 1em;}
.plmyreno_box img.plmyreno_img{height: 1.25em; width: auto; display: block;}
.plmyreno_box .plmyreno_toha{padding-left: 0.5em;}
.plmyreno_box .plmyreno_toha a{ display: inline-block; font-size: 1.1rem; line-height: 1em; border-radius: 50%; border: 1px solid #999; font-weight: bold; color: #999; text-align: center; padding: 0.25em 0.22em;}
#plmyreno-mord{ font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;}
#plmyreno-mord .plmyreno_name{font-size:1.6rem; padding-bottom: 0.5em;}
#plmyreno-mord p{line-height: 1.8em;}

.renocolle_search_pulldowns + .plmyreno_box{padding-bottom: 40px; margin-top: -20px;}
.plmyreno_box .renocolle_search_areas_options{ margin-top: 0; margin-bottom: 0;}
/**プラスマイリノここまで**/

/* ##### 特集用 ##### */
.renocolle_com_tokusyu {
  margin-bottom: 30px;
}
.renocolle_com_tokusyu_ttl {
	font-size: 3.5rem;
	text-align: center;
	margin-bottom: 10px;
}
.renocolle_com_tokusyu_body {
  font-size: 2rem;
  line-height: 1.6em;
}

/*マップから検索*/
.mapArea {
	display: block;
  padding: 30px 15px 15px 15px;
  background: #E8EDED;
}
.mapArea #map {
  max-width: 100%;
  width: 800px;
  height: 590px;
  float:left;
}
p#map_direction {
	display: block;
	position: relative;
	margin: 0;
	padding: 7px;
	color: #aaaaaa;
	border: 1px solid #aaaaaa;
}
#map_info-pc {
  width: 247px;
  height: 590px;
  float: right;
  background: #FFFFFF;
  padding: 8px;
  overflow-y: scroll;
}
#map_info-sp { display: none; }
#map_info-pc .prop_box {
  overflow-y: visible;
}
#map_info-pc .vr-heart {
  margin: 0;
}
#map_info-pc .prop_box .vr_box {
  margin: 0;
}

.mapAreaChanger {
	background: #E8EDED;
	padding-top: 10px;
	margin-bottom: 40px;
}
.mapAreaChanger .st_list {
	padding: 20px 0;
}


.obje_area_box *{ }
.obje_area_name{ font-size: 12px; color: #07C1BE; font-weight: bold; }
.obje_area_item_box{ font-size: 12px; padding-top: 6px; padding-bottom: 6px; }
.obje_area_item_box a{ font-size: 11px; background-color: #06C1BE; color: #FFFFFF; padding-top: 6px; padding-bottom: 6px; padding-left: 12px; padding-right: 12px; display: inline-block; margin-top: 4px; margin-bottom: 4px; }
.st_list{
	letter-spacing: -.4em;
	padding-top: 40px;
	padding-bottom: 40px;
}
.st_list li{
	width: 12.5%;
	display: inline-block;
	letter-spacing: normal;
	vertical-align: top;
	padding-left: 10px;
	padding-right: 10px;
}
.st_list li a{
	padding-top: 4px;
	padding-bottom: 4px;
	display: block;
	text-align: center;
	border-radius: 4px;
	border: 1px solid #000000;
}
.st_list li.nowon a {
	background-color: #000000;
	color: #FFFFFF;
}
.st_list li input[type="button"]{
	width: 100%;
	min-width: auto;
}
.st_list li input[type="button"]#saidaiji{ text-align: left;}


/**エリア別説明エリア**/
#region_char{ padding-top: 3em; float: left; width: 100%;}
.inq_box + #region_char{ padding-top: 8em;}
#region_char h3{
	font-size: 2.4rem;
	font-weight: bold;
	padding-bottom: 0.5em;
}
#region_char h3 small{
	font-size: 60%;
	margin-left: 0.5em;
}
.graph_box{}
.graph_box [class*="colspa_"] li{
	text-align: center;
	margin-bottom: 0px;
	margin-right: 0px;
	}
.graph_box .colspa_04 li{
	width: 25%;
}
.graph_box .colspa_05 li{
	width: 20%;
}
.graph_box [class*="colspa_"] .single-family{
	height: 310px;
	position: relative;
	padding-left: 6px;
	padding-right: 6px;
}
.graph_box [class*="colspa_"] .single-family + .region_name{
	padding-top: 1em;
	padding-bottom: 1em;
}



.graph_box .single_box{
	width: calc(50% - 6px);
	position: absolute;
	left: 6px;
	bottom: 0;
}
.graph_box .single_box:after{
/*	content: "単身";
	display: block;
	padding-top: 0.4em;*/
}
.graph_box .single_box .bar{
	font-size: 10px;
	background-color: #B4B4B4;
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
}
.graph_box .family_box{
	width: calc(50% - 6px);
	bottom: 0;
	right:6px;
	position: absolute;
}
.graph_box .family_box:after{
/*	content: "ファミリー";
	display: block;
	padding-top: 0.4em;*/
}
.graph_box .family_box .bar{
	font-size: 6px;
	background-color: #70BCC0;
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
}
.graph_box .region_price{ font-size: 1.6rem;}
.graph_box .region_price:after{ content:"万円"; font-size: 1.2rem;}
.region_now .single-family{ background-color: #EFEFEF; }
.region_now .region_name{ font-weight: bold;}
.region_now .family_box .bar{/* background-color: #70BCC0;*/}
.region_now .single_box .bar{/* background-color: #A1A1A1;*/}


.graph_samp{ padding-top: 1em; padding-bottom: 1em;}
.graph_samp >*{	display: inline-block;}
.graph_samp >*:before{ content: ""; width:2em; height: 1em; display: inline-block; margin-right: 0.5em;}
.graph_samp .samp_single:before{ background-color: #B4B4B4;}
.graph_samp .samp_family:before{ background-color: #70BCC0;}
.graph_samp >* + *{ margin-left: 1em;}
.region_txt{ padding-top: 1.5em;line-height: 1.8em;}

#region_char .region_txt + h3{ padding-top: 3.5em;}
.loan_atten + #region_char{ padding-top: 8em;}
#region_char + #soldout_box{padding-top: 8em;}

.toareainfo_box { text-align: center; padding-top: 5em; padding-bottom: 3em; display: block; float: none; clear: both;}
.area_related{padding:5em 0 1em 0;}
.toareainfo_box + .area_related{padding-top: 2em;}
.area_related li .img_box{ width: 100%; aspect-ratio: 4 / 3; margin-bottom: 0.75em;}
.area_related li .img_box img[class*="wp-image-"]{width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; display: block;}
.area_related li .comm_btn{font-size: 100%; padding-left:1em; padding-right: 2.5em; line-height: 1.4; text-align: left;}


@media only screen and (max-width: 760px) {
    /**アンカーリンク**/
    a[name="list_top"]:before{
      margin-top:-140px;
      padding-top:140px;
      content:'';
      display:block;
    }
    
    /**プラスマイリノこっこから**/
    .plmyreno_box{}
    .plmyreno_box .plmyreno_logo{}
    .plmyreno_box img.plmyreno_img{}
    .plmyreno_box .plmyreno_toha{}
    .plmyreno_box .plmyreno_toha a{}
    #plmyreno-mord{background-color: #fff; text-shadow: none!important; padding: 1.5em;}
    #plmyreno-mord .plmyreno_name{font-size:1.4rem; color: #000!important;}
    #plmyreno-mord p{font-size: 1.1rem; color: #000!important;}
    .renocolle_search_pulldowns + .plmyreno_box{margin-top: 0;}
    
    /**プラスマイリノここまで**/
	/* ##### 特集用 ##### */
	.renocolle_com_tokusyu_ttl { font-size: 2rem; }
	.renocolle_com_tokusyu_body { font-size: 1.2rem; }

	/*マップから検索*/
	#mapAreaOuter {
		margin-top: -160px;
		padding-top: 160px;
	}
	.mapArea {
		padding: 0;
	}
	.mapArea #map {
		height: calc( 100vh - 260px );
		float: none;
	}
	.st_list { padding-top: 24px;}
	.st_list li{
		width: calc( 100% / 3 );
		display: inline-block;
		letter-spacing: normal;
		vertical-align: top;
		padding-left: 1%;
		padding-right: 1%;
		padding-bottom: 8px;
	}
    .st_list li input[type="button"]#saidaiji{ text-align: center;}

	#map_info-pc { display: none; }
	#map_info-sp {
		display: block;
		position: fixed;
		bottom: calc( (100vh - 250px) * (-1) );
		left: 0;
		width: 100vw;
		max-height: calc( 100vh - 300px );
		min-height: 200px;
		z-index: 9995;
		background: #ffffff;
		padding: 10px 0;
	}
	.map_form_changeAreas input[type="button"] { background-image: none; }
	#map_info-sp .prop_box {
		position: relative;
		overflow: scroll;
		padding: 0 10px;
	}
	#map_info-sp .prop_box>a {
		display: block;
	}
	#map_info-sp .prop_box>a:hover {
		filter:alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
	#map_info-sp .prop_box .vr-heart {
		margin: 0;
		position: absolute;
		bottom: 12px;
		left: 52%;
		width: 48%;
		padding-right: 12px;
	}
	#map_info-sp .prop_box .vr_box {
		margin: 0;
	}
	#map_info-sp .prop_box .photo_star {
		width: 15%;
		padding-top: 12%;
	}
	#map_info-sp .map_info1 { float: left; width: 50%; padding-right: 8px; }
	#map_info-sp .reno_spec { float: right; width: 50%; padding-left: 8px; padding-bottom: 24px;  }
	.map_info_controller-sp {
		position: absolute;
		width: 100%;
		height: 3px;
		top: -3px;
		left: 0;
		background: #3C3C46;
	}
	.map_info_controller-sp a {
		display: block;
		background: #3C3C46;
		width: 28px;
		height: 28px;
		position: absolute;
		right: 0;
		bottom: 0;
	}
	.map_info_controller-sp a:before,
	.map_info_controller-sp a:after {
		content: "";
		background: #ffffff;
		width: 75%;
		height: 2px;
		position: absolute;
		display: block;
		top: 0;
		bottom: 0;
		right: 0;
		left: 0;
		margin: auto;
	}
	.map_info_controller-sp a:before {
		-ms-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.map_info_controller-sp a:after {
		-ms-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	
	
/**エリア別説明エリア**/
#region_char{ padding-top: 3em; float: left; width: 100%;}
#region_char h3{ font-size: 1.8rem;}
.graph_box{}
.graph_box [class*="colspa_"] li{}
.graph_box [class*="colspa_"] .single-family{
	height: 280px;
	padding-left: 3px;
    padding-right: 3px;
}
.graph_box [class*="colspa_"] .single-family + .region_name{
font-size: 0.8em;
}

.graph_box .single_box{ width: calc(50% - 3px); left: 3px;}
.graph_box .single_box:after{
}
.graph_box .single_box .bar{
}
.graph_box .family_box{ width: calc(50% - 3px); right: 3px;}
.graph_box .family_box:after{
}
.graph_box .family_box .bar{
}
.graph_box .region_price{ font-size: 1.4rem;}
.graph_box .region_price:after{
	text-align: center;
	font-size: 1rem;
	display: block;
	line-height: 1em;
	padding-bottom: 0.5em;
}

.region_now .region_name{ }
.region_now .family_box .bar{}
.region_now .single_box .bar{}

.graph_samp {}
.graph_samp >*{	}
.graph_samp >*:before{ }
.graph_samp .samp_single:before{ }
.graph_samp .samp_family:before{ }
.graph_samp >* + *{}
#region_char .loan_atten + h3{ }
.region_txt{}
.loan_atten + #region_char{ padding-top: 6em;}
#region_char + #soldout_box{ padding-top: 6em;}

.toareainfo_box { }
.toareainfo_box .comm_btn{width: 100%!important;}
.area_related{}
.toareainfo_box + .area_related{padding-top: 0;}
.area_related li .img_box{ }
.area_related li .img_box img[class*="wp-image-"]{}
.area_related li .comm_btn{width: 100%!important; padding-right: 1.75em; font-size: 85%; margin: 0!important;}

}

