@charset "utf-8";

*{
  box-sizing:border-box;
}

body{
  margin:0;

	 color: #666;
}

@media(min-width:961px){
	.sponly{
	  display:none !important;
	}
  }
@media(max-width:960px){
  .pconly{
    display:none !important;
  }
}
@media(min-width:561px){
	.show_sp{display: none !important;}
 }
 @media(min-width:961px){
	.show_sptb{display: none !important;}
 }
 @media(max-width:560px){
	.show_tbpc{display: none !important;}
 }
 @media(max-width:960px){
	.show_pc{display: none !important;}
 }
/*変数*/
:root{
	--basecolor: #edffe9 ; /*基本色*/
	--sabcolor: #f2ffec; /*サブカラー*/
}

img{
  max-width:100%;
  vertical-align:bottom;
}


p{
	margin:0
}

h3{
	margin:0;
}

a{
  text-decoration: none;

}

a:visited{

}

a:hover{
  /*filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7;*/
}
.tac{
	text-align: center;
}
.tal{
	text-align: left;
}
.tar{
	text-align: right;
}
.mg0{
	margin: 0 auto;
}


.margin1{
	margin:10px
}
.margin2{
	margin:20px
}
.margin3{
	margin:30px
}
.margin4{
	margin:40px
}
.margin5{
	margin:50px
}
.mgb1{
	margin-bottom:10px
}
.mgb2{
	margin-bottom:20px
}
.mgb3{
	margin-bottom:30px
}
.mgb4{
	margin-bottom:40px
}
.mgb5{
	margin-bottom:50px
}
.mgt1{
	margin-top:10px
}
.mgt2{
  margin-top:20px
}
.mgt3{
	margin-top:30px
}
.mgt4{
	margin-top:40px
}
.mgt5{
	margin-top:50px
}
.mgl1{
	margin-left:10px
}
.mgl2{
	margin-left:20px
}
.mgl3{
	margin-left:30px
}
.mgl4{
	margin-left:40px
}
.mgl5{
	margin-left:50px
}
.mgr1{
	margin-right:10px
}
.mgr2{
  margin-right:20px
}
.mgr3{
	margin-right:30px
}
.mgr4{
	margin-right:40px
}
.mgr5{
	margin-right:50px
}
.n_mgt5{
	margin-top:5%
}

.padding1{
	padding:10px
}
.padding2{
	padding:20px
}
.padding3{
	padding:30px
}
.padding4{
	padding:40px
}
.padding5{
	padding:50px
}
.pdt1{
	padding-top:10px
}
.pdt2{
  padding-top:20px
}
.pdt3{
  padding-top:30px
}
.pdt4{
  padding-top:40px
}
.pdt5{
	padding-top:50px
}
.pdt6{
	padding-top:60px
}
.pdt7{
	padding-top:70px
}
.pdt8{
	padding-top:80px
}
.pdt9{
	padding-top:90px
}
.pdt10{
	padding-top:100px
}
.pdb1{
	padding-bottom:10px
}
.pdb2{
  padding-bottom:20px
}
.pdb3{
  padding-bottom:30px
}
.pdb4{
  padding-bottom:40px
}
.pdb5{
	padding-bottom:50px
}
.pdb6{
	padding-bottom:60px
}
.pdb7{
	padding-bottom:70px
}
.pdb8{
	padding-bottom:80px
}
.pdb9{
	padding-bottom:90px
}
.pdb10{
	padding-bottom:100px
}
.pdr5{
	padding-right:30% ;

}

/*----------
特殊例
-----------*/
/*----------
マーカー下線
----------*/
.marker_line {
    background: linear-gradient(transparent 60%, var(--basecolor) 0%);
}
.marker_line_oreng{
	background: linear-gradient(transparent 50%, #ffd95d9f 50%);
}
/*---------
 題字下下線
 ----------*/
.hr-green {
    border-top: 2px solid #3ca27e;
    width: 80px;
}
/*------------*/

.flex{
	display: flex;
}
.flex_wrap_reverse{
	display: flex;
}

/*--------------------------------
       ここまでtemplate
---------------------------------*/
/*--------- header--------*/

header{
	max-width: 1100px;
	margin: 10px auto 0;
}
header.flex{
	justify-content: space-between;
	align-items:flex-end;
}
.logo p{
	font-size: 10px;
	color: #777;
}
.logo_contact{
	text-align: right;
}
.logo_contact h2{
	margin: 0 auto;
}
.logo_contact p{
	color: #777;
	font-size: 11px;
}
.logo_contact h2 a{
	font-size: 130%;
	color: #059CD6;
    font-family: Arial, Helvetica, sans-serif;
}
.logo_contact h2 span{
	font-size: 15px;
}


/*--------- menu bar css --------*/
.gnavi__wrap {
    max-width: 1100px;
    width: 90%;
    margin: 0 auto;
}
.gnavi__lists {
    display: flex;
	list-style: none;
	padding: 0;
	position: relative;
}
.gnavi__lists::before{
	content: "";
	position: absolute;
	top: 0;
	left: -4px;
	background: url(../img/nav_left.png) no-repeat;
	width: 4px;
	height: 52px;
}
.gnavi__lists::after{
	content: "";
	position: absolute;
	top: 0;
	right: -4px;
	background: url(../img/nav_right.png) no-repeat;
	width: 4px;
	height: 52px;
}
.gnavi__lists .gnavi__list:nth-child(1){
	flex-grow:1;
}
.gnavi__lists .gnavi__list:nth-child(2){
	flex-grow:3;
}
.gnavi__lists .gnavi__list:nth-child(3){
	flex-grow:2;
}
.gnavi__lists .gnavi__list:nth-child(4){
	flex-grow:2;
}
.gnavi__lists .gnavi__list:nth-child(5){
	flex-grow:1;
}
.gnavi__lists .gnavi__list:nth-child(6){
	flex-grow:4;
}
.gnavi__list {
    height: 52px;
    background:url(../img/nav_back.png) 5px 0px repeat-x;
    position: relative;
    transition: all .3s;
}
.gnavi__list:hover {
    background: url(../img/hov.png);
}
.gnavi__list:not(:first-child)::before {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    transition: all .3s;
}
/*.gnavi__list:hover::before {
    background: red;
}*/
.gnavi__list a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: gray;
    font-size: 15px;
    letter-spacing: 0.05em;
    /*font-weight: 600;*/
    transition: all .3s;
}
@media(min-width:1050px){
	.gnavi__list a {
		padding: 0 1.2vw;
	}		
}
.gnavi__list:hover a {
    color: #fff;
}

.dropdown__lists {
    display: none;/*デフォルトでは非表示の状態にしておく*/
    width: 100%;
    position: absolute;
    top: 60px;
    left: 0;
	list-style: none;
	padding: 0;
	z-index: 3;
}
.gnavi__list:hover .dropdown__lists {
    display: block;/*Gナビメニューにホバーしたら表示*/
}
.dropdown__list {
    background-color: #004d80;
    height: 52px;
    transition: all .3s;
    position: relative;
}
.dropdown__list:not(:first-child)::before{
    content: "";
    width: 100%;
    height: 1px;
    background-color: #3492d1;
    position: absolute;
    top: 0;
    left: 0;
}
.dropdown__list:hover {
    background-color: #003558;
}
.dropdown__list a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    text-decoration: none;
    position: relative;
}
.dropdown__list a::before {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    transform: rotate(135deg);
    position: absolute;
    right: 15px;
    top: calc(50% - 5px);
}
.dropdown__lists {
    visibility: hidden;/*デフォルトでは非表示の状態にしておく*/
    opacity: 0;/*不透明度0*/
    transition: all .3s;/*表示の変化を0.3秒に指定*/
    width: 100%;
    position: absolute;
    top: 52px;
    left: 0;
}
.gnavi__list:hover .dropdown__lists {
    visibility: visible;/*Gナビメニューにホバーしたら表示*/
    opacity: 1;/*不透明度1*/
}
.dropdown__lists {
    transform: scaleY(0);/*デフォルトでは非表示の状態にしておく*/
    transform-origin: center top;/*変形を適応する基準をtopとする*/
    transition: all .3s;/*表示の変化を0.3秒に指定*/
    width: 100%;
    position: absolute;
    top: 52px;
    left: 0;
}
.gnavi__list:hover .dropdown__lists {
    transform: scaleY(1);/*Gナビメニューにホバーしたら表示*/
}


/*コンテンツ部分―汎用*/
.section_box{
    margin: 0px auto 0;
    position: relative;
	z-index: 1;

}
.contents_wrap{
	max-width: 1100px;
    width: 90%;
    margin: 0 auto;

}
.hero_wrap.flex{

}
.hero_contact{
	width: 20%;
}
.hero_contact p{
	font-size: 12px;
}
.hero_img{
	width: 63%;
}
.hero_img img{
	width: 100%;
}
.sumai_step{
	width: 17%;
	padding: 0 1% ;
	align-self: center;


}
.sumai_step p{
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-size: 12px;
	margin: 10px 0;
	padding: 5px 0 5px 0px;
}
.daiji{
	color: #0085B0;
    font-size: 16px;
    background-image: url(../img/k_li.png);
    background-position: 1% 50%;
    background-repeat: no-repeat;
    margin: 10px 0px 20px 0px;
    padding: 7px 0px 5px 28px;
    border-bottom: #C7C7C7 1px dotted;
	font-weight: normal;
}
.blockquote {
    padding-top: 17px;
    padding-right: 17px;
    padding-bottom: 17px;
    padding-left: 17px;
    margin-bottom: 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fafafa));
    background: -moz-linear-gradient(top, #fff, #fafafa);
    background: -o-linear-gradient(top, #fff, #fafafa);
    border: 1px solid #E3E3E3;
}
.blue{
	color: #0085B0;
}
.link_box{
	display:inline-block;
	line-height: 1.5;
    margin: 4px 0 0;
    padding: 1px 7px;
    font-size: 12px;
    color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #0085B0;
    background: #0085B0;
    background: -moz-linear-gradient(top, #00C1DD 0%, #0085B0 100%);
    background: -webkit-linear-gradient(top, #00C1DD 0%, #0085B0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00C1DD', endColorstr='#0085B0',GradientType=0 );
    background: linear-gradient(top, #00C1DD 0%, #0085B0 100%);
}


/*トップのご挨拶*/
.greeting_wrap .greeting{
	margin: 5px 0 15px 0;
}


/*物件情報*/
.grid_content{
	list-style-type: none;
	padding: 0;
}
.grid_content a{
	position: relative;
	display: block;
    -moz-border-radius: 3px;
    /* -webkit-border-radius: 3px; */
    /* border-radius: 3px; */
	color: #666;
    width: 23.5%;
    height: auto;
    margin-right: 2%;
    padding: 15px 16px 15px 16px;
    margin-bottom: 12px;
    font-size: 12px;
    line-height: 1.4;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fafafa));
    background: -moz-linear-gradient(top, #fff, #fafafa);
    background: -o-linear-gradient(top, #fff, #fafafa);
    border: solid 1px #e3e3e3;
    -webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
}
.grid_content a:nth-child(4){
	margin-right: 0;
}
.grid_content a .mask img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mask {
    display: block;
    line-height: 0;
    overflow: hidden;
    position: relative;
    height: 180px;
}
.grid_content a  .new_mark {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 10px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    color: #FFF;
    display: block;
    padding: 2px 5px;
    width: 50px;
    position: absolute;
    top: 15px;
    right: 16px;
    border-radius: 2px;
    text-shadow: 1px 1px 0px #900;
    background: #900;
    background: -moz-linear-gradient(top, #d20100 0%, #990000 100%);
    background: -webkit-linear-gradient(top, #d20100 0%, #990000 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d20100', endColorstr='#990000',GradientType=0 );
    background: linear-gradient(top, #d20100 0%, #990000 100%);
	z-index: 2;
}
.grid_content a .property_name2{
	margin-top:5px;
	font-weight:bold;
}
.grid_content a .price{
	color: red;
    font-size: 14px;
    font-weight: bold;
}
.grid_content a:hover{
	opacity: 0.7;
}




/*------------- footer -------------*/
footer{
	margin: 30px auto ;
}
.footer_wrap{
	margin: 0 0 10px 0;
    font-size: 12px;
    padding: 8px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -khtml-border-radius: 3px;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fafafa));
    background: -moz-linear-gradient(top, #fff, #fafafa);
    background: -o-linear-gradient(top, #fff, #fafafa);
    border: solid 1px #eee;
}
.footer_wrap a{
	display: inline-block;
	/* color: #007ea6; */
	/* font-weight:bold; */
}
.footer_wrap div{
	width: 23.5%;
	margin: 0 2% 0 0;
}
.footer_wrap div:nth-child(4){
	margin: 0;
}
.footer_wrap div p{
	margin: 0 0 18px 0;
}
.footer_wrap h4{
	margin: 0;
	font-size: 16px;
	font-weight: normal;
}
.footer_wrap div:nth-child(4) h4{
	color: orange;
}


/*--------------*/
.property_name{
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #6B878B;
    font-size: 20px;
    padding: 10px 25px;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e5e5e5));
    background: -moz-linear-gradient(top, #fff, #e5e5e5);
    background: -o-linear-gradient(top, #fff, #e5e5e5);
    -webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
    border: solid 1px #dedede;
    background: #f5f5f5;
	margin: 20px auto;
}
.property_basic{
	border: 1px solid #ccc;
	padding: 1%;
	margin: 20px auto;
}
.price_wrap{
	background: -moz-linear-gradient(left, #ebf6fc, #fff);
    background: -webkit-gradient(linear, left top, right top, from(#ebf6fc), to(#fff));
    background-color: #ebf6fc;
    line-height: 2;
    margin: 0px auto 10px;
    padding: 0 0 4px 1em;
}
.price h4,.price h5{
	margin: 0 10px 0 0;
	font-weight: normal;
	font-size: 15px;
}
.price.flex{
	align-items:center
}
.price h4 span,.kanrihi h5 span{
	color: #c00;
	display: inline-block;
	margin: 0 10px;
	font-size: 20px;
	font-weight: bold;
}
.kanrihi h5,.shiki_rei h6{
	font-size: 15px;
	margin: 0;
	font-weight: normal;
}
.property_info{
	display: flex;
	border-bottom:1px solid #f1f1f1 ;
}
.cell{
	display: flex;
	width: 100%;
}
.youso{
	width: 200px;
	align-self: center;
	text-align: center;
	padding: 5px;
	font-weight: bold;
}
.setsumei{
	border-left: 1px solid #f1f1f1;
	width: calc( 100% - 200px);
	padding: 5px 5px 5px 10px;
	display: flex;
	align-items: center;
}
.slider{
	margin: 15px auto;
}
.slide{
	width: 60%;
}
#main-slide img{
	max-height:65vh;
	object-fit:contain; 
}
.slide_group{
	width: 40%;
}
.slide_group img{
	width: 130px;
	height: 130px;
	object-fit: cover; 
}
.property_map{
	width: 100%;
	margin: 20px auto;
}
.property_map iframe {
    width: 50%;
    height: 500px;
}
.hosoku{
	text-align: right;
	font-size: 13px;
}
.toiawasesaki h2{
	margin: 0 auto;
	font-size: 15px;
	display: inline;
}
.toiawasesaki p{
	display: inline;
}
.toiawasesaki span{
	color: #ff6600;
	font-size: xx-large;
}
.toiawasesaki a{
	color: #ff6600;
	text-decoration: underline;
}










/*--------------- お問い合わせ ---------------*/
.form{
	max-width: 700px;
	margin: 0px;
	width:90%;
}
.form p{

}
/*.co_table{
	max-width: 900px;
	width: 90%;
	margin: 0px auto 40px;
	align-items: center;
}*/

.co_table dt{
	width: 100%;
}
.co_table dd{
	width: 100%;
	margin: 0;
}
.co_table span{
	padding:3px 8px;
	display: inline-block;
	margin-right: 20px;
	background: #00c6e3;
	color: #fff;
}

input[type=text],
input[type=radio],
textarea {
	width: 100%;
	border-top: none;
	border-right: none;
	border-left: none;
	height: 60px;
	border: #333 solid 1px;
	background-color: #fff;
	padding: 0.5em;
}
textarea{
	height: 100px;
}
input[type=text],
input[type=radio],
select,
textarea {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
}

.submit_tac{
	text-align: center;
}
input[type="submit"],
a.back {
	width: auto;
	height: auto;
	text-align: center;
	border: 0px solid;
	padding: 10px 20px;
	color: #fff;
	background: #007EA6;
	font-size: 16px;
	margin: 10px 0 40px;
	min-width: 200px;
	display: inline-block;
}

input[type="submit"]:hover,
a.back:hover{
	background: #00c6e3;
}

.mail_form_check .co_table dt{
	color: #000;
}

.return_btn{
	text-align: right;
}
.return_btn a{
	border-color: #444;
    color: #444;
    background: #e9e9e9;
    background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#e9e9e9));
    background: -moz-linear-gradient(top, #fefefe, #e9e9e9);
    background: -o-linear-gradient(top, #fefefe, #e9e9e9);
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
	text-transform: uppercase;
    font-size: 12px;
    padding: 6px 25px;
    margin-left: 5px;
    cursor: pointer;
	border-radius: 3px;
	border: solid 1px #aaa;
}

.return_btn a:hover{
	border-color: #aaa;
    color: #222;
    background: #f1f1f1;

    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}


.contactpage_box{
	border: 1px solid #eee;
	padding: 1%;
	margin: 10px auto 0;
}
.contactpage_box .form {
    max-width: 700px;
    margin: 0px auto;
    width: 90%;
}

/*-----------会社案内 ファミリーランドについて -------------*/
.company_box{
	border: 1px solid #eee;
	padding: 1%;
	margin: 20px auto 0;
}
.company_wrap p{
	padding: 10px;
    line-height: 1.6;
    margin: 0px;
}
.company_wrap .blockquote{
	margin-bottom: 60px;
}
.company_wrap .blockquote:nth-child(7){
	margin-bottom: 10px;
}
.company_wrap .map{
	width: 50%;
}
.company_wrap .map iframe{
	width: 100%;
	height: 500px;
}

/*物件リスト*/
.entry_title{
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #6B878B;
	font-size: 15px;
	padding: 10px 25px;
	margin-top:30px;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e5e5e5));
	background: -moz-linear-gradient(top, #fff, #e5e5e5);
	background: -o-linear-gradient(top, #fff, #e5e5e5);
	-webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1);
	border: solid 1px #dedede;
	background: #f5f5f5;
}
.entry_title a{
	color: #0085B0;
}
.entry_title a:hover{
	color: #00c6e3;
}
.list_img{
	text-align: center;
	width: 40%;
}
.list_img img{
	border: 1px solid;
	border-radius: 5px;
	padding: 1%;
	width: 200px;
	height: 200px;
	max-width:45vw;
	object-fit: cover;
}
.list_img div{
	justify-content: space-between;
}
.list_info{
	width: 58%;
	margin: 0 0 0 2%;
	background-color: #fff;
    border: 1px solid #b7b7b7;
    padding: 4px;
    margin: 0 0 0 2%;
    border-radius: 5px;
    -moz-box-shadow: 0px 2px 1px #BEC2C6;
    -webkit-box-shadow: 0px 2px 1px #BEC2C6;
    box-shadow: 0px 2px 1px #BEC2C6;
	font-size: 12px;
}
.list_info .youso{
	width: 100px;
}

.list_link{
    display: inline-block;
    color: #0085B0;
    font-size: 13px;
    font-weight: bold;
    background-color: #f4f4f4;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(0.49, #eeeeee), color-stop(0.5, #dddddd), color-stop(1, #ffffff));
    background: -moz-linear-gradient(top, #ffffff 0%, #eeeeee 49%, #dddddd 50%, #ffffff 100%);
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.7);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#eeeeee',GradientType=0 );
    -webkit-box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    box-shadow: 0px 1px 0px #fff;
    border-radius: 3px;
    text-align: center;
    height: 28px;
    width: 208px;
    border: 1px solid #999;
    margin: 10px auto 10px 0;
    padding-top: 3px;
    letter-spacing: 0.1em;
}

.list_link:hover{
	color: #39F;
}


/*スライドショー*/
.slider {
    width: 100%;
    margin: 20px auto;
}

.slide img {
    width: 100%;
    height: auto;
}

.thumbnail-group {
    display: flex;
    /* justify-content: center; */
    margin-top: 10px;
    flex-wrap: wrap;
    width:40%;
    /* align-items: baseline; */
    align-content: flex-start;
}
.thumbnail-group img{
	width: 100px;
	height: 100px;
	object-fit: cover; 
}
.thumbnail {
    width: 80px;
    margin: 0 3px;
    cursor: pointer;
    opacity: 0.6;
}

.thumbnail:hover, .thumbnail.active {
    opacity: 1;
}


/*sp_menu*/
/*sp_menu*/
/*========= ナビゲーションのためのCSS ===============*/

/*アクティブになったエリア*/
#g-nav.panelactive {
	/*position:fixed;にし、z-indexの数値を大きくして前面へ*/
	position: fixed;
	z-index: 999;
	top: 0;
	width: 100%;
	height: 100vh;
}

/*丸の拡大*/
.circle-bg {
	position: fixed;
	z-index: 3;
	/*丸の形*/
	width: 100px;
	height: 100px;
	border-radius: 50%;
	background: #fff;
	/*丸のスタート位置と形状*/
	transform: scale(0);
	/*scaleをはじめは0に*/
	right: -50px;
	top: -50px;
	transition: all .6s;
	/*0.6秒かけてアニメーション*/
}

.circle-bg.circleactive {
	transform: scale(50);
	/*クラスが付与されたらscaleを拡大*/
}

/*ナビゲーションの縦スクロール*/
#g-nav-list {
	display: none;
	/*はじめは表示なし*/
	/*ナビの数が増えた場合縦スクロール*/
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100vh;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

#g-nav.panelactive #g-nav-list {
	display: block;
	/*クラスが付与されたら出現*/
}

/*ナビゲーション*/
#g-nav .spmenu_ul {
	opacity: 0;/*はじめは透過0*/
    /*ナビゲーション天地中央揃え※レイアウトによって調整してください。不必要なら削除*/

    z-index: 999;
   /* top:50%;
    left:50%;
    transform: translate(-50%,-50%);*/
	width: 90%;
	margin: 40px auto 120px;
	list-style: none;
	padding: 0;
}

/*背景が出現後にナビゲーションを表示*/
#g-nav.panelactive ul {
    opacity:1;
}

/* 背景が出現後にナビゲーション li を表示※レイアウトによって調整してください。不必要なら削除*/
#g-nav.panelactive ul li{
	animation-name:g-naviAnime;
	animation-duration:1s;
	animation-delay:.2s;/*0.2 秒遅らせて出現*/
	animation-fill-mode:forwards;
	opacity:0;
	}
	@keyframes g-naviAnime{
	0% {
	opacity: 0;
	}
	100% {
	opacity: 1;
	}
}



/*リストのレイアウト設定*/
#g-nav li{
	text-align: left; 
	list-style: none;

}
.spmenu_ul .sp_menu{
	border-bottom: 1px solid #ccc;
}

.sp_ko_menu{
	background: #d9f2dc;
	border-radius: 5px;
	margin: 5px 0;
}
#g-nav .sp_ko_menu a{
	color: #000;
}
#g-nav .spmenu_ul .sp_mago_menu a{
	padding: 0 0 5px 15px;
	position: relative;
	color: #000;
}
#g-nav .spmenu_ul .sp_mago_menu a::after{
	content: "";
	position: absolute;
	width: 5px;
	height: 5px;
	border: 0.1em solid #11b319;
	border-left: 0;
	border-bottom: 0;
	top: 7px;
    left: 0%;
	transform:rotate(45deg);

}

#g-nav li a,
#g-nav li p{
	color: #000;
	text-decoration: none;
	padding:15px;
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: bold;
}
#g-nav li ul{
	padding: 0 0 1em 1em;
}


/*========= ボタンのためのCSS ===============*/
.sp_memu {
	position: fixed;
	top: 30px;
	right: 110px;
	z-index: 9999;
	/*ボタンを最前面に*/
}

.sp_memu img {
	width: 60px
}

.openbtn {
	position: fixed;
	top: 20px;
	right: 10px;
	z-index: 9999;
	/*ボタンを最前面に*/
	cursor: pointer;
	width: 40px;
	height: 50px;
}

/*×に変化*/
.openbtn span {
	display: inline-block;
	transition: all .4s;
	position: absolute;
	left: 0px;
	height: 3px;
	border-radius: 2px;
	background-color: #000;
	width: 100%;
	text-align: center
}

.openbtn span:nth-of-type(1) {
	top: 0px;
}

.openbtn span:nth-of-type(2) {
	top: 14px;
}

.openbtn span:nth-of-type(3) {
	top: 29px;
}

.openbtn span:nth-of-type(4) {
	bottom: 4px;
	background: none;
	font-size: 12px;
}

.openbtn.active span:nth-of-type(1) {
	top: 8px;
	left: 0px;
	transform: translateY(6px) rotate(-45deg);
	width: 100%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
	top: 20px;
	left: 0px;
	transform: translateY(-6px) rotate(45deg);
	width: 100%;
}

/マップのカード/
.map-card{
    display:block;
    text-align:center;
}
.map-card img{
    max-width:130px;
    display:block;
    margin:5px auto 0;
    text-align:center;
}
.map-card h4{
    margin:0
}
.map-card p{
    font-size:115%;
    display:inline-block;
    font-weight:bold;
    padding:4px;
}
.map-card span{
    display:block;
    background:#eee;
    border:1px solid #333;
    margin-top:7px;
    border-radius:3px;
}

.hanrei{
    margin:20px 0 10px;
}
.hanrei img{
    max-height:1.8em;
    display:inline-block;
    margin-right:3px;
}







/*--------------SP--------------■■■■■■■■■■■*/
@media(max-width:1100px){
	.hero_wrap.flex{
		flex-wrap:wrap-reverse
	}
	.hero_img{
		width:110%;
		margin-left:-5%;
		margin-right:-5%;
	}
	.hero_contact{
		width:30%
	}
	.sumai_step{
		width:30%
	}



}
@media(max-width:950px){
	/*------共通---------*/
	.flex_wrap_reverse{
		flex-wrap: wrap-reverse;
	}
	.flex{
		flex-wrap: wrap;
	}
	/*spmenu*/
	.openbtn span:nth-of-type(2){
		top: 10px;
	}
	.openbtn span:nth-of-type(3){
		top: 21px;
	}
	.openbtn span:nth-of-type(4){
		font-size: 9px;
		bottom: 18px;
	}

	/*company*/
	.company_wrap .map {
		width: 100%;
	}

	/*footer*/
	.footer_wrap div{
		width: 48%;
	}


	.list_info .property_info{
		flex-wrap: wrap;
		border: none;
	}
	.list_info .cell{
		border-bottom:1px solid #f1f1f1
	}
	.list_img div{
		justify-content:center
	}
	/*インデックスpage*/
	.grid_content a{
		width:48%
	}
}

@media(max-width:768px){
	.logo{
		width: 86%;
	}
	.logo_contact{
		text-align:center;
		width: 100%;
		margin: 10px 0;
	}

	/*賃貸*/
	.property_info{
		flex-wrap:wrap;
		border: none;
	}
	.cell{
		border-bottom:1px solid #f1f1f1
	}
	.youso{
		width:130px
	}
	.setsumei{
		width: calc(100% - 130px);
	}
	.slide{
		width:100%
	}
	.thumbnail-group{
		width:100%
	}
	.toiawasesaki span{
		display:block
	}
	.return_btn{
		margin:40px auto;
	}
	/*インデックス*/
	.hero_contact{
		width: 50%;
		margin: 0 4% 0 0;
	}
	.sumai_step{
		width: 46%;
		padding: 0 0 0 5%;
	}
	
}
@media(max-width:560px){
	.list_img{
		width:100%
	}
	.list_info{
		width:100%
	}
	.mask{
		height:120px
	}

}