@charset "UTF-8";

html {
    scroll-behavior: smooth;
}

body {
    font-family: Quicksand, 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

main {
    display: block;
}

li {
    list-style: none;
}

.ul-2columns {
    list-style: none;
    display: flex !important;
    justify-content: space-between;
    margin: 0 auto 30px;
    padding: 0;
}

.ul-2columns li {
    width: 48% !important;
    margin: 0;
    padding: 0;
}

.ul-3columns {
    list-style: none;
    display: flex !important;
    justify-content: space-between;
    margin: 0 auto 30px;
    padding: 0;
}

.ul-3columns li {
    width: 32% !important;
    margin: 0;
    padding: 0;
}

.ul-4columns {
    list-style: none;
    display: flex !important;
    justify-content: space-between;
    margin: 0 auto 30px;
    padding: 0;
    flex-wrap: wrap;
}

.ul-4columns li {
    width: 24% !important;
    margin: 0 0 40px 0;
    padding: 0;
    line-height: 0 !important;
}

.ul-4columns li img {
    margin: 0;
    padding: 0;
    line-height: 0 !important;
    vertical-align: bottom;
}

.ul-4columns002 {
    list-style: none;
    display: flex !important;
    justify-content: flex-start;
    margin: 0 auto 30px;
    padding: 0;
    flex-wrap: wrap;
}

.ul-4columns002 li {
    width: 24% !important;
    margin: 0 20px 40px 0;
    padding: 0;
    line-height: 0 !important;
}

.ul-4columns002 li img {
    margin: 0;
    padding: 0;
    line-height: 0 !important;
    vertical-align: bottom;
}

.ul-5columns {
    list-style: none;
    display: flex !important;
    justify-content: space-between;
    margin: 0 auto 30px;
    padding: 0;
}

.ul-5columns li {
    width: 19% !important;
    margin: 0;
    padding: 0;
}

.mb0 {
    margin-bottom: 0 !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mb60 {
    margin-bottom: 60px !important;
}

/*------------------------------------------------------------------------------スマホ用CSS--------------------------------------------------------------------------------------------------*/

@media screen and (max-width:768px) {
    
    .forpc {
        display: none;
    }
    
    #footerlogo {
        float: none;
        text-align: center;
    }

    #footercopy {
        float: none;
        margin: 20px auto;
        text-align: center;
    }

    #footer-sns {
        float: none;
        margin: 0 auto;
        text-align: center;
    }

    #footer-sp {
        width: 100%;
        margin: 0 auto 30px;
        text-align: center;
    }

    .footer-sp-p img {
        margin: 0 auto 10px;
        padding: 0;
        max-width: 90% !important;
    }

    #copybox p {
        font-size: 80%;
    }

    .ul-2columns {
        display: block !important;
        list-style: none;
        margin: 0 auto;
        padding: 0;
    }

    .ul-2columns li {
        width: 100% !important;
        margin: 0 auto 30px auto;
        padding: 0;
    }

    .ul-3columns {
        display: block !important;
        list-style: none;
        margin: 0 auto;
        padding: 0;
    }

    .ul-3columns li {
        width: 100% !important;
        margin: 0 auto 30px auto;
        padding: 0;
    }

    .ul-4columns {
        width: 90% !important;
        list-style: none;
        margin: 0 auto;
        padding: 0;
    }

    .ul-4columns li {
        width: 48% !important;
        margin: 0 0 40px 0;
        padding: 0;
        line-height: 0 !important;
    }

    .ul-4columns002 {
        justify-content: space-between;
        width: 90% !important;
        list-style: none;
        margin: 0 auto;
        padding: 0;
    }

    .ul-4columns002 li {
        width: 48% !important;
        margin: 0 0 40px 0;
        padding: 0;
        line-height: 0 !important;
    }

    .ul-5columns {
        display: block !important;
        list-style: none;
        margin: 0 auto;
        padding: 0;
    }

    .ul-5columns li {
        width: 100% !important;
        margin: 0 auto 30px auto;
        padding: 0;
    }

}

/*------------------------------------------------------------------------------769PX以上--------------------------------------------------------------------------------------------------*/


@media screen and (min-width:769px) {

    #footer-sp {
        display: none;
    }

    .forsp {
        display: none;
    }
    
}