.banner-part-wcont,
.banner-part-hcont {
    position: absolute;
}
.banner-part-wcont object,
.banner-part-wcont img {
    width: 100%;
}
.banner-part-hcont object,
.banner-part-hcont img {
    height: 100%;
}
.banner-scale-cont {
    transition: transform 0.4s ease-in-out;
}
.banner-scale-cont:hover {
    transform: scale(1.2);
}
.board-small {
    width: 12.4vw; /* 238px */
    height: 25.94vw; /* 498px */
    top: 22.55vw; /* 433px */
    right: 2.63vw; /* 50.5px */
    z-index: 5;
}

.board-middle {
    width: 15.05vw; /* 289px */
    height: 19.22vw; /* 369px */
    top: 2.34vw; /* 45px */
    right: 2.66vw; /* 51px */
}
.board-large {
    width: 13.646vw;/*262px;*/
    height: 25.938vw; /*498px;*/
    top: 28.125vw; /* 540px;*/
    left: 8.229vw; /* 158px;*/
}

.bar-chart-small {
    width: 4.66vw; /* 89.4px */
    height: 3.65vw; /* 70px */
    top: 6.61vw; /* 127px */
    left: 26.41vw; /* 507px */
    z-index: 5;
}

.bar-chart-middle {
    width: 8.83vw; /* 169.5px */
    height: 6.91vw; /* 132.7px */
    top: 33.71vw; /* 647.3px */
    right: 12.61vw; /* 242.15px */
    z-index: 7;
}
.bar-chart-large {
    width: 10.495vw; /* 262px;*/
    height: 10.495vw; /* 498px;*/
    top: 43.594vw; /* 837px;*/
    right: 21.484vw; /* 412.5px;*/
    z-index: 15;
}
.circle-chart-small {
    width: 3.7vw; /* 71px */
    height: 3.28vw; /* 63px */
    top: 8.39vw; /* 161px */
    left: 40.36vw; /* 775px */
    z-index: 5;
}

.circle-chart-middle {
    width: 8.28vw; /* 158.9px */
    height: 7.24vw; /* 139.1px */
    top: 7.94vw; /* 152.57px */
    left: 58.5vw; /* 1123.45px */
    z-index: 3;
}
.circle-chart-large {
    width: 9.453vw; /* 181.5px;*/
    height: 8.411vw; /* 161.5px;*/
    top: 29.896vw; /* 574px;*/
    left: 22.708vw; /* 436px;*/
    z-index: 5;
}

.notebook {
    width: 38.72vw; 
    height: 35.91vw; 
    top: 1.95vw; 
    right: 6.1vw; 
}
.lady {
    width: 8.477vw;
    height: 7.749vw;
    top: 16.107vw;
    right: 24.7vw;
}

.server {
    width: 12.415vw;
    height: 11.48vw;
    top: 9.5vw;
    left: 49.09vw; 
    z-index: 5;
}
.line3 {
    width: 22.344vw;
    height: 14.948vw;
    right: 3.177vw;
    top: 34.479vw;
    z-index: 6;
    overflow: hidden;
    animation-name: animateLine3;
    animation-duration: 4s;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-timing-function: linear;
}

@keyframes animateLine3 {
    0% {
        height: 0; 
    }
    50% {
        height: 0; 
    }
    100% {
        height: 14.948vw; 
    }
}


.line1 {
    width: 13.464vw;  /* 260px */
    height: 5.156vw;  /* 99px */
    right: 55.938vw;   /* 500.5px */
    top: 4.922vw;     /* 94.5px */
    z-index: 3; 
    overflow: hidden; 
    animation-name: animateLine1;
    animation-duration: 5s;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-timing-function: linear; 
} 
.line1 object{
    position: absolute;
    top: 0;
    right: 0;
}
@keyframes animateLine1 {
    0% {
        width: 0; 
    }
    60% {
        width: 0; 
    }
    100% {
        width: 13.464vw; 
    }
}
.line2 {
    width: 11.2vw;   /* 215px */
    height: 6.88vw;  /* 132px */
    right: 45.495vw;   
    top: 8.88vw;     /* 170.5px */
    z-index: 3;
    overflow: hidden; 
    animation-name: animateLine2;
    animation-duration: 3s;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-timing-function: linear; 
}
.line2 object{
    position: absolute;
    bottom: 0;
    right: 0;
}
@keyframes animateLine2 {
    0% {
        width: 0; 
    }
    33% {
        width: 0; 
    }
    100% {
        width: 11.2vw; 
    }
}

.line4 {
    width: 22.92vw;  /* 440px */
    height: 16.46vw; /* 316px */
    left: 30.16vw;   /* 579px */
    top: 16.41vw;    /* 315px */
    z-index: 3;
    overflow: hidden;
    animation-name: animateLine4;
    animation-duration: 5s;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-timing-function: linear;
}
@keyframes animateLine4 {
    0% {
        height: 0; 
    }
    40% {
        height: 0; 
    }
    100% {
        height: 16.46vw;
    }
}


