@charset "UTF-8";

h2
{
    display: block;
    width: 526.28px;
    height: 49px;
    margin: 85px auto 0;
    background-image: url(../img/common/h2.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center bottom;
    text-align: center;
    font-size: 2.6rem;
    font-family: 'Shippori Mincho B1', serif;
    font-weight: 600;
}

@media screen and (max-width: 900px)
{
    h2
    {
        width: 80%;
        height: 31px;
        margin: 65px auto 0;
        font-size: 2.2rem;
    }
}

/*
--------------------------------*/
.wrap
{
    padding-bottom: 200px;
}

h3
{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 7rem;
    font-size: 1.8rem;
    color: #fff;
    background: #000;
    margin-bottom: 30px;
}

section
{
    width: 100%;
    margin: 40px auto 0;
}

.hr-gd
{
    border-top: 2px solid #98801C;
    margin: 2rem 0;
}


/*業務用・小売用商品はここから*/

ul
{
    list-style: none;
}

.list-box
{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    row-gap: 1%;
    gap: 2%;
}

.list-item
{
    color: #050505;
}

.list-item img
{
    width: 100%;
}

.list-item h4
{
    font-size: 1.5rem;
    font-weight: 600;
    margin-top: 1rem;
}

.list-item p
{
    font-size: 1.5rem;
    margin-top: 1rem;
    line-height: 2.0rem;
}

@media screen and (max-width: 900px)
{
    h3
    {
        font-size: 1.6rem;
        height: 4rem;
        margin-bottom: 15px;
    }

    .list-box
    {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 2%;
    }

    .list-box.btb
    {
        gap: 4% 2%;
    }

    .list-box.btc
    {
        gap: 1% 2%;
    }

    .list-item h4,
    .list-item p
    {
        font-size: 1.4rem;
    }

    .list-item p
    {
        line-height: 1.6rem;
        margin-top: 0.5em;
    }

    .wrap
    {
        padding-bottom: 400px;
    }
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc
{
    display: block !important;
}

.sp
{
    display: none !important;
}

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 900px)
{
    .pc
    {
        display: none !important;
    }

    .sp
    {
        display: block !important;
    }
}