@charset "UTF-8";

body {
    margin: 0;
    padding: 0;
}

#contents_block {
    margin: 0;
    padding: 0;
}


#contents_block h1,
#contents_block h2,
#contents_block p,
#contents_block img {
    margin: 0;
    padding: 0;
}


img {
    border: none;
}

#contents_block .clearfix:after {
    display: block;
    clear: both;
    content: "";
}


#contents_block .header_menu {
    background-color: #660000;
    height: 60px;
    border-bottom: 2px solid #FFF;
}

#contents_block .footer_menu {
    background-color: #660000;
    height: 60px;
    border-top: 2px solid #FFF;
}


#contents_block .header_menu ul,
#contents_block .footer_menu ul {
    width: 982px;
    display: table;
    table-layout: fixed;
    text-align: center;
    margin: 0 auto;
    padding: 0;
}


#contents_block .header_menu li,
#contents_block .footer_menu li {
    height: 60px;
    display: table-cell;
    vertical-align: middle;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

#contents_block .header_menu li a,
#contents_block .footer_menu li a {
    height: 60px;
    display: table-cell;
    vertical-align: middle;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    background-image: url(../img/18_about_menu.jpg);
}


#contents_block li.menu_01 a {
    width: 245px;
    background-position: 0px 0px;
}

#contents_block li.menu_01 a:hover,
#contents_block li.menu_01 a.mark {
    background-position: 0px 60px;
}


#contents_block li.menu_02 a {
    width: 245px;
    background-position: -245px 0px;
}

#contents_block li.menu_02 a:hover,
#contents_block li.menu_02 a.mark {
    background-position: -245px 60px;
}

#contents_block li.menu_03 a {
    width: 245px;
    background-position: -490px 0px;
}

#contents_block li.menu_03 a:hover,
#contents_block li.menu_03 a.mark {
    background-position: -490px 60px;
}

#contents_block li.menu_04 a {
    width: 245px;
    background-position: -735px 0px;
}

#contents_block li.menu_04 a:hover,
#contents_block li.menu_04 a.mark {
    background-position: -735px 60px;
}



/* smartPhone */
@media screen and (max-width: 640px) {
    #contents_block .header_menu {
        background-color: #660000;
        height: auto;
        border-bottom: none;
    }

    #contents_block .footer_menu {
        background-color: #660000;
        height: auto;
        border-bottom: none;
    }



    #contents_block .header_menu ul,
    #contents_block .footer_menu ul {
        width: 100%;
        text-align: center;
        margin: 0 auto;
        padding: 0;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }

    #contents_block .header_menu li,
    #contents_block .footer_menu li {
        width: 50%;
        height: 12vw;
        float: left;
        display: block;
        text-indent: 100%;
        border-bottom: 2px solid #FFF;
    }

    #contents_block .header_menu li a,
    #contents_block .footer_menu li a {
        display: block;
        vertical-align: middle;
        text-indent: 100%;
        overflow: hidden;
        background-image: url(../img/18_about_menu_sp.jpg);
        background-repeat: no-repeat;
        background-position: top left;
        background-size: 400% ;

    }


    #contents_block li.menu_01 a,
    #contents_block li.menu_01 a:hover {
        width: 100%;
        background-position: 0px 0px;
    }

    #contents_block li.menu_01 a.mark {
        background-position: -0px -14.1vw;
    }


    #contents_block li.menu_02 a,
    #contents_block li.menu_02 a:hover {
        width: 100%;
        background-position: -50vw 0px;
    }

    #contents_block li.menu_02 a.mark {
        background-position: -50vw -14.1vw;
    }

    #contents_block li.menu_03 a,
    #contents_block li.menu_03 a:hover {
        width: 100%;
        background-position: -100vw 0px;
    }

    #contents_block li.menu_03 a.mark {
        background-position: -100vw -14.1vw;
    }

    #contents_block li.menu_04 a,
    #contents_block li.menu_04 a:hover {
        width: 100%;
        background-position: -150vw 0px;
    }

    #contents_block li.menu_04 a.mark {
        background-position: -150vw -14.1vw;
    }


}

/* smartPhone END */