@CHARSET "UTF-8";

@media screen and (max-width: 768px){
    /* ヘッダー関連 */
    .header td.logo-area {
        width: 100%;
        display: block;
    }
    .header td.menu-area {
        width: 100%;
        display: block;
        height: 1px;
    }
    .header td.logo-area img {
        width: 50%;
    }
    .header td.menu-area.menu {
        text-align: center;
        padding-top: 5px;
        padding-right: 0;
        height: 2.2em;
    }
    .header td.menu-area.menu a {
        margin-left: 0;
        margin: 0 15px;
    }
    /* トップページ関連 */
    .flex-over {
        width: 100%;
        top: auto;
        bottom: 0;
        left: 0;
    }
    .caption {
        width: 100%;
        padding: 10px;
    }
    .caption p.title {
        font-size: 25px;
        text-align: center;
    }
    .caption p.sub-title {
        text-align: center;
    }
    .search-area table {
        margin-top: 20px;
    }
    .search-area .contents, .recommend-area .contents {
        width: 90%;
    }
    .search-area td.pref, .search-area td.city, .search-area td.floor, .search-area td.submit {
        display: table;
        width: 100%;
        border: none;
        padding: 10px 20px;
    }
    .search-area td.pref p.sub, .search-area td.city p.sub, .search-area td.floor p.sub, .search-area td.submit p.sub {
        display: table-cell;
        width: 60%;
        padding-right: 5%;
        padding-left: 5%;
        vertical-align: middle;
    }
    .search-area td.pref p.main, .search-area td.city p.main, .search-area td.floor p.main, .search-area td.submit p.main {
        display: table-cell;
        padding-left: 10%;
    }
    /* 人気エリア */
    .commitment-header .image {
        height: auto;
    }
    .commitment-header .flex-over {
        top: auto;
        width: 100%;
        left: 0;
    }
    .commitment-header {
        position: relative;
    }
    .commitment-header .caption p.title {
        font-size: 20px;
    }
    /* 検索画面 */
    .result-list .floor-select {
        width: 50%;
    }
    .result-list .price {
        padding: 20px 3%;
    }
    /* 物件詳細 */
    .article-detail .address {
        margin-bottom: 20px;
    }
    .info-area .floor {
        margin-bottom: 30px;
    }
    .request.bottom .contact, .request.bottom .favorite, .request.bottom .add-evaluation {
        width: 80%;
    }
    .social-area .btn {
        margin-bottom: 3px;
        margin-top: 3px;
    }
    .article-over {
        width: 40%;
    }
    .article-over.article-detail {
        width: 100%;
        position: relative;
        margin-bottom: 0;
    }
    .article-over p.new-article {
        width: 50%;
        display: table-cell;
        vertical-align: middle;
    }
    .article-over p.price {
        width: 50%;
        display: table-cell;
        vertical-align: middle;
    }
    .article-over .caption {
        display: table;
    }
    .select-room-wrap .prev-room a, .select-room-wrap .next-room a {
        font-size: 80%;
        padding: 10px 0;
    }
    .select-room-wrap .prev-room, .select-room-wrap .next-room {
        width: 54px;
        height: 50px;
    }
    /* オーナー詳細 */
    h2.faq-title {
        font-size: 150%;
        font-weight: bold;
        margin: 50px 0;
    }
    .owner-detail p.comment {
        margin-top: 30px;
    }
    .owner-detail p.comment:before {
        content: "";
        position: absolute;
        top: -16px;
        left: 50%;
        margin-top: 0;
        margin-left: -25px;
        display: block;
        width: 0px;
        height: 0px;
        border-style: solid;
        border-width: 0 16px 16px 16px;
        border-color: transparent transparent #F6F6F6 transparent;
        z-index: 0;
    }
    .owner-detail p.comment:after {
        content: "";
        position: absolute;
        top: -19px;
        left: 50%;
        margin-top: 0;
        margin-left: -28px;
        display: block;
        width: 0px;
        height: 0px;
        border-style: solid;
        border-width: 0 19px 19px 19px;
        border-color: transparent transparent #898989 transparent;
        z-index: -1;
    }
    .evaluation {
        padding: 10px;
    }
    .ev-title {
        margin-bottom: 10px;
    }
    .evaluation-star {
        text-align: center;
        font-size: 150%;
    }
    .ev-count {
        text-align: center;
        font-size: 200%;
    }
    .owner-detail .infomation th, .owner-detail .infomation td {
        width: 100%;
        display: block;
    }
    .owner-detail .infomation td {
        border-right: none;
        border-bottom: 2px solid #898989;
    }
    .owner-detail .infomation tr {
        border-bottom: none;
    }
    .owner-detail .infomation table {
        border-bottom: none;
    }
    .rate-box .name {
        width: 100%;
        text-align: center;
    }
    .rate-detail-star {
        width: 100%;
        text-align: center;
    }
    .rate-box .ev-count {
        width: 100%;
        margin-bottom: 10px;
    }
    .faq-title span {
        display: block;
        margin-bottom: 10px;
    }
    .faq-title span.no {
        display: none;
    }
    /* Howse it.について */
    .about-title {
        width: 80%;
        margin: 20px auto;
    }
    .contents {
        width: 90%;
    }
    .about-body h1 {
        font-size: 25px;
    }
    .about-body {
        position: relative;
        top: -80px;
    }
    hr.dotted-line {
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .about-body p:last-child {
        margin-bottom: 0;
    }
    .about-box {
        width: 100%;
    }
    .about-box p.title {
        font-size: 120%;
    }
    .about-box p.link {
        width: 80%;
        font-size: 100%;
    }
    .about-box p.body {
        margin-bottom: 30px;
    }
    .about-box.last {
        margin-bottom: 50px;
    }
    /* よくある質問 */
    .faq-box .question {
        font-size: 120%;
    }
    /* 会社概要 */
    .about-body.company table {
        width: 100%;
    }
    .about-body.company th {
        width: 5em;
    }
    .about-body.company th, .about-body.company td {
        font-size: 110%;
    }
    td.spacer {
        width: 2em;
    }
    /* 問い合わせ関連 */
    .contact-form table {
        table-layout: fixed;
    }
    .contact-form th, .contact-form td {
        width: 100%;
        display: block;
    }
    .contact-form th {
        text-align: left;
        padding: 0;
    }
    .contact-form td.spacer {
        display: none;
    }
    .contact-form td {
        width: 96%;
        margin-left: auto;
    }
    .contact-form td.first-kana, .contact-form td.last-kana {
        width: 92%;
    }
    .form-control.name {
        width: 100%;
    }
    .contact-form tr {
        display: block;
        margin-bottom: 15px;
    }
    .contact-form td.no-before {
        width: 100%;
        padding: 5px 0;
    }
    .contact-form td.no-before input, .contact-form td.no-before textarea {
        width: 100%;
    }
    .contact-form tr.postcode-row {
        margin-bottom: 0;
    }
    .contact-form tr.address-row th {
        display: none;
    }
    .contact-form tr.address-row td.no-before {
        width: 92%;
    }
    .contact-form .submit-area .btn {
        width: 150px;
    }
    .contact .form-check-body th, .contact .form-check-body td {
        display: block;
        width: 100%;
        text-align: center;
    }
    .contact .form-check-body th {
        padding: 0;
    }
    .contact .form-check-body td {
        padding: 5px 0 10px 0;
    }
    .contact .form-check-body tr {
        margin-bottom: 15px;
    }
    .contact p.description {
        line-height: 2;
    }
    /* そのた */
    .login-box.complete {
        width: 80%;
    }
    /* フッター関連 */
    .footer .contents a {
        font-size: 90%;
    }
    .f-menu {
        width: 94%;
        margin: 30px auto;
    }
    .f-menu a {
        font-size: 90%;
        color: #000;
        width: 100%;
    }
    .result-list {
        width: 100%;
    }
    .result-map {
        position: relative;
        width: 100%;
        left: 0;
    }
    .result-list .area {
        padding: 25px 3%;
    }
    .result-list .floor {
        padding: 20px 0 20px 3%;
        margin-right: -5%;
    }
    .f-logo {
        width: 40%;
    }
    .select-type-wrap .rent-wrap, .select-type-wrap .sell-wrap {
        text-align: center;
        padding-right: 15px;
        padding-left: 15px;
    }
    .select-type-wrap a.to-rent, .select-type-wrap a.to-sell {
        width: 80%;
        margin-bottom: 30px;
    }
    .link-info-wrap th, .link-info-wrap td {
        display: block;
        width: 100%;
    }
    .link-info-wrap th {
        background-color: #ddd;
    }
    p.privacy-main.alt-box {
        display: none;
    }
}

@media screen and (max-width: 480px){
    /* フッター関連 */
    .footer .contents {
        width: 100%;
    }
    .f-menu a {
        font-size: x-small;
    }
}