.sparkle_2 {
    position: absolute;
    width: 4.5rem;
    top: 28rem;
    left: 66rem;
    transform: rotate(15deg);
}

.mockup_img {
    position: static;
    width: 30.9375rem;
    transform: translateX(32px);
}


.mockup_text {
    height: auto;
}

.mockup_detail_img {
    border-radius: 0;
}

.mockup_contents_detail_img {
    margin: 8rem auto;
    width: 45rem;
}

.sparkle_3 {
    position: absolute;
    width: 5rem;
    top: -4rem;
    left: 67rem;
    transform: rotate(-15deg);
}

.mockup_contents {
    margin: 0 6rem;
}



.dot_orange {
    position: absolute;
    top: 7rem;
    left: 70.5rem;
    width: 14rem;
}

.dot_orange_4 {
    position: absolute;
    top: 46rem;
    left: 66rem;
    width: 12rem;
}

.subtitle_bg_1 {
    width: 378px;
}

.subtitle_bg_2 {
    width: 447px;
}

.description_items {
    margin: 0rem auto 16rem;
}

.url_description {
    display: none;
}

.mockup_contents {
    display: flex;
}

.mockup_img_div {
    width: -webkit-fill-available;
    margin: 0 3rem;
}

.works_detail_text_div {
    margin-top: 17rem;
    width: -webkit-fill-available;
}

.design_sp_img {
    border: none;
}

.design_pc_img {
    border: none;
}

.dot_orange_3 {
    position: absolute;
    top: 168rem;
    left: -1rem;
    width: 14rem;
}

@media screen and (max-width:767px) {
    .mockup_img {
        position: static;
        max-width: -webkit-fill-available;
        width: 30.9375rem;
        margin: 0 auto;
    }

    .mockup_contents {
        width: auto;
        flex-direction: column-reverse;
        margin: 0 1.6875rem 0;
    }

    .mockup_img_div {
        width: 14rem;
        margin: 2rem auto;
    }

    .mockup_contents_detail_img {
        margin: 5.5rem 1.6875rem;
        width: auto;
    }

    .description_items {
        margin: 0rem auto 9rem;
    }

    .works_detail_text_div {
        margin-top: 0rem;
    }

    .mockup_img {
        transform: translateX(0);
    }

    .dot_orange {
        position: absolute;
        top: -11rem;
        left: 14rem;
        width: 12rem;
    }

    .dot_orange_2 {
        position: absolute;
        top: 16rem;
        left: 0.5rem;
        width: 12rem;
    }

    .dot_orange_3 {
        position: absolute;
        top: 75rem;
        left: 16rem;
        width: 9rem;
    }

    .dot_orange_4 {
        position: absolute;
        top: 178rem;
        left: -2rem;
        width: 8rem;
    }

    .sparkle_1 {
        position: absolute;
        width: 2.3rem;
        top: 23.5rem;
        left: 3.3rem;
        transform: rotate(15deg);
    }

    .sparkle_2 {
        position: absolute;
        width: 3rem;
        top: -3.9rem;
        left: 16rem;
        transform: rotate(15deg);
    }



}