body{display: flex;align-items: center;justify-content: center;color: red;}
.box{
    background-image: url("/static/images/bg.png");
    background-repeat: no-repeat;
    width: 690px;
    height: 930px;
    padding-top:26px;
}

.top-info {display: flex;flex-direction: row;}
.top-info .nickname{margin-left: 50px;}
.top-info .hand{margin-left: 150px;}
.top-info .birthday{margin-left: 150px;}
.top-info .info{margin-left: 80px;}

.second-info{padding-top: 40px;display: flex;flex-direction: row;}
.second-info .left{width: 270px;}
.second-info .left .first-line{margin-left: 60px;margin-top: 25px;display: flex;flex-direction: row;}
.second-info .left .first-line div{margin-right:36px;}
.second-info .left .second-line{margin-top:35px;flex-direction: row;display: flex;padding-left: 75px;}
.second-info .left .second-line div{margin-right:35px;}
.second-info .left .second-line div:nth-child(2){margin-right:46px;}
.second-info .left .third-line {margin-left: 112px;margin-top: 40px;display: flex;flex-direction: row;}
.second-info .left .third-line div{margin-right:58px;}
.second-info .left .fourth-line {margin-left: 147px;margin-top: 40px;}
.second-info .left .fifth-line {margin-left: 102px;margin-top: 70px;display: flex;flex-direction: row;}
.second-info .left .fifth-line div{margin-right:75px;}
.second-info .left .sixth-line {margin-left: 45px;margin-top: 70px;display: flex;flex-direction: row;}
.second-info .left .sixth-line div{margin-right:65px;}
.second-info .right .first-line{margin-left: 50px;}
.second-info .right .second-line{margin-left: 80px;margin-top: 25px;width: 300px;height:350px;overflow: hidden;}

.third-info{display: flex;flex-direction: row;}
.third-info .left{padding-top:50px;padding-left: 81px;display: flex;flex-direction: row;align-content: space-between;width: 280px;height: 47px;flex-wrap: wrap;}
.third-info .left div{margin-right: 8px;}
.third-info .left .circle{border: 1px solid red;border-radius: 50%;width: 20px;height: 20px;}
.third-info .left .blank{width: 22px;height: 20px;}
.third-info .right{width: 280px;height: 125px;padding-left: 30px;padding-top: 25px;overflow: hidden;}

.fourth-info{padding-top: 10px;display: flex;flex-direction: row;}
.fourth-info .left{}
.fourth-info .left .first-line{display: flex;flex-direction: row;padding-left: 50px;}
.fourth-info .left .first-line div{margin-right: 27px;}
.fourth-info .left .second-line{display: flex;flex-direction: row;padding-left: 70px;padding-top: 22px}
.fourth-info .left .second-line div{margin-right: 27px;}
.fourth-info .left .second-line div:nth-child(2){margin-right:35px;}
.fourth-info .left .second-line div:nth-child(3){margin-right:25px;}
.fourth-info .left .third-line {margin-left: 102px;margin-top: 30px;display: flex;flex-direction: row;}
.fourth-info .left .third-line div{margin-right:40px;}
.fourth-info .left .fourth-line {margin-left: 128px;margin-top: 20px;}
.fourth-info .right .first-line{margin-left: 90px;margin-top: 5px;}
.fourth-info .right .second-line{margin-left: 100px;margin-top: 25px;width: 310px;height:130px;overflow: hidden;}

.fifth-info{padding-top: 10px;display: flex;flex-direction: row;}
.fifth-info .left{padding-top: 40px;}
.fifth-info .left .first-line{display: flex;flex-direction: row;padding-left: 42px;}
.fifth-info .left .first-line div{margin-right: 33px;}
.fifth-info .left .first-line div:nth-child(2){margin-right: 32px;}
.fifth-info .left .first-line div:nth-child(3){margin-right: 38px;}
.fifth-info .left .first-line div:nth-child(4){margin-right: 42px;}
.fifth-info .left .second-line{display: flex;flex-direction: row;padding-left: 70px;padding-top: 22px}
.fifth-info .left .second-line div{margin-right: 27px;}
.fifth-info .left .second-line div:nth-child(2){margin-right:35px;}
.fifth-info .left .second-line div:nth-child(3){margin-right:25px;}
.fifth-info .left .third-line {margin-left: 102px;margin-top: 30px;display: flex;flex-direction: row;}
.fifth-info .left .third-line div{margin-right:40px;}
.fifth-info .left .fourth-line {margin-left: 128px;margin-top: 20px;}
.fifth-info .right .first-line{margin-left: 90px;margin-top: 10px;display: flex;flex-direction: row;}
.fifth-info .right .first-line div{margin-right: 100px;}
.fifth-info .right .second-line{margin-left: 105px;margin-top: 25px;display: flex;flex-direction: row;}
.fifth-info .right .second-line div{margin-right: 43px;}