.fluid {
    animation: fluidrotate 30s ease 0s infinite;
    /*アニメーションの設定*/
}

/* ========================================
   背景だけのふよふよ
======================================== */

.fluid-bg {
    position: absolute;
    width: 350px;
    height: 350px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;

    animation: fluidrotate 30s ease 0s infinite;
}

.fluid-bg-blue {
    background: #D2E4E6;
}

@keyframes fluidrotate {

    0%,
    100% {
        border-radius: 63% 37% 54% 46%/55% 48% 52% 45%;
    }

    14% {
        border-radius: 40% 60% 54% 46%/49% 60% 40% 51%;
    }

    28% {
        border-radius: 54% 46% 38% 62%/49% 70% 30% 51%;
    }

    42% {
        border-radius: 61% 39% 55% 45%/61% 38% 62% 39%;
    }

    56% {
        border-radius: 61% 39% 67% 33%/70% 50% 50% 30%;
    }

    70% {
        border-radius: 50% 50% 34% 66%/56% 68% 32% 44%;
    }

    84% {
        border-radius: 46% 54% 50% 50%/35% 61% 39% 65%;
    }

}

/* 1つ目 */
.blob-01 {
    width: 180px;
    height: 150px;
    background: #D2E4E6;
    top: 30px;
    left: 20px;
    opacity: 0.65;
    animation-delay: 0s;
}

/* 2つ目 */
.blob-02 {
    width: 230px;
    height: 180px;
    background: #E8EFF1;
    top: 180px;
    right: 300px;
    opacity: 0.8;
    animation-delay: -2s;
}

/* 3つ目 */
.blob-03 {
    width: 150px;
    height: 190px;
    background: #D2E4E6;
    bottom: 30px;
    right: 20px;
    opacity: 0.6;
    animation-delay: -4s;
}

/* 4つ目 */
.blob-04 {
    width: 120px;
    height: 110px;
    background: #EEF3F4;
    bottom: 80px;
    left: 250px;
    opacity: 0.9;
    animation-delay: -6s;
}


/* ふよふよ動く */
@keyframes blobFloat {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
        border-radius: 50% 45% 55% 50%;
    }

    25% {
        transform: translate(15px, -10px) scale(1.05);
        border-radius: 45% 55% 50% 60%;
    }

    50% {
        transform: translate(-10px, 15px) scale(0.95);
        border-radius: 60% 40% 55% 45%;
    }

    75% {
        transform: translate(10px, 5px) scale(1.03);
        border-radius: 50% 60% 40% 55%;
    }
}