@charset "utf-8";



/*
    Modules (sp Header)
*/

@media screen and (max-width: 980px) {

    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    .sp_nav_dummy {
        height: 50px;
    }

    .sp_nav {
        position: fixed;
        z-index: 100;
        top: 0;
        width: 100%;
        background-color: rgba(227, 206, 161, 0.9);
        /* background-color: rgba(255, 255, 255, 0.7); */
        line-height: 50px;
    }

    .sp_nav ul {
        list-style-type: none;
        line-height: inherit;
    }

    .sp_nav li {
        float: left;
        padding: 0 1em;
        line-height: inherit;
        text-align: left;
        box-sizing: border-box;
    }

    .sp_nav li a {
        line-height: inherit;
    }

    .sp_nav li.sp_site_name {
        font-weight: bold;
    }

    .sp_nav li.sp_menu_button {
        float: right;
    }

    .sp_nav li.sp_menu_button a {
        padding: 0.5em 1em;
        border: 1px #666 solid;
        border-radius: 5px;
    }

    .active_toggle_body {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s;
    }

    .active_toggle_body.active {
        max-height: 320px;
        transition: max-height 0.3s;
    }

    .sp_bottom li {
        width: 50%;
        border-bottom: 1px #999 dashed;
    }

    .sp_bottom li a {
        height: 100%;
    }

    .sp_bottom .dobule_width {
        width: 100%;
    }

    .sp_bottom li:nth-child(1),
    .sp_bottom li:nth-child(2) {
        border-top: 1px #999 dashed;
    }

    .sp_bottom li:nth-child(odd) {
        border-right: 1px #999 dashed;
    }

}



@media screen and (max-width: 400px) {

    .sp_bottom .high_height {
        line-height: 60px;
    }

    .sp_bottom .high_height > *,
    .sp_bottom .high_height > * > * {
        display: inline-block;
        line-height: 1.1em;
        vertical-align: middle;
    }

}