@charset "UTF-8";

@media (max-width: 768px) {

    ul {
        padding-left: 30px;
    }

    nav {
        display: none;
    }

    header {
        background: url(images/bg_top.jpg) no-repeat 0 0;
        background-size: cover;
        padding-bottom: 10px;
    }

    header h1 {
        margin: 0;
        padding: 10px;
    }

    header h2 {
        text-align: right;
        margin-right: 20px;
    }

    /* ---------------------------
    CONTENTS
----------------------------- */


    #concept,
    #business,
    #member,
    #blog,
    #aboutus {
        margin: 80px 0;
    }

    h3 {
        padding: 0 20px;
    }


    #concept {
        margin-bottom: 40px;
    }

    #concept h3 img {
        width: 210px;
    }

    #business h3 img {
        width: 300px;
    }

    #aboutus h3 img {
        width: 250px;
    }

    #blog h3 img,
    #member h3 img {
        max-width: 100%;
    }


    /* ---------------------------
    CONCEPT
----------------------------- */


    #concept .detail {
        padding: 20px;
    }

    #concept .detail h4 {
        text-align: center;
    }

    .concept_bg img {
        width: 100%;
    }



    /* ---------------------------
    BUSINESS
----------------------------- */

    .business_detail {
        padding: 20px;
    }

    .business_detail img {
        width: 100%;
        height: auto;
    }

    .business_detail h4 {
        font-size: 20px;
        background: url(images/bg_ttl_left.png) no-repeat 0 0;
        background-size: 20px;
        padding: 10px;
        text-align: center;
        position: relative;
    }

    .business_detail h4:after {
        content: '';
        display: block;
        height: 100%;
        width: 20px;
        background: url(images/bg_ttl_right.png) no-repeat 100% 100%;
        background-size: 20px;
        position: absolute;
        right: 0;
        bottom: 0;
    }

    .results {
        width: 90%;
        border: 4px solid #e50000;
        border-spacing: 10px;
        margin: 0 auto 40px;
    }

    .results th,
    .results td {
        display: block;
    }

    .results th {
        font-size: 20px;
        padding-bottom: 10px;
        display: block;
        width: 100%;
        text-align: center;
        font-weight: bold;
        border-bottom: 4px solid #e50000;
        color: #e50000;
    }


    /* ---------------------------
    MEMBER
----------------------------- */

    .member_detail {
        padding: 20px;
    }

    .member_detail .detail {
        margin-bottom: 40px;
    }

    .member_detail img {
        display: block;
        margin: 20px auto;
    }

    .member_detail h4 {
        font-size: 130%;
        text-align: center;
    }

    .member_detail h4 span {
        font-size: 80%;
        margin-right: 10px;
    }


    #member a img {
        display: none;
    }

    #member a {
        display: block;
        width: 80%;
        margin: 0 auto;
        padding: 15px 10px;
        text-align: center;
        background: #fff;
        border: 4px solid #e50000;
        font-size: 18px;
        color: #e50000;
        border-radius: 100px;
        font-weight: bold;
    }

    #member a:before {
        content: "お気軽にご相談ください"
    }


    /* ---------------------------
    BLOG
----------------------------- */
    .blog_detail {
        padding: 0 10px 10px;
        max-width: 500px;
        margin: 0 auto;
    }

    #blog p {
        text-align: center;
    }




    /* ---------------------------
    ABOUT US
----------------------------- */

    #aboutus {
        margin-bottom: 0;
    }

    #aboutus h4 {
        font-size: 16px;
        text-align: center;
    }

    #aboutus h4 span,
    #aboutus table span {
        font-size: 13px;
        display: block;
        margin-top: 10px;
    }

    #aboutus table,
    #aboutus table tr,
    #aboutus table th,
    #aboutus table td {
        display: block;
        border-collapse: collapse;
    }

    #aboutus th,
    #aboutus td {
        border-bottom: 4px solid #fff;
        padding: 20px;
    }

    #aboutus table {
        margin: 20px;
    }

    #aboutus table th {
        font-size: 15px;
    }

    .aboutus_detail p {
        margin: 0 20px 40px;
    }

    .fb_iframe_widget_fluid {
        display: block !important;
        width: 300px !important;
        margin: 0 auto;
    }

    /* ---------------------------
    ACCESS
----------------------------- */

    .access_detail {
        padding: 20px;
        text-align: center;
    }

    .access_detail h3 {
        text-align: left;
        margin-left: -20px;
    }

    #access iframe {
        vertical-align: middle;
    }

    /* ---------------------------
    FOOTER
----------------------------- */

    footer {
        background: #fff;
        padding: 20px;
    }

    footer h4 {
        text-align: center;
    }


    .contact h3 {
        margin-top: 20px;
    }

    .form {
        padding: 20px;
    }

    .contact textarea,
    .contact input {
        border-radius: 0;
        width: 100%;
        box-shadow: none;
    }

    .contact_tel {
        margin-top: 10px;
    }

    .sp {
        display: block;
    }


}