body {
    background-color: #f0f1f5;
    padding: 8px;
}

.container {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    display: flex;
    /* background-color: rgb(236 236 236); */
    background: #fff;
    border-radius: 10px;
}

/* 左边栏 */
ul,
li {
    list-style: none;
}

*::-webkit-scrollbar {
    width: 1px;
}

/* *::-webkit-scrollbar-track {
    background: #f1f1f1;
} */

*::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 6px;
}

.left-main {
    width: 220px;
    min-width: 220px;
    max-width: 220px;
    height: 100%;
    overflow-y: scroll;
    background-image: linear-gradient(to top, #48c6ef 0%, #97aaed 100%);
    color: #fff;
    border-radius: 10px 0 0 10px;
}

.left-top {
    height: 45px;
    background-color: #8889ff61;
    margin: 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.left-top p {
    margin: 0;
}

.left-list {
    position: relative;
    cursor: pointer;
    margin-top: 50px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.left-list ul {
    padding-left: 0px;
}

.left-list>ul {
    padding-left: 20px;
}

.selected-title {
    font-size: 15px;
    background: url(../img/写字楼基本画像白.svg) no-repeat;
    background-position-x: 3px;
    padding-left: 26px;
    line-height: 1.2rem;
}

.selected-title li {
    background: url(../img/写字楼白.svg) no-repeat;
    background-position-x: 3px;
    padding-left: 26px;

}

/* 三级列表 */
.selected-3 {
    position: relative;
    display: none;
    transition: display 0.3s ease;
    /* 添加过渡效果 */
}

.selected-3 li {
    position: relative;
    background: url(../img/写字楼2白.svg) no-repeat;
    background-position-x: 0px;
    background-position-y: 2px;
    padding-left: 23px;
    background-size: 17px;
}

/* 第一个默认展开 */
.left-list>ul>li:nth-child(1) .selected-2:nth-child(1)>ul {
    display: block;
}

/* 车场 */
.left-list>ul>li:nth-child(2) {
    margin-top: 5px;
    background: url(../img/车场白.svg) no-repeat;
    font-size: 15px;
    background-position-x: 3px;
    padding-left: 26px;
}

/* 右边栏 */
.right-main {
    width: 95%;
    height: 100%;
    position: relative;
    /* overflow: hidden; */
}

/* 右俩按钮一行 */
.right-top {
    width: 100%;
    height: 15%;
    display: flex;
    margin: auto;
    align-items: center;
    background-color: #7bb4ee4a;
    border-radius: 0 10px 0 0;
    flex-direction: column;
}

.right-top>div:nth-child(1) {
    display: flex;
    width: calc(99% - -2px);
    margin: auto;
    height: 45px;
}
.right-top>div:nth-child(1)>div{
    height: 45px;
    display: flex;
    align-items: flex-end;
}
/* 俩按钮 */
.right-top a {
    padding: 6px 20px;
    border: 1px solid rgba(31, 31, 31, 0.082);
    text-decoration: none;
    background-color: #ffffffd5;
    color: #ababab;
    height: 31px;
    width: 106px;
}

.right-top a:active {
    color: #ababab;
}

/* 俩按钮选中 */
.right-top a.selected {
    color: rgb(59, 59, 59);
    background-color: #bdbdbd;
}

/* 右地图主界面日期 */
.right-title {
    margin: auto;
    padding: 15px 3.5%;
    background-color: aliceblue;
    width: 100%;

}

.date {
    padding-top: 3px;
    /* width: 50%; */
    display: flex;
    justify-content: flex-start;
}

.date>div:nth-child(1) {
    margin-right: 10px;
}

/* 右地图主界面 */
.right-bottom {
    width: 100%;
    height: 85%;
    background-color: #f1f1f1;
    border: 1px solid rgb(221 222 225);
    border-radius: 0 0 10px 0px;

}

/* 金额 */
.Amount {
    display: flex;
}

.Amount p {
    width: 25%;
    margin: 10px 0;
    border: 1px solid rgb(50 50 50 / 17%);
    border-top: 1px solid rgb(0, 140, 255);
    padding: 5px;
}

.map {
    position: relative;
    width: 100.1%;
    height: 100.1%;
    margin: auto;
    background-color: white;
    border-radius: 0 0 10px 0px;
    margin-left: -1px;
}

#map {
    width: 100% !important;
    height: 100% !important;
    margin: auto;
    border-radius: 0 0 10px 0px;
    background-color: #888;
}
#map canvas{
    width: 100% !important;
    height: 100% !important;
    border-radius: 0 0 10px 0px
}
.vc-switch {
    width: 100px;
    left: 8px;
    bottom: 8px !important;
    border-radius: 0 10px 0 10px !important;
    user-select: none;
}

/* map box */
.map-box {
    display: none;
    position: absolute;
    width: 650px;
    height: 450px;
    background-color: #fff;
    left: 10px;
    top: 10px;
    border-radius: 10px;
}

.map-box-title {
    position: relative;
    height: 27px;
    margin-top: 15px;
    display: flex;
    justify-content: center;
    border-bottom: 1px solid rgb(50 50 50 / 17%);
    flex-direction: column;
    align-items: center;
}

.map-box-title>div {
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.map-box-title>div>div>a {
    padding: 6px 20px;
    border: 1px solid rgba(31, 31, 31, 0.082);
    text-decoration: none;
    margin: 0 1px;
    background-color: #ffffffd5;
    color: #ababab;
    font-size: 12px;
}

.map-box-title>div>div>a.selected {
    color: rgb(59, 59, 59);
    background-color: #bdbdbd;
}
.map-box-content{
    width: 100%;
    height: calc(100% - 42px);
}

[type=checkbox] {
    margin-right: 2px;
}

.map-box>div:nth-child(2)>div:nth-child(3) input {
    width: 85px;
}

.map-box>div:nth-child(2)>div:nth-child(3) button {
    width: 50px;
}



.map-box>div:nth-child(3) table>tbody>tr:nth-child(1) {
    font-size: 13px;
}

th,
td {
    border: 1px solid black;
    padding: 8px 0;
    text-align: center;
}

table {
    border-collapse: collapse;
    width: 95%;
}
/* mapbox */
.mapbox-content {
    display: none;
}
/* 显示当前选中的内容 */
.active {
    display: block;
}
#changeFloor[data-v-97a58581] {
    position: fixed;
    left: 255px;
    bottom: 65px;
}
#bbtmap>div:nth-child(1){
    display: none;
}
/* mapbox1 */
#mapbox1{
    /* display: flex; */
    /* display: block; */
    align-items: center;
    flex-direction: column;
}
#mapbox1>div:nth-child(1) {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 12px;
    justify-content: space-evenly;
    height: 30px;
    margin: 10px auto 20px auto;
    width: 65%;
}
#mapbox1 > div:nth-child(2) > table > tbody > tr:nth-child(n + 2) > td:nth-child(n + 2){}
/* 表格 */
#mapbox1>div:nth-child(2) {
    display: flex;
    justify-content: center;
}

/* mapbox2 */
#mapbox2 div:nth-child(1) {
    display: flex;
    justify-content: center;
    height: 50%;
    margin-top: 5%;
}
#map-logo{
    width: 100%;
}
#mapbox2 > div > table > tbody > tr:nth-child(1) > td:nth-child(1){
    width: 5em;
}