// Cover your area
.cover-your-wrap {
    position: relative;
    z-index: 0;
    .shape {
        position: absolute;
        top: 0;
        left: 0;
        width: 50%;
        height: 100%;
        border-radius: 20px;
        background-color: rgb(243, 247, 255);
        &.style-01 {
            right: 0;
            top: 0;
            left: initial;
        }
    }
    .shape-02 {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 190px;
        height: 190px;
        border-radius: 50%;
        background-color: #ffd900;
        z-index: -1;
        &.style-01 {
            right: initial;
            left: 0;
        }
    }
    @keyframes shape-anmi {
        0% {
            border-radius: 57% 24% 71% 16% / 55% 15% 73% 27%;
        }
        25% {
            border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
        }
        50% {
            border-radius: 69% 31% 49% 51% / 60% 36% 64% 40%;
        }
        75% {
            border-radius: 69% 31% 49% 51% / 60% 36% 64% 40%;
        }
        100% {
            border-radius: 57% 24% 71% 16% / 55% 15% 73% 27%;
        }
    }
    .cover-img {
        &.bg-image {
            padding-top: 120px;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: right;
            min-height: 450px;
            width: 100%;
            &.style-01 {
                min-height: 330px;
            }
        }
        &.bg-image-02 {
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            min-height: 450px;
            width: 100%;
            &.style-01 {
                min-height: 330px;
            }
        }
    }
}