@charset "UTF-8";

@media (max-width: 1000px) {
    #section01 .group > div > .item {
        padding: 3rem 2rem;
    }
    #section01 .group .right .item p br {
        display: none;
    }
    #section01 .group .right .item.bottom::before {
        left: 2rem;
    }
    #section01 .group .right .item.bottom .txt {
        padding-left: 13.4rem;
    }
}

@media (max-width: 768px) {
    #section01 .group .right .item.top::after {
        right: 4rem;
        bottom: 2rem;
    }
    #section01 .group .right .item.bottom::before {
        width: 20%;
        height: 100%;
        background-size: 100%;
        left: 2rem;
    }
    #section01 .group .right .item.bottom .txt {
        padding-left: 30%;
    }
    #section01 .group .left .date .date_item button {
        width: 3rem;
        height: 3rem;
    }
    #section01 .group .left .date .date_item p {
        font-size: 2.4rem;
        margin: 0 1rem;
    }
}

@media (max-width: 520px) {
    #section01 .group {
        display: block;
        width: 100%;
        margin: 0;
        padding: 2rem 0;
    }
    #section01 .group > div {
        display: block;
        width: 100% !important;
        margin-bottom: 2rem;
        padding: 0;
    }
    #section01 .group .right .item.top::after {
        width: 17rem;
        right: 2rem;
        bottom: 1rem;
    }
    #section01 .group .right .item.top {
        padding-bottom: 10rem;
    }
    #section01 .group .right .item.bottom::before {
        display: block;
        position: relative;
        width: 8rem;
        height: 12.1rem;
        left: inherit;
        background-size: cover;
        top: inherit;
        transform: none;
        margin: 0 auto 2rem;
    }
    #section01 .group .right .item.bottom .txt {
        text-align: center;
        padding-left: 0;
    }
}