/*---------------------
visual_area
---------------------*/


/*---------------------
リスト
---------------------*/

.contents_inner_wrap,
#contents.investment_list .contents_inner_wrap{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  width: 1200px;
  margin: 0 auto;
}
#contents.index{
  margin-top:60px;
}
#contents.index #room_contents,
#contents.low #room_contents.rent_roomlist{width: 820px;order: 2;box-sizing: border-box;margin-left: 5%;position: relative;}
#contents.investment_list #room_contents.invest_roomlist{width: 1200px;order: 2;box-sizing: border-box; position: relative;}

#contents.investment_list #room_contents.invest_roomlist .item_wrap .item {
    position: relative;
    width: 31%;
    float: left;
    display: block;
    padding: 0 0 35px;
    margin: 0 1%;
}

#room_contents .index_01{
  position:relative;
  margin-bottom: 48px;
}

#room_contents .index_02{
  text-align:center;
  padding-top: 10%;
  position: relative;
}
#room_contents .index_02 h2{
  font-size:18px;
  line-height: 1.2;
  margin-bottom: 30px;
}


#room_contents.rent_roomlist{
  position:relative;
}

#room_contents .ttl_area{
  text-align: center;
  margin: 0 0 5%;
  position: relative;
  border: 1px solid #0000C5;
}
#room_contents .ttl_area h2{
  font-size: 25px;
  margin: 0;
  font-weight: normal;
  color: #0000C5;
  font-family: 'Staatliches';
}

#room_contents .item_wrap{
  display:flex;
  flex-wrap:wrap;
  justify-content: space-between;
}
#room_contents .item_wrap .item{
    position: relative;
    width: 46%;
    float: left;
    display: flex;
    padding: 0 0 35px;
}
.item_wrap .item .head{
    /* margin: 15px 0; */
    text-align: center;
}
.item_wrap .item .ttl{
    margin: 40px 0 20px;
    width: 100%;
}
#room_contents .item_wrap .item .ttl h3{
  font-size:18px;
  line-height: 1.0;
}

.item_wrap .item .price{
  font-size:16px;
}
.item_wrap .item .facility{
    display: table;
    width: 100%;
}
.item_wrap .item .facility_inner_wrap{
    display: table-cell;
    vertical-align: baseline;
}
.item_wrap .item ul{
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    list-style: none;
}
.item_wrap .item ul li{
    color: #e5bda7;
    position: relative;
    line-height: 1.4;
}
.item_wrap .item dl.detail{
    display: flex;
    flex-wrap: wrap;
}
.item_wrap .item dl.detail dt,
.item_wrap .item dl.detail dd{
  padding: 0;
  font-size: 14px;
  color: #383B42;
}
.item_wrap .item dl dt{
    width: 100%;
}
.item_wrap .item dl dd{}
.item_wrap .item .foot{
    position: relative;
}
.item_wrap .item .btn_inlink_01{
    margin: 0 0 0 53%;
}

.item_wrap .item .head img{
  width: 100%;
  height: 260px;
  object-fit: none; /* この一行を追加するだけ！ */
}


/*---------------------
side
---------------------*/

.sp_search_btn_bg{
  display: none;
}
#side{
  width: 320px;
  position: relative;
}

#side .ttl_area{
  text-align: center;
  margin: 0 0 5%;
  position: relative;
  border: 1px solid #0000C5;
}
#side .ttl_area h2{
  font-size: 25px;
  margin: 0;
  font-weight: normal;
  color: #0000C5;
  font-family: 'Staatliches';
}
#side .ttl{
  font-size:18px;
  display: block;
  margin: 12% 0 3%;
}
#side input[type="submit"]{
    color: #fff;
    padding: 6px 50px;
    text-align: center;
    background: #0000C5;
    background-size: 11px;
    width: 100%;
    border: none;
}

.searchandfilter ul {
  margin: 0;
  padding: 0;
}

.searchandfilter li {
    width: 100%;
}

.searchandfilter li select{
  margin: 5% 0 8%;
  padding: 3%;
  border: 1px solid #383b42;
  width: 100%;
  -webkit-appearance: button;
}

/*---------------------
ページ詳細コンタクトバナー
---------------------*/
.contact_inner{
  width: 1200px;
    margin: 0 auto;
}
.contact_bnr{
      position: fixed;
      bottom: 0%;
      background-color:#E5E5F9;
      width: 100%;
      z-index: 3;
}
.contact_bnr .contact_box{
  display:  inline-block;
  vertical-align:  middle;
}
.contact_bnr .contact_box01{width: 25%;}
.contact_bnr .contact_box02{width: 22%;}
.contact_bnr .contact_box03{width: 50%;}
.contact_bnr .contact_box03 .contact_btn{
  border: 1px solid #0000C5;
  color: #0000C5;
  font-size: 18px;
  text-align: center;
  background-color: #fff;
  margin: 0% 16%;
  padding: 1%;
}
.contact_bnr .contact_box02 .teltime{font-size: 10px;}
.contact_bnr .contact_box01 .telnum a {
    font-size: 25px;
    color: #0000C5;
}
.contact_bnr .contact_box .telnum a span {margin-right: 5%;}


/*---------------------
investment 詳細
---------------------*/
.investment_inner_wrap{
  display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 1200px;
    margin: 0 auto;
}

.investment01{
  display: flex;
}
.investment01 .investment01_box{ flex-basis: 73%; width: 800px;}
.investment01 .investment01_boxtext{ flex-basis: 27%; position: relative;}

.investment01 .invest_type{
  color: #fff;
  background-color: #0000C5;
  font-size: 14px;
  text-align: center;
  width: 50%;
}

.investment01 .investment01_boxtext .btn a{
  border: 1px solid #0000C5;
    color: #0000C5;
    font-size: 18px;
    background-color: #fff;
    margin: 5% 17%;
    padding: 2% 20%;
    position: absolute;
    bottom: 0;
}

.investment02,
.invest_04,
.invest_05,
.invest_06,
.invest_07{
  width: 100%;
}
.investment02,
.investment04,
.investment05,
.investment06,
.investment07{
  display: flex;
  justify-content: space-around;
}
.investment02 .investright,
.investment04 .investright,
.investment05 .investright,
.investment06 .investright,
.investment07 .investright{
  border-right: 1px solid #CECECE;
}
.investment02 .investment02_box,
.investment04 .investment04_box,
.investment05 .investment05_box,
.investment06 .investment06_box,
.investment07 .investment07_box{
  width: 50%;
}

.invest_04 .ttl_blue_line,
.invest_05 .ttl_blue_line,
.invest_06 .ttl_blue_line,
.invest_07 .ttl_blue_line{
  margin-bottom: 3%;
}
.investment03, .investment08{
  width: 100%;
}
.investment_inner_wrap dl{
  padding-left: 3%;
  overflow: hidden;
  display: flow-root;
}
.investment_inner_wrap dt{
  float: left;
}
.investment_inner_wrap dd{
  margin-left: 25%;

}

.investment_inner_wrap dd.blue22 {
  font-size: 22px;
  padding: 0 8px;
}

/*---------------------
rent 詳細
---------------------*/

.rent_roomlist{
  width: 820px;
    order: 2;
    box-sizing: border-box;
    margin-left: 5%;
    position: relative;
}

/*---visual_area------*/
#visual_area .room_main{
width: 100%;
height: 0;
padding-top: calc(400 / 1000 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
background: center center / cover no-repeat;
}

/*---賃貸詳細------*/

.rent_room .side{
  order: 1;
  width: 320px;
  position: relative;
}

.rent_room .box_main{
  width: 820px;
  order: 2;
  margin-top: 8%;
  box-sizing: border-box;
  margin-left: 5%;
  position: relative;
}

.rent_room .box_main .ttl_blue{text-align: center;}

.rent_room .side dl {
    border-bottom: 1px solid #CECECE;
    padding-bottom: 4%;
    display: flow-root;
    overflow: hidden;
}

.rent_room .side dt {
    float: left;
}

.rent_room .side dd {
    margin-left: 25%;
}

/*---maps------*/

#google-maps {height: 550px;overflow: hidden;margin: 0 -200%;padding: 0 200%;}
#google-maps iframe {
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}