@charset "UTF-8";
.clearfix {
    content: "";
    clear: both;
    display: block;
}

/* --------------------------------------------------
　Start Occ
-------------------------------------------------- */

#searchResultBlc ul.result .category {
    padding: 10px 0 5px;
}

#searchResultBlc ul.result li .category dt {
    float: left;
    box-sizing: border-box;
    width: 48%;
    margin: 0 0 5px 2%;
    padding: 3px 1px 2px;
    text-align: center;
    color: #fff;
    font-size: 90%;
    letter-spacing: 0;
}

#searchResultBlc ul.result li .category dt:nth-of-type(odd) {
    clear: both;
    margin: 0 0 5px 0;
}

#searchResultBlc ul.result li .category dt.CFA {
    background: #d12b2b;
}

#searchResultBlc ul.result li .category dt.CTA {
    background: #f39a00;
}

#searchResultBlc ul.result li .category dt.SILC {
    background: #31c264;
}

#searchResultBlc ul.result li .category dt.AS {
    background: #90c529;
}

#searchResultBlc ul.result li .category dt.phone {
    background: #d24ec1;
}

#searchResultBlc ul.result li .category dt.lan {
    background: #e66221;
}

#searchResultBlc ul.result li .category dt.air {
    background: #14abf9;
}

#searchResultBlc ul.result li .category dt.fax {
    background: #333ecc;
}

/* --------------------------------------------------
　End Occ
-------------------------------------------------- */

#ul_postcompany_default {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

#ul_postcompany_default li {
    display: none;
}

#loadmore {
    text-align: center
}

#loadmore .button {
    background: #91c11d;
    border: 0;
    color: #fff;
    padding: 10px 20px;
    border-radius: 3px;
    min-width: 150px;
    cursor: pointer;
    margin: 0 15px;
}

#loadmore .button:hover {
    transition: all 0.4s;
    background: rgba(1, 88, 162, 0.7);
}

/* --------------------------------------------------
　掲載企業一覧
-------------------------------------------------- */

/* 地域を絞って検索する --------------- */

#searchBlc {
    margin: 0px 0px 50px;
    background: #eee9e5;
    padding: 0px 0px 7px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    display: block;
}

#searchBlc .search {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    box-sizing: border-box;
}

#searchBlc>h1 {
    background: #402c1a;
    padding: 15px 20px 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    text-align: center;
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
}

#searchBlc>.inner {
    background: #fff;
    margin: 0px 7px 0px;
    padding: 25px 25px 15px;
}

#searchBlc .inner>.attention {
    font-size: 14px;
    color: #fa6668;
    padding: 0px 0px 15px;
}

#searchBlc ul.search li {
    width: calc(33.33% - 22px);
    margin: 0px 22px 17px 0px;
}

#searchBlc ul.search li:nth-of-type(3n) {
    margin: 0px 0px 17px 0px;
}

#searchBlc ul.search li .title {
    font-weight: bold;
    font-size: 15px;
}

#searchBlc ul.search li .detail {
    font-size: 12px;
    color: #888;
    padding: 3px 0px 0px 10px;
    line-height: 120%;
}

/* 都道府県を絞って検索するボタン */

#changeSearchBtn {
    background: -moz-linear-gradient(center top, #bfdd3a 0%, #9cb722 100%);
    background: -webkit-gradient(linear, center top, center bottom, from(#bfdd3a), to(#9cb722));
    background: linear-gradient(center top, #bfdd3a 0%, #9cb722 100%);
    border-radius: 3px;
    margin: 20px 7px 20px;
}

#changeSearchBtn a {
    display: block;
    text-decoration: none;
    background: url(../img/common/icn_arrow.png) 95% 50% no-repeat;
    padding: 15px 10px 15px;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
    color: #fff;
}

/* 登録企業一覧 */

#searchResultBlc h1 {
    background: -moz-linear-gradient(center top, #ffffff 0%, #EFEFEF 100%);
    background: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#EFEFEF));
    background: linear-gradient(center top, #ffffff 0%, #EFEFEF 100%);
    padding: 15px 10px 15px;
    margin: 10px 7px 0px;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
}

#searchResultBlc .inner {
    background: #fff;
    margin: 0px 7px 7px;
    padding: 10px 0px 15px;
}

#searchResultBlc .inner .pager {
    margin: 20px 0px 0px;
    text-align: center;
}

#searchResultBlc .inner .pager a {
    color: #007ce6;
}

#searchResultBlc ul.result li .company {
    font-size: 120%;
    background: #402c1a;
    color: #fff;
    padding: 7px 15px;
    margin: 0px 0px 15px;
    font-weight: bold;
}

#searchResultBlc ul.result li {
    margin: 0px 0px 15px;
    padding: 10px 7px 15px;
    border-bottom: #eee9e5 solid 1px;
    width: 100%;
}

#searchResultBlc ul.result li .img {
    float: left;
    width: 23%;
    margin: 0px 15px 7px 0px;
}

#searchResultBlc ul.result li .img img {
    width: 100%;
}

#searchResultBlc ul.result li .detail {
    float: right;
    width: 30%;
    margin: 0px 0px 7px 12px;
    padding: 5px 5px 5px;
    background: #eee9e5;
    box-sizing: border-box;
}

#searchResultBlc ul.result li .detail .heading {
    padding: 7px 10px;
    margin: 0px 0px 5px;
    background: #fff;
    font-weight: bold;
}

#searchResultBlc ul.result li .detail .heading:nth-of-type(2) {
    margin: 7px 0px;
}

#searchResultBlc ul.result li .detail p {
    padding: 0px 7px 0px;
}

#searchResultBlc ul.result li .detail .btn a {
    display: block;
    text-decoration: none;
    box-sizing: border-box;
    width: 100%;
    background: #fa6567;
    border-radius: 3px;
    margin: 7px 0px 0px;
    padding: 7px 10px;
    text-align: center;
    color: #ffffff;
}

#searchResultBlc ul.result li .detail .btn a:hover {
    opacity: 0.7;
    transition: all 0.4s;
}

#result_postcompany .result {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

/* Form --------------- */

#postcompany-province #search-province {
    padding: 20px 20px 20px;
}

#postcompany-province #search-province select {
    box-sizing: border-box;
    margin: 0 2% 0 0;
    padding: 10px;
    width: 28%;
}

#postcompany-province #search-province #text_search {
    box-sizing: border-box;
    margin: 0 2% 0 0;
    padding: 10px;
    width: 48%;
}

#postcompany-province #search-province #btsearch {
    box-sizing: border-box;
    margin: 0 0 0 0;
    padding: 10px;
    width: 15%;
}

/*
 |?*******************************************************************************************?*
 | max-width:1000px
 |?*******************************************************************************************?*
*/

@media screen and (max-width: 1000px) {
    #searchBlc {
        margin: 0px 0px 30px;
    }
}

@media screen and (max-width: 767px) {
    #searchBlc {
        margin-bottom: 4%;
    }
}

/*
 |?*******************************************************************************************?*
 | max-width:700px
 |?*******************************************************************************************?*
*/

@media screen and (max-width:700px) {
    /* 地域を絞って検索する --------------- */
    #searchBlc ul.search li:nth-of-type(3n) {
        margin: 0px;
    }
    #searchBlc ul.search li:nth-of-type(3n+1) {
        clear: none;
    }
    #searchBlc ul.search li:nth-of-type(odd) {
        clear: both;
        float: left;
        width: 47%;
        margin: 0px 0px 15px;
    }
    #searchBlc ul.search li:nth-of-type(even) {
        float: right;
        width: 47%;
        margin: 0px 0px 15px;
    }
}

/*
 |?*******************************************************************************************?*
 | max-width:640px
 |?*******************************************************************************************?*
*/

@media screen and (max-width:640px) {
    /* 地域を絞って検索する --------------- */
    #searchBlc>h1 {
        font-size: 130%;
        padding: 10px 10px 10px;
    }
    #searchBlc ul.search li .title {
        font-size: 120%;
    }
    /* 登録企業一覧 */
    #searchResultBlc h1 {
        font-size: 130%;
        padding: 10px 10px 10px;
    }
    #searchResultBlc ul.result li .company {
        font-size: 130%;
        text-align: center;
        padding: 10px 15px;
    }
    #searchResultBlc ul.result li .detail .btn a {
        padding: 5px 10px;
    }
    #searchResultBlc ul.result li .img {
        float: none;
        width: 100%;
        margin: 0px auto 15px;
        text-align: center;
    }
    #searchResultBlc ul.result li .img img {
        width: auto;
        max-width: 100%;
    }
    #searchResultBlc ul.result li .detail {
        float: none;
        width: 100%;
        margin: 0px 0px 15px;
    }
    #searchResultBlc ul.result li .comment {
        clear: both;
        padding: 0 5px;
    }
    /* Form --------------- */
    #postcompany-province #search-province {
        padding: 15px 10px 10px;
    }
    #postcompany-province #search-province select {
        display: block;
        margin: 0 0 10px;
        width: 100%;
    }
    #postcompany-province #search-province #text_search {
        display: block;
        margin: 0 0 10px;
        width: 100%;
    }
    #postcompany-province #search-province #btsearch {
        display: block;
        width: 100%;
    }
}

/*
 |?*******************************************************************************************?*
 | max-width:480px
 |?*******************************************************************************************?*
*/

@media screen and (max-width:480px) {
    /* 地域を絞って検索する --------------- */
    #searchBlc>.inner {
        padding: 15px 15px 15px;
    }
    /* 都道府県を絞って検索するボタン */
    #changeSearchBtn a {
        font-size: 120%;
    }
}

.flexBox {
    display: flex;
}

.flexBox #rightArea {
    width: 20%;
    box-sizing: border-box;
}

.flexBox #leftArea {
    margin-right: 2%;
    width: 80%;
    box-sizing: border-box;
}

@media screen and (max-width:767px) {
    .flexBox {
        flex-wrap: wrap;
    }
    .flexBox #leftArea {
        width: 100%;
        margin-right: 0;
        margin-bottom: 4%;
    }
    .flexBox #rightArea {
        display: flex;
        width: 100%;
        text-align: center;
    }
    .flexBox #rightArea .bnr_side:first-child {
        display: none;
    }
    .flexBox #rightArea .bnr_side {
        margin-right: 4%;
    }
    .flexBox #rightArea .bnr_side:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width:480px) {
    .flexBox #rightArea {
        flex-wrap: wrap;
    }
    .flexBox #rightArea .bnr_side {
        margin-right: 0 !important;
        margin-bottom: 4%;
    }
    .flexBox #rightArea .bnr_side:last-child {
        margin-bottom: 0;
    }
}