﻿@charset "UTF-8";

/* ============================================================================

title :
scope :

last modify : 2019/02/13 XXX_oomori 【HMR】施設詳細／お気に入り登録ボタンの改修 #15834

modify :

============================================================================ */
.mordal_lead {
  font-size: 15px;
  letter-spacing: .02em;
  line-height: 1.3;
  margin: 10px 0 15px;
}

.mordal_lead .txt_fav {
  color: #f53256;
  font-weight: bold;
}

#loading_ar_srch_databox .box {
  border-bottom: 2px solid #ec5c84;
}

.mod_bkn_data > .ttl {
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 15px;
  color: #205733;
  text-align: center;
}

.mod_bkn_data > .ttl::before {
  content: '';
  background: url(/search/image/dtl_new/ico-h2.png) no-repeat;
  background-size: 100%;
  background-position: bottom;
  display: inline-block;
  width: 28px;
  height: 21px;
  vertical-align: text-bottom;
  margin-right: 10px;
}

.mod_bkn_data > .text .nobr {
  display: inline-block;
  white-space: normal;
}

.mod_bkn_data > .ttl > .nobr.ttl_inner {
  display: inline-block;
  white-space: normal;
  color: #000;
}

.mod_bkn_data > .ttl > .nobr > .diff_color {
  color: #de667f;
  font-weight: 600;
}

.mod_bkn_data .bkn_house > .ttl {
  font-size: 21px;
  font-weight: normal;
  padding: 8px 20px 3px;
}

.mod_bkn_data .bkn_house .ttl .ttl_block > .white_background {
  background-color: #fff;
  color: #e0658c;
  padding: 5px;
  margin: 0 5px;
}
/* ------------------------------------
 もっと見るボタン
------------------------------------ */
.mod_bkn_data .btn_wrap {
  text-align: center;
  padding: 10px 0 24px;
}

.mod_bkn_data .btn_wrap .btn_brown {
  display: inline-block;
  width: 40%;
}

.btn_brown .txt_inner {
  background-color: #e0426d;
  border-radius: 5px;
  box-shadow: inset 0 -3px 0 #cc1d3f;
  color: #fff;
  display: block;
  line-height: 1.5;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 3px;
  padding: 8px 26px 8px 28px;
  position: relative;
  text-align: center;
}

.btn_brown .txt_inner::before {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 9px solid #fff;
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.btn_brown.active .txt_inner:before {
  border-bottom: 9px solid #fff;
  border-top: transparent;
}
/* ------------------------------------
 半径〇〇m以内の賃貸物件検索
------------------------------------ */
.box_btn_all_bkn {
  text-align: right;
}

.mod_bkn_data .bkn_srch .btn_all_bkn {
  position: relative;
  min-width: 200px;
  margin: 10px 10px 0 auto;
}
.mod_bkn_data .bkn_srch .box_btn_all_bkn > .btn_all_bkn::after {
  content: '';
  background: url(/search/image/dtl_new/ico-link.png) no-repeat;
  background-size: 80%;
  background-position: right;
  position: absolute;
  display: inline-block;
  width: 20px;
  height: 20px;
  right: 10px;
  top: 50%;
  transform: translate(0, -50%);
}
/* ------------------------------------
 周辺の賃貸物件検索
------------------------------------ */
.mod_bkn_data .bkn_srch_or > .ttl {
  background: #0068b7;
}

.mod_bkn_data .bkn_srch.bkn_srch_or .cont {
  border-color: #0068b7;
}

.mod_bkn_data .bkn_srch_or .rowbox > dt:not(.item) {
  color: #0068b7;
}

.mod_bkn_data .bkn_srch_or .item > dd a {
  background: #0068b7;
  box-shadow: inset 0 -3px 0 #005a97;
}

.mod_bkn_data .bkn_srch_or .item > dt::before {
  background: url(/search/image/dtl_new/ico-search_around.png) #0068b7 no-repeat center/24px;
}
/* ------------------------------------
 賃貸物件を探すボタン
------------------------------------ */
.mod_bkn_data .map_pikasyame .search_rental {
  display: flex;
  justify-content: space-between;
}

.mod_bkn_data .map_pikasyame .search_rental li {
  margin-bottom: 10px;
}

.mod_bkn_data .map_pikasyame .search_rental li:last-child {
  padding: 0;
}

#ar_srch_databox .mod_bkn_data .map_pikasyame .search_rental li a {
  background: #4c9b2e;
  border: 2px solid #1f7418;
  border-radius: 5px;
  box-shadow: 0 4px 7px 0 rgb(255 255 255 / 50%) inset, 0 -4px 7px 0 rgb(72 57 62 / 50%) inset;
  color: #fff;
  display: inline-flex;
  letter-spacing: .05em;
  font-size: 17px;
  font-weight: 600;
  min-height: 42px;
  padding: 10px 15px 10px 55px;
  position: relative;
  text-align: left;
  width: 210px;
  line-height: 1.2;
  align-items: center;
}
/* ------------------------------------
 施設周辺から探すモーダル
------------------------------------ */
.ttl_ar_srch_type {
  margin-top: 0;
  background-color: #e15f37;
}

.ttl_ar_srch_type .srch_type {
  display: block;
  margin: 0;
  padding: 15px 15px 18px 50px;
  text-align: left;
  font-size: 22px;
  line-height: 1.5;
  color: #fff;
  background: url(/search/image/dtl_new/ico_ttl_ar_srch_type.gif) no-repeat 0 0 /50px;
}

.ttl_ar_srch_fa_name {
  font-size: 18px;
  line-height: 1.2;
  box-sizing: border-box;
  margin: 20px auto 0;
  padding: 0 0 5px 20px;
  color: #e15f37;
  border-bottom: 3px solid #e15f37;
  background: url(/search/image/dtl_new/ico_ttl_ar_srch_fa_name.gif) no-repeat 0 0;
}

.fcb_ar_srch .bnrbox {
  border-top-color: #e15f37;
}

.form_btnbox .mod_rent_back02 {
  width: 170px;
  height: 50px;
  display: inline-block;
  margin-top: 1px;
  margin-right: 10px;
}

.mod_rent_back02 a {
  border: solid 1px #eeac97;
  background: #ffe1d7;
  border-radius: 6px;
  color: #000;
  letter-spacing: .25em;
  font-size: 18px;
  line-height: 50px;
  display: inline-block;
  vertical-align: top;
  position: relative;
  width: 100%;
  padding-left: 28px;
  box-sizing: border-box;
}

.form_btnbox .mod_rent_back02 a::before {
  content: '';
  width: 1em;
  height: 1em;
  background: url(/search/image/dtl_new/ico_back.png) no-repeat center center /contain;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: calc( 50% - 2em);
}
/* ------------------------------------
 施設周辺から「家賃」で賃貸物件を検索
------------------------------------ */
.ar_srch_lst li.yachin_left {
  float: left;
  padding-right: 24px;
}

[id^="fcb_yachin"] .ar_srch_lst li {
  display: inline-block;
  height: 45px;
  margin: 0 0 10px;
  overflow: hidden;
  vertical-align: bottom;
  width: 285px;
}

[id^="fcb_yachin"] .ar_srch_lst li label,
[id^="fcb_yachin"] .ar_srch_lst li label.on {
  background-color: #16874b;
  background-position: 10px center;
  background-size: 20px;
  border-radius: 6px;
  box-shadow: 0 -3px #0f5e34 inset;
}

.form_btnbox {
  position: relative;
  margin: 15px 0 30px;
}

.form_btnbox .mod_rent_submit {
  display: inline-block;
}

.form_btnbox input[type="image"] {
  vertical-align: top;
}
/* ------------------------------------
 施設周辺から「間取り」で賃貸物件を検索
------------------------------------ */
[id^="fcb_madori"] .ar_srch_lst li label,
[id^="fcb_madori"] .ar_srch_lst li label.on {
  box-shadow: 0 -3px #0f5e34 inset;
  border-radius: 6px;
  background-color: #16874b;
  background-position: 10px center;
  background-size: 17px;
}

/* ------------------------------------
 施設周辺から探すボタン
------------------------------------ */
.ar_srch_lst {
  background-position: right -5px;
}

.ar_srch_lst li {
  height: 55px;
}

.ar_srch_lst li a {
  background: url(/search/image/dtl_new/btn_ar_srch_category.gif) no-repeat left 10px center #16874b;
  background-size: 35px;
  color: #fff;
  display: block;
  font-size: 16px;
  font-weight: 600;
  height: 55px;
  width: 292px;
  box-shadow: 0 -3px #0f5e34 inset;
  border-radius: 6px;
}

.ar_srch_lst li a > span {
  height: 55px;
  line-height: 55px;
}