@charset "UTF-8";
/* ============================================================ //
// @ いくらかかるの初期費用?
// ============================================================ */
/*doc
---
title: いくらかかるの初期費用?
name: いくらかかるの初期費用?
category: estimate
---

```html_example
<div class="estimate-img"><img src="/resources/images/knowledge/estimate.png" alt="" /></div>
<div class="estimate-detail">
  <h4 class="heading02">入居費用詳細</h4>
  <dl class="example">
    <dt>(例)2LDK</dt>
    <dd>お家賃 ⇒ 60,000円</dd>
    <dd>駐車場 ⇒ 5,000円</dd>
    <dd>町費 ⇒ 300円</dd>
    <dd>敷金 ⇒ 4ヶ月</dd>
  </dl>
  <table class="costDetail">
    <tr>
        <th class="incost" colspan="2">入居費用</th>
    </tr>
    <tr>
        <td>(1)家賃(10月分)<p class="memo">前家賃としていただきます。</p></td>
        <td class="taR">60,000円</td>
    </tr>
    <tr>
        <td>(2)駐車場(10月分)<p class="memo">前家賃としていただきます。</p></td>
        <td class="taR">5,000円</td>
    </tr>
    <tr>
        <td>(3)町費(10月分)<p class="memo">地域や物件によってはない場合も。</p></td>
        <td class="taR">300円</td>
    </tr>
    <tr>
        <td>(4)敷金(4ヶ月)<p class="memo">家賃*4ヶ月</p></td>
        <td class="taR">240,000円</td>
    </tr>
    <tr>
        <td>(5)斡旋手数料<p class="memo">(家賃+駐車場)*消費税</p></td>
        <td class="taR">70,200円</td>
    </tr>
    <tr>
        <td>(6)用紙代<p class="memo">契約書作成費用</p></td>
        <td class="taR">250円</td>
    </tr>
    <tr>
        <td>(7)住宅総合保険料</td>
        <td class="taR">20,000円</td>
    </tr>
    <tr>
        <th class="othercost" colspan="2">諸費用</th>
    </tr>
    <tr>
        <td>(8)鍵交換代</td>
        <td class="taR">16,200円</td>
    </tr>
    <tr>
        <td>(9)室内消毒</td>
        <td class="taR">12,960円</td>
    </tr>
    <tr>
        <td>(10)保証料(保証人制度)<p class="memo">保証料は物件等により異なります。</p></td>
        <td class="taR">32,650円</td>
    </tr>
    <tr>
        <td class="sum" colspan="2">合計</td>
        <td class="sum">457,560円</td>
    </tr>
  </table>
</div>

```

*/
.estimate-img {
  margin-bottom: 30px;
  text-align: center;
}

.estimate-detail {
  margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
  .estimate-detail {
    margin-bottom: 30px;
  }
}

.estimate-detail .example {
  margin: 10px 0;
}

.estimate-detail .example dd {
  margin-left: 20px;
}

.estimate-detail .costDetail {
  width: 100%;
  margin: 20px 0;
  border: solid 2px #ccc;
  border-collapse: collapse;
}

.estimate-detail .costDetail th {
  vertical-align: middle;
  border-bottom: solid 1px #ccc;
  text-align: center;
  font-weight: bold;
}

.estimate-detail .costDetail td {
  vertical-align: bottom;
  border-bottom: dotted 1px #ccc;
}

.estimate-detail .costDetail th.incost {
  background: #e8f8fb;
  color: #0099cc;
}
.estimate-detail .costDetail th.othercost {
  background: #f4fbe8;
  color: #339900;
}
.estimate-detail .costDetail td.sum {
  text-align: right;
  font-weight: bold;
  border-top: solid 1px #ccc;
}

.estimate-detail .costDetail td .memo {
  font-size: 80%;
  display: inline-block;
  padding-left: 1em;
}
@media screen and (max-width: 767px) {
  .estimate-detail .costDetail td .memo {
    display: block;
    padding-left: 0;
  }
}
