.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
}

.loading div {
    width: 500px;
    margin: 0 auto;
    margin-top: 8%;
    text-align: center;
}

.loading div span {
    position: relative;
    top: 130px;
    left: -50px;
    font-size: 16px;
}

.approximateQuery li {
    float: left;
    border: 1px solid #ccc;
    cursor: pointer;
    margin: 10px 10px;
}

.M-box,
.M-box2,
.M-box3,
.M-box4,
.M-box5,
.M-box6,
.M-box7,
.M-box8,
.M-box9,
.M-box10 {
    width: 95%;
    margin: 0 auto;
    margin-top: 30px;
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #999999;
    text-align: center;
    display: flex;
    justify-content: center;
}

.M-box span,
.M-box a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box2 span,
.M-box2 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box3 span,
.M-box3 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box4 span,
.M-box4 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box5 span,
.M-box5 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box6 span,
.M-box6 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box7 span,
.M-box7 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box8 span,
.M-box8 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box9 span,
.M-box9 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box10 span,
.M-box10 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
}

.M-box a,
.M-box2 a,
.M-box3 a,
.M-box4 a,
.M-box5 a,
.M-box6 a,
.M-box7 a,
.M-box8 a,
.M-box9 a,
.M-box10 a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 6px;
    font-size: 14px;
    font-family: NotoSansHans-Light;
    font-weight: 300;
    color: rgba(153, 153, 153, 1);
    background: transparent;
    border-radius: 4px;
    border: 1px solid rgba(153, 153, 153, 0.5);
}

.M-box a:hover,
.M-box2 a:hover,
.M-box3 a:hover,
.M-box4 a:hover,
.M-box5 a:hover,
.M-box6 a:hover,
.M-box7 a:hover,
.M-box8 a:hover,
.M-box9 a:hover,
.M-box10 a:hover {
    font-family: NotoSansHans-Light;
    font-weight: 300;
    color: rgba(255, 255, 255, 1);
    background-image: linear-gradient(45deg, #021955 0%, #021955 100%);
    border-radius: 4px;
    border: 1px solid rgba(2, 25, 85, 0.5);
}

.M-box span,
.M-box2 span,
.M-box3 span,
.M-box4 span,
.M-box5 span,
.M-box6 span,
.M-box7 span,
.M-box8 span,
.M-box9 span,
.M-box10 span {
    font-family: NotoSansHans-Light;
    font-weight: 300;
    color: rgba(255, 255, 255, 1);
    background-image: linear-gradient(45deg, #021955 0%, #021955 100%);
    border-radius: 4px;
    border: 1px solid rgba(2, 25, 85, 0.5);
}

.M-box input,
.M-box2 input,
.M-box3 input,
.M-box4 input,
.M-box5 input,
.M-box6 input,
.M-box7 input,
.M-box8 input,
.M-box9 input,
.M-box10 input {
    width: 40px;
    height: 20px;
}

.M-boxA {
    position: absolute;
    width: 95%;
    margin: 0 auto;
    font-family: PingFangSC-Regular;
    font-size: 14px;
    color: #999999;
    text-align: center;
    display: flex;
    justify-content: left;
    margin-top: 300px;
}

.M-boxA span,
.M-boxA a {
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin: 0 6px;
    font-size: 14px;
}

.M-boxA a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin: 0 6px;
    font-size: 14px;
    font-family: NotoSansHans-Light;
    font-weight: 300;
    color: rgba(153, 153, 153, 1);
    background-image: linear-gradient(45deg, #021955 0%, #021955 100%);
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.5);
    background: transparent;
    display: block;
}

/* .M-boxA a:hover{
    font-family: NotoSansHans-Light;
    font-weight: 300;
	background-image: linear-gradient(45deg, #021955 0%, #021955 100%);
	border-radius: 50%;
	border: 1px solid rgba(2,85,149,0.5);
    color: #FFFFFF;
}
.M-boxA a:first-child:hover, .M-boxA a:last-child:hover{ 
	background-image: none;
	background: transparent;
	border: 0px solid rgba(2,85,149,0.5);
} */
.M-boxA span {
    font-family: NotoSansHans-Light;
    font-weight: 300;
    background-image: linear-gradient(45deg, #021955 0%, #021955 100%);
    border-radius: 50%;
    border: 1px solid rgba(2, 85, 149, 0.5);
    color: #FFFFFF;
}

.M-boxA input {
    width: 20px;
    height: 20px;
}

.ellipsis {
    border: none !important;
    color: #999999 !important;
    background: transparent !important;
}