* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

.container {
    width: 100%;
    position: relative;
}


.container01 {
    width: 100%;
    position: relative;
}

.bg-img {
    width: 100%;
    /*height: 112.5vh;*/
    display: block;
}

.logo-index{
    position: absolute;
    top: 10vh;
    left: 12vw;
    transform: translateX(-50%);
}
.logo-index img {
    width: 15vw;
    /*width: clamp(120px, 30vw, 600px);*/
}
.download {
    position: absolute;
    top: 67vh;
    left: 50vw;
    transform: translateX(-50%);
}

.download img {
    width: 23vw;
    /*width: clamp(120px, 30vw, 600px);*/
}

@keyframes fadeIn-data-start-button {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes breathe-data-start-button {
    0% {
        transform: scale(0.9)
    }
    50% {
        transform: scale(1)
    }
    to {
        transform: scale(0.9)
    }
}

.button-box-start-img {
    animation: fadeIn-data-start-button .3s .7s both, breathe-data-start-button 2s 1s infinite both;
    animation-delay: 250ms;
    display: block;
}

.bottom {
    position: relative;
    margin-top: -12.5vh;
    background-color: black;
    /*width: 100vw;*/
    height: 20vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.buttom-01, .buttom-02 {
    height: auto;
    /*width: 100vw;*/
    margin: 3vh auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1vw;
}
.buttom-01 img{
    height: 5.5vh;
    width: auto;
}
.bottom-02 img{
    height: 2.5vh;
    width: auto;
}