body{
    background: #f1faff;
}

.wrapper{
    width: 1280px;
    height: 1000px;
    background-color: #F1FAFF;
    margin: 0 auto;
}
.title-box{
    width: 1000px;
    height: 400px;
    margin: 0 auto;
    position: relative;
}
.title{
    position: absolute;
    top: 15%;
}
.start-sub{
    z-index: 1;
    position: absolute;
    width: 29%;
    left: 50%;
    transform: translateX(-50%);
    top: 50%;
}
.start{
    position: absolute;
    left: 50%;
    width: 30%;
    transform: translateX(-50%);
    z-index: 0;
    top: 71%
}
.main-box{
    width: 1000px;
    height: 600px;
    margin: 0 auto;
    position: relative;
}
.circle{
    position: absolute;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
}
.Jr{
    position: absolute;
    width: 30%;
    left: 20%;
    transform: translateX(-50%);
}
.beaver{
    position: absolute;
    width: 30%;
    left: 50%;
    transform: translateX(-50%);
}
.code-adventure{
    position: absolute;
    width: 30%;
    left: 80%;
    transform: translateX(-50%);
}
.game{
    position: absolute;
    width: 30%;
    left: 20%;
    top: 50%;
    transform: translateX(-50%);
}
.banana{
    position: absolute;
    width: 30%;
    left: 50%;
    top: 50%;
    transform: translateX(-50%);
}
.code-chat{
    position: absolute;
    width: 30%;
    left: 80%;
    top: 50%;
    transform: translateX(-50%);
}