@charset "utf-8";
/* Heading */
.heading .img{position: relative;}
.heading .img.animalfree::before{content: ""; position: absolute; top: 0; left: 0; width: min(17vw,105px); height: min(14.6vw,90px); background: url("../img/common/ic-animalfree.png") no-repeat top left/100% auto; display: block; z-index: 1; line-height: 1;}

@media screen and (min-width: 769px) {
    .heading {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 120px 0;
        align-items: center;
    }

    .heading .img {
        width: 49.24%;
    }

    .heading .inner {
        width: 44.46%;
        margin: 30px 0 0 0;
    }

    .heading .cate {
        font-size: 2rem;
        line-height: 1.2;
        margin: 0 0 8px;
    }

    .heading .tit {
        font-size: 5rem;
        line-height: 1.2;
        margin: 0 0 30px;
    }

    .imgPG {
        max-width: 450px;
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 768px) {
    .heading {
        padding: 60px 0;
    }

    .heading .img {
        width: 85%;
        max-width: 500px;
        margin: 0 auto 30px;
    }

    .heading .cate {
        font-size: 1.8rem;
        line-height: 1.2;
        margin: 0 0 5px;
    }

    .heading .tit {
        font-size: min(10vw, 4rem);
        line-height: 1.2;
        margin: 0 0 20px;
    }

    .imgPG {
        max-width: 70%;
        margin: 0 auto 30px;
    }
}

/* Howto */
.howto-txt {
    font-size: 2.6rem;
    line-height: 1.925;
    text-decoration: underline;
    text-underline-offset: 0.1em;
    margin: 0 0 40px;
}

@media screen and (min-width: 769px) {
    .howto {
        margin: 0 0 120px;
    }

    .howto-box {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .howto-item {
        width: 28%;
        margin: 0 2.667% 40px;
    }

    .howto-item .img {
        text-align: center;
        margin: 0 0 20px;
    }
}

@media screen and (max-width: 768px) {
    .howto {
        margin: 0 0 60px;
    }

    .howto-item {
        margin: 0 0 30px;
    }

    .howto-txt {
        font-size: 2.2rem;
    }

    .howto-item .img {
        text-align: center;
        margin: 0 0 10px;
    }
}

/* Product */
.detail:not(:last-of-type) {
    margin: 0 0 80px;
}

.detail-tit {
    font-size: 2rem;
    line-height: 1.2;
    margin: 0 0 20px;
}

.detail-tit span {
    font-size: 1.4rem;
    margin: 0 0 0 1em;
}

.detail-tit sup {
    font-size: 1em;
}

.detail-tbl .list li{
    margin-left: 0.6em;
    text-indent: -0.6em;
}

@media screen and (max-width: 768px) {
    .detail-tit span {
        display: block;
        margin: 3px 0 0 0;
    }
}

@media screen and (min-width: 769px) {
    .detail-tbl {
        width: 100%;
        border-top: 1px solid #fff;
    }

    .detail-tbl th,
    .detail-tbl td {
        border-bottom: 1px solid #fff;
        vertical-align: top;
    }

    .detail-tbl th {
        width: 210px;
        padding: 13px 0 13px 15px;
    }

    .detail-tbl td {
        padding: 13px 0;
    }
}

@media screen and (max-width: 768px) {
    .detail-tbl,
    .detail-tbl tbody,
    .detail-tbl tr,
    .detail-tbl th,
    .detail-tbl td {
        display: block;
        width: 100%;
    }

    .detail-tbl {
        border-top: 1px solid #fff;
    }

    .detail-tbl th {
        padding: 15px 0 0 0;
    }

    .detail-tbl td {
        border-bottom: 1px solid #fff;
        padding: 0 0 15px;
    }
}
