/*松原・阿保3丁目*/

.link{
	width: 100%;
	color: #f8b551;
	display: block;
	padding: 5px 0;
}
.link:hover{
	opacity: 0.7;
}
p {
	font-feature-settings: "palt";
}
/*----------------------------------------
	フレーム
----------------------------------------*/
.main_frame{
	width:100%;
	max-width: 1350px;
	box-sizing: border-box;
	margin-right: auto;
	margin-left: auto;
}
.main_frame_s{
	width:100%;
	max-width: 1150px;
	box-sizing: border-box;
	margin-right: auto;
	margin-left: auto;
	padding-right: 20px;
	padding-left: 20px;
}
.frame1200 {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}
.frame1170 {
	max-width: 1170px;
	margin-left: auto;
	margin-right: auto;
}
.max800 {
	max-width: 800px;
}
.inner_frame{
	width:100%;
	max-width: 1210px;
	box-sizing: border-box;
	padding-right: 20px;
	padding-left: 20px;
	margin-right: auto;
	margin-left: auto;
}
.inner_frame_s{
	width:100%;
	max-width: 840px;
	box-sizing: border-box;
	padding-right: 20px;
	padding-left: 20px;
	margin-right: auto;
	margin-left: auto;
}

.inner_bg_white{
	background:#fff;
	padding-right: 2.5%;
	padding-left: 2.5%;
}
.box_r47{
	float: right;
	width: 47%;
	box-sizing: border-box;
}
.box_l47{
	float: left;
	width: 47%;
	box-sizing: border-box;
}
@media print, screen and (max-width: 1349px) {
	.frame{
		width:auto;
		padding-right: 4.5%;
		padding-left: 4.5%;
	}
}
@media screen and (max-width: 1240px) {
	.frame1200 {
		box-sizing: border-box;
		padding-left: 20px;
		padding-right: 20px;
	}
}
@media screen and (max-width: 1210px) {
	.frame1170 {
		padding-left: 20px;
		padding-right: 20px;
	}
}
@media screen and (max-width: 1040px) {
	.inner_frame {
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media print, screen and (min-width: 769px) {
	.main_frame_s{
		padding-right: 1.72%;
		padding-left: 1.72%;
	}
	.inner_frame_s{
		padding-right: 1.72%;
		padding-left: 1.72%;
	}


}/*END*/
@media screen and (max-width: 768px){

	.inner_frame_s.frame{
		width:auto;
		padding-right: 4.5%;
		padding-left: 4.5%;
	}
	.main_frame_s{
		width:auto;
		padding-right: 4.5%;
		padding-left: 4.5%;
	}
	.frame1200,.frame1170,.inner_frame {
		padding-right: 4.5%;
		padding-left: 4.5%;
	}

}/*END*/
@media screen and (max-width: 599px){
	.box_r47{
		float: none;
		width: 100%;
		box-sizing: border-box;
	}
	.box_l47{
		float: none;
		width: 100%;
		box-sizing: border-box;
	}

	
}
@media screen and (max-width: 479px){
	.inner_bg_white{
		width: 96%;
		margin:0 auto;
	}


}/*END*/




.box_l{
	float: left;
	width: 48.11%;
}
.box_r{
	float: right;
	width: 48.11%;
}
@media screen and (max-width: 599px){
	.box_l{
		float: none;
		width: 100%;
	}
	.box_r{
		float: none;
		width: 100%;
	}
}
@media screen and (min-width: 600px) {
	.frame1170 .box_l {
		width: 45.30%;
	}
	.frame1170 .box_r {
		width: 48.72%;
	}
}

.w90{
	width: 90%;
}
.w45{
	width: 45%;
}
@media screen and (max-width: 600px){
	.w45{
		width: 95%;
	}
}
/*----------------------------------------
	mv
----------------------------------------*/
.obi{
	background-color: #2daf4e;
	overflow: hidden;
	padding-top: 25px;
	padding-bottom: 25px;
	padding-left: 3%;
	padding-right: 3%;
	max-width: 1200px;
	margin: 0 auto;
}
.obi_frame{
	background-color: #2daf4e;
}
.obi li{
	width : calc(100% / 3) ;
	float: left;
	box-sizing: border-box;
	border-left: 1px #fff solid;
	padding-left: 10px;
	padding-right: 10px;
}
.obi li:first-child{border-left: none;}
@media screen and  (max-width: 479px){
	.obi{
	padding-top: 10px;
	padding-bottom: 10px;
}
	.obi li{
	width :70%;
	margin: 0 auto;
	float: none;
	padding: 5px 4.5%;
	border-left: none;
}
 }
 /*---------------------------END---------------------------*/
.text_white{
	color: #fff;
}
.text_red{
	color: red;
}

/*----------------------------------------
	見出し
----------------------------------------*/
.ttl{
	max-width: 510px;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
}
.ttl2{
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	width: 90%;
}
.ttl3{
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	width: 90%;
}
.max500 {
	max-width: 500px;
}
.max510 {
	max-width: 510px;
}
.max450 {
	max-width: 450px;
}
.max950 {
	max-width: 950px;
}

.font_wb{
	font-weight: bold;
}

.p_lr70 {
	padding-left: clamp(10px,6.36%,70px);
	padding-right: clamp(10px,6.36%,70px);
}
.p_lr30 {
	padding-left: clamp(10px,2.7%,70px);
	padding-right: clamp(10px,2.7%,70px);
}
.text_copy{
	text-align: center;
}
@media screen and (max-width: 599px) {
	.sp_p_lr0{
		padding-left: 0;
		padding-right: 0;
	}
	.sp_w_90 {
		width: 90%;
	}
	.sp_w_80 {
		width: 80%;
	}
	.sp_w_50 {
		width: 50%;
	}
	.text_copy{
		text-align: left;
	}
}
@media screen and (min-width: 600px) {
	.text_center{
		text-align: center;
	}
}

.m_b150{
	margin-bottom: 150px !important;
}
@media screen and (max-width: 769px){
	.m_b150{
		margin-bottom: 100px !important;
	}
}
.margin_auto{
	margin-left: auto;
	margin-right: auto;
}
/*----------------------------------------
	bg
----------------------------------------*/
.bg_color01 {
	background-color: #f2f9e4;
}
.bg_color02 {
	background-color: #dfe7ea;
}
.bk_white{
	background: #fff;
}
.bg_orange01 {
	background-color: #edb67c;
}
.bg_orange02 {
	background-color: #fee3c5;
}
.bg_check {
	background-color : #fff;
	background-image:
		repeating-linear-gradient( 0deg,#f2f2f2 0px 1px,	transparent 1px 15px),
		repeating-linear-gradient( 90deg,#f2f2f2 0px 1px,	transparent 1px 15px);
}

/*----------------------------------------
	concept
----------------------------------------*/


/*----------------------------------------
	区画図
----------------------------------------*/

.t_x40{
	transform: translate(40px);
}
@media screen and (max-width: 599px){
	.t_x40{
		transform: translate(20px);
	}
}

/*----------------------------------------
	参考間取り図
----------------------------------------*/

/*----------------------------------------
	仕様
----------------------------------------*/

.max1050 {
	max-width: 1050px;
}

/*----------------------------------------
	周辺環境
----------------------------------------*/
.location_frame table{
	width: 100%;
	line-height: 1.8;
	border-top: 1px solid #000;
	font-size:1.4rem;
}
.location_frame th,
.location_frame td{
	text-align: left;
	padding: 10px;
	border-bottom: 1px solid #000;
	font-weight:500;
	font-feature-settings: "palt";
}
.location_frame th{ text-align: left; }
.location_frame td{ text-align: right; }

.location_frame h3{
	height:25px;
}

@media screen and (max-width: 768px){
	.location_frame th {
	    width:55%;
	}

}/*END*/

@media screen and (max-width: 479px){
	.location_frame table{
		font-size:1.2rem;
	}
	.location_frame th{
	padding-left:0;
	}
	.location_frame td{
	padding-right:0;
	}

}/*END*/

/*----------------------------------------
	アクセス
----------------------------------------*/

/*----------------------------------------
	物件概要テーブル
----------------------------------------*/
.tb_style_outline{
	width: 100%;
	border-top:1px solid #dcdcdc;
	background: #d7e3e8;
}

table.tb_style_outline{
	word-break: break-all;
}

.tb_style_outline th,
.tb_style_outline td{
	line-height: 1.6;
	text-align: left;
	vertical-align: top;
	font-weight: normal;
	padding: 10px 15px;
	color:#333;
	overflow-wrap : break-word;
}
.tb_style_outline th{
	background: #aacabf;
	font-weight:bold;
	border-bottom:1px solid #dcdcdc;
	box-sizing: border-box;
}

.tb_style_outline td{
	background: #fff;
	border-bottom:1px solid #dcdcdc;
	padding-left:15px;
}

.tb_style_outline .td_wide th{
	width:40%;
}



@media print, screen and (min-width: 769px) {

	.tb_style_outline th{ 
		width:30%;
		max-width: 155px; 
	}

}/*END*/

@media screen and (max-width: 768px){
	table.tb_style_outline {
	    border-spacing: 0 0;
	}

	.tb_style_outline th, .tb_style_outline td {
	   /* border: none;
	    display: block; スマホテーブル幅いっぱい*/
		font-size:1.4rem;
	}

	.tb_style_outline th {
	    padding:8px 5px 8px 8px;
	}
	.tb_style_outline td {
	    padding: 8px 5px 8px 8px;
	}

	.th2 th.tb_bg_brown {
	    background: none;
	    font-weight: bold;
	}

	.tb_style_outline th {
	    /*width:100%;　スマホテーブル幅いっぱい*/
		width: 34%;
	}

}/*END*/

@media screen and (max-width: 479px){

	.border_t0{border-top:none;}

}/*END*/
@media screen and (min-width: 600px) {
	.point_copy{
		margin-left: -8%;
	}
	.location_point_copy{
		margin-left: -6%;
	}
}

.bg01{
	background-image: url(../images/realestate/matsubara_abo/specification_bg_top.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
.bg02{
	background-image: url(../images/realestate/matsubara_abo/concept_bg_top.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	box-sizing: border-box;
	background-color: #f0fcfa;
}
.bg03{
	background-color: #fff;
}
.bg04{
	background-image: url(../images/realestate/matsubara_abo/outline_bg_top.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	box-sizing: border-box;
	background-color: #f0fcfa;
}
.bg05{
	background-image: url(../images/realestate/matsubara_abo/plan_bg_top.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	box-sizing: border-box;
	background-color: #f0fcfa;
}
.bg06{
	background-image: url(../images/realestate/matsubara_abo/location_bg_top.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	box-sizing: border-box;
	background-color: #f0fcfa;
}
.bg07{
	background-image: url(../images/realestate/matsubara_abo/specification_bg_top.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
	box-sizing: border-box;
	background-color: #fff;
}
@media screen and (max-width: 1199px) {
	.bg01,
	.bg02,
	.bg04,
	.bg05,
	.bg06,
	.bg07{
		background-size: 150%;
	}
}
@media screen and (max-width: 599px) {
	.bg01,
	.bg02,
	.bg04,
	.bg05,
	.bg06,
	.bg07{
		background-size: 200%;
	}
}
@media screen and (max-width: 1040px) {
	.bg03{
		padding: 0 3.5%;
	}
}
.plan_img_box{
	display: grid;
	grid-template-columns: repeat(2,1fr);
	column-gap: 5%;
	row-gap: 30px;
	max-width: 865px;
	margin-inline: auto;
}

.land_plan_deco01,.land_plan_deco02{
	position: absolute;
}
.land_plan_deco01{
	top: 3%;
	right: 0;
	max-width: 266px;
	width: 19.7037%;
}
.land_plan_deco02{
	left: 0;
	bottom: 3%;
	max-width: 117px;
	width: 8.6666%;
}
.plan_deco01{
	position: absolute;
	max-width: 300px;
	width: 19.326%;
	right: 7%;
	top: -60%;
}
.location_deco01,.location_deco02{
	position: absolute;
}
.location_deco01{
	max-width: 241px;
	width: 17.851%;
	top: 3.5%;
	left: 0;
}
.location_deco02{
	max-width: 117px;
	width: 8.6666%;
	bottom: 3%;
	right: 0;
}
@media screen and (max-width: 820px) {
	.plan_deco01{
		right: 0%;
		top: -80%;
	}
}

@media screen and (max-width: 820px) {

	.plan_img_box{
		display: block;
	}
	.plan_img_box div{
		margin-bottom: 15px;
	}

}

.grid_02,.grid_03,.grid_04{
	display: grid;
	row-gap: 30px;
	column-gap: 3.5%;
}
.grid_02.al_center,.grid_03.al_center,.grid_04.al_center{
	align-items: center;
}
.grid_02{
	grid-template-columns: repeat(2,1fr);
}
.grid_03{
	grid-template-columns: repeat(3,1fr);
}
.grid_04{
	grid-template-columns: repeat(4,1fr);
}
@media screen and (max-width: 599px) {
	.grid_02{
		grid-template-columns: repeat(1,1fr);
	}
	.grid_03{
		grid-template-columns: repeat(1,1fr);
	}
	.grid_04{
		grid-template-columns: repeat(2,1fr);
	}
}