@charset "utf-8";
/* MV（ページごとに変更）
========================== */
.c-submv.albion-mv::after{
    background-image: url(../img/products_albion/mv.jpg);
}
.c-submv.ignis-mv::after{
    background-image: url(../img/products_ignis/mv.jpg);
}
.c-submv.ignisio-mv::after{
    background-image: url(../img/products_ignisio/mv.jpg);
}
.c-submv.elegance-mv::after{
    background-image: url(../img/products_elegance/mv.jpg);
}

.products{
    padding-top: 10rem;
}

.products .inner{
    display: flex;
    flex-direction: column;
    gap: 8rem;
}

.products__ttl{
    font-size: 3rem;
    line-height: 1;
    display: flex;
    align-items: center;
    gap: 5rem;
}

.products__ttl::after{
    content: '';
    flex: 0 0 10rem;
    height: 1px;
    background: #a0b2c7;
}

.products__list{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 5rem;
}

.products__list-item{
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    line-height: 1.6;
}

.products__list-item .pic img{
    width: 100%;
}

.products__list-item-txtbox{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.products__list-item .cate{
    font-size: 1.6rem;
    display: flex;
    align-items: center;
    gap: .5rem;
}

.products__list-item .cate::before{
    content: '●';
    font-size: 1rem;
    color: #a0b2c7;
}

.products__list-item .price{
    font-weight: 300;
}

.products__list-item .tax{
    font-size: 1.2rem;
}

.products .c-btn{
    margin: auto;
}

@media only screen and (max-width: 1024px) {
    .products{
        padding-top: 8rem;
    }

    .products .inner {
        gap: 2.5rem;
    }

    .products__ttl{
        font-size: 2.6rem;
        gap: 2.5rem;
        margin-bottom: calc(8rem - 2.5rem);
    }

    .products__list{
        gap: 2.5rem;
        grid-template-columns: repeat(2,1fr);
    }

    .products .c-btn{
        margin-top: calc(8rem - 2.5rem);
    }
}