html{
    font-size: calc(100vw/1920);
    height: 100vh;
    width: 100vw;
}
html,body{
    margin: 0;
    padding: 0;
}
body{
    background:url('./img/bg.webp') center/100% 100% no-repeat;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    padding: 0 18px;
}
header{
    background: url('./img/logo.png') center top/contain no-repeat;
    height: 130rem;
    width: 100vw;
    text-align: center;
    margin: 0;
    :last-child{
        line-height: 10rem;
        font-size: 18rem;
        color: aqua;
        margin:0;
    }
    :first-child{
        line-height: 70rem;
        font-weight: 500;
        font-size: 34rem;
        margin:0;
        color: #ccf1ff;
    }
}
.side_left,.side_right{
    height: 89vh;
    /* background-color: blue; */
}
@media (min-width:992px) {
    .side_left,.side_right{
    margin-top: -66rem;
    }
}
.middle{
    height: 82vh;
    /* background-color: red; */
}
.box-top,.box-bottom{
    height: 48%;
    /* background-color: aqua; */
}
.map{
    height: 60%;
    /* background-color: aquamarine; */
}
.city{
    height: 35%;
    /* background-color: aqua; */
}
.box-bottom,.city{
    margin-top: 30rem;
}
.row>div>div{
    border-image: url(./img/border.png)
    50 40 20 120;
    border-width:40px 40px 20px 120px ;
    border-style: solid;
    position: relative;
}
.content{
    position: absolute;
    top: -20px;
    left: -100px;
    right: -20px;
    bottom: 6px
}