﻿html,
body {
    width: 100%;
    height: 100%;
    /* min-width: 1300px;  */
    /* width: 100%;  */
    background-color: #f5f5f5;
    display: flex;
    /* overflow-y: hidden; */
}

/* html::-webkit-scrollbar { width: 0 !important } */
/* body { -ms-overflow-style: none; } */
/* body { overflow: -moz-scrollbars-none; } */
p {
    margin: 0 !important;
}

ul {
    margin: 0;
    padding: 0;
}

.bg28 {
    background-color: #283847;
    color: #fff !important;
}

.clf26 {
    color: #f0b026;
}

.wapper {
    width: 90%;
    height: 100%;
    position: absolute
}

#tt {
    height: 100% !important;
}




/* ---------------------------------------------------------------左侧菜单栏布局-------------------------------------------------------------------- */
.leftMenu {
    /* width: 100%; */
    height: 100%;
    width: 150px;
    background-color: #26313f;
    /* overflow: scroll; */
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    position: relative;
}

.moreUp{
    position: absolute;
    top: 49px;
    font-size: 24px;
    color: #fff;
    width: 140px;
    height: 20px;
    line-height: 15px;
    text-align: center;
    background-color: #26313F;
    cursor: pointer;
}

.moreDown {
    position: absolute;
    bottom: 57px;
    font-size: 24px;
    color: #fff;
    width: 140px;
    height: 20px;
    line-height: 35px;
    text-align: center;
    background-color: #26313F;
    cursor: pointer;
    z-index:999;
}




/* logo */
.logo {
    min-height: 50px;
    border-bottom: 2px solid #232c39;
    text-align: center;
    display: flex;
    cursor: pointer;
    /* justify-content: space-around; */
    box-sizing: content-box;
}

.logoImg {
    width: 30px;
    height: 30px;
    border-radius: 80px;
    margin: 10px 18px;
    vertical-align: unset;
}

#logoName1 {
    line-height: 50px;
    font-size: 18px;
    font-weight: bold;
}

/* menu */
/* .menu>li, */
.menu {
    height: 100%;
    overflow: scroll;
    position: relative;
    margin-bottom: 60px;
}

.menu::-webkit-scrollbar {
    display: none;
}

.menu>.moreLi {
    position: absolute;
    height: 10px;
}

.menu>li {
    height: 45px;
    line-height: 45px;
    color: #8d939b;
    font-size: 14px;
    display: flex;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
}


.menu>li>a {
    height: 50px;
    line-height: 50px;
    color: #8d939b;
    display: flex;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
}

.menu>li:hover {
    border-left: 4px solid #f0b026;
    /* background-color: #202833; */
    /* color: #f0b026; */
}

.menuHover {
    border-left: 4px solid #f0b026;
    background-color: #202833;
    color: #f0b026 !important;
}

/* .menu>li.color>a {
    border-left: 4px solid #f0b026;
    background-color: #202833;
    color: #f0b026;
} */

/* .menu>li>a{
    line-height: 50px;
    color: #8d939b;
    display: flex;
    justify-content: center;
    cursor: pointer;
} */
.menu>li>

/* a> */
span {
    width: 20px;
    height: 20px;
    margin: auto 0;
    margin-right: 10px;
    border: 0;
}

/* 每个图片的默认和点击样式 */
.menu>li>.img01 {
    background: url('../img/nav/default/01.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img01.active {
    background: url('../img/nav/click/01.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img02 {
    background: url('../img/nav/default/02.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img02.active {
    background: url('../img/nav/click/02.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img03 {
    background: url('../img/nav/default/03.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img03.active {
    background: url('../img/nav/click/03.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img04 {
    background: url('../img/nav/default/04.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img04.active {
    background: url('../img/nav/click/04.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img05 {
    background: url('../img/nav/default/05.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img05.active {
    background: url('../img/nav/click/05.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img06 {
    background: url('../img/nav/default/06.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img06.active {
    background: url('../img/nav/click/06.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img07 {
    background: url('../img/nav/default/07.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img07.active {
    background: url('../img/nav/click/07.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img08 {
    background: url('../img/nav/default/08.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img08.active {
    background: url('../img/nav/click/08.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img09 {
    background: url('../img/nav/default/09.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img09.active {
    background: url('../img/nav/click/09.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img10 {
    background: url('../img/nav/default/10.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img10.active {
    background: url('../img/nav/click/10.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img11 {
    background: url('../img/nav/default/11.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img11.active {
    background: url('../img/nav/click/11.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img12 {
    background: url('../img/nav/default/12.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img12.active {
    background: url('../img/nav/click/12.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img13 {
    background: url('../img/nav/default/13.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img13.active {
    background: url('../img/nav/click/13.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img14 {
    background: url('../img/nav/default/14.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img14.active {
    background: url('../img/nav/click/14.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img15 {
    background: url('../img/nav/default/15.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img15.active {
    background: url('../img/nav/click/15.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img17 {
    background: url('../img/nav/default/17.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img17.active {
    background: url('../img/nav/click/17.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img18 {
    background: url('../img/nav/default/18.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img18.active {
    background: url('../img/nav/click/18.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img19 {
    background: url('../img/nav/default/19.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img19.active {
    background: url('../img/nav/click/19.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img20 {
    background: url('../img/nav/default/20.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img20.active {
    background: url('../img/nav/click/20.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img21 {
    background: url('../img/nav/default/21.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.img21.active {
    background: url('../img/nav/click/21.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.imggz {
    background: url('../img/nav/default/gz.png') center center no-repeat;
    background-size: cover;
}

.menu>li>.imggz.active {
    background: url('../img/nav/click/gz.png') center center no-repeat;
    background-size: cover;
}

/* tel */
.tel {
    text-align: center;
    font-size: 14px;
    line-height: 29px;
    color: #8d939b;
    border-top: 1px solid #232c39;
    position: absolute;
    bottom: 0px;
    width: 100%;
}








/* 右侧top及内容 */
.rightCont {
    min-width: calc(90% - 150px);
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* 顶部工具栏 */
.top {
    height: 50px;
    background-color: #f0b026;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
}

.top>img {
    width: 30px;
    height: 35px;
    margin: auto 0;
    cursor: pointer;
}

.actionBtn {
    display: flex;
    line-height: 50px;
    position: relative;
}

.coles {
    color: #fff;
    font-size: 16px;
    line-height: 50px;
    margin-right: 20px;
}

/* .actionBtn img{
    width: 32px;
    height: 32px;
    margin: auto 10px;
    cursor: pointer;

} */
.actionBtn img

/* :not(:nth-of-type(2)) */
    {
    width: 20px;
    height: 20px;
    margin: auto 10px;
    cursor: pointer;
}

/* .actionBtn>img:nth-of-type(2){
    width: 20px;
    height: 20px;
} */
.line {
    height: 15px;
    border-left: 1px solid #fff;
    margin: auto 20px;
}

.serviceList {
    width: 100px;
    position: absolute;
    top: 50px;
    right: 192px;
    text-align: center;
    background-color: #f0b026;
    line-height: 30px;
    font-size: 14px;
    display: none;
    z-index: 999;
    height: 124px;
}

.actionList {
    width: 125px;
    position: absolute;
    top: 50px;
    right: 28px;
    text-align: center;
    background-color: #f0b026;
    line-height: 30px;
    font-size: 14px;
    display: none;
    z-index: 999;
}

.serviceList>ul,
.actionList>ul {
    list-style: none;
}

.serviceList>ul>li>a,
.actionList>ul>li>a {
    display: flex;
    justify-content: center;
    border-bottom: 1px solid #fff;
    text-decoration: none;
    color: #fff;
}

.actionList>ul>li>a:hover {
    /* background-color: rgb(223, 223, 223); */
    /* opacity: 0.5; */
    background-color: #e9e9e9;
    color: #f0b026
}

.serviceList>ul>li>a>img,
.actionList>ul>li>a>img {
    width: 20px;
    height: 20px;
    margin: auto 0;
    margin-right: 6px;
}






.menuIcon {
    width: 32px;
    height: 32px;
    margin: auto 10px;
    border-radius: 5px;
    background-color: #f0b026;
}

.topact {
    display: flex;
    flex-direction: column;
    margin: 4px 10px;
    line-height: 25px;
}

.topact>a>img {
    width: 26px;
    height: 26px;
    margin: 0 auto;
}

#serviceImg {
    margin-right: 30px;
}

.topact>a {
    display: flex;
    flex-direction: column;
    color: #333333;
    text-decoration: none;
    margin: 0 5px;
}

/* 
.service>ul{
    display: flex;
    list-style: none;
}
.service>ul>li>a{
    display: flex;
    flex-direction: column;
    line-height: 30px;
    padding-top: 6px;
    margin: 0 10px;
} */

.tabs {
    display: flex;
    list-style: none;
}

.tabs-inner {
    text-decoration: none;
}

.title {
    margin: 20px 0;
}

.topTitle {
    font-size: 20px;
}

.actionBox {
    display: flex;
}

.action {
    display: flex;
    width: 210px;
    height: 50px;
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-weight: bold;
    line-height: 25px;
    margin: 10px;
    overflow: hidden;

}

.actionImg {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    margin-right: 10px;
    background: #1A83C7;
    display: flex;
}

.actionImg>img {
    width: 30px;
    height: 30px;
    margin: auto;
    color: #fff;
}

.actionBox>a {
    text-decoration: none;
    color: #333;
}

.actionMsg {
    font-size: 12px;
    color: #ccc;
    font-weight: 100px;
}

.exit {
    display: flex;
}

.exit>img {
    margin: auto 0;
    margin-left: 10px;
    width: 35px;
    height: 35px;
}

.ttBox {
    /* margin-top: 20px; */
    width: 100%;
    height: 100%;
}

.indexBox {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

.indexBox::-webkit-scrollbar {
    display: none;
}


/* .modal-dialog {
    height: 80%;
    display: flex;
}

.modal-content {
    width: 350px;
    height: 110px;
    margin: auto 0;
}

.modal-content>.title {
    text-align: center;
    margin: 0 auto;
    font-size: 16px;
    display: flex;
    justify-content: center;
}

.modal-content>.title>img {
    width: 30px;
    height: 30px;
    margin: auto 6px;
}

.modal-content>.btn1 {
    display: flex;
    /* justify-content: space-evenly; 
    margin-bottom: 10px;
    padding: 8px;
}

.modal-content>.btn1>button {
    margin-left: 60px;
} */

.tabs-wrap {
    background: #fff;
}

.exit>img {
    width: 21px;
    height: 21px;
    /* transform: rotateY(180deg)  */
}

.m-cont {
    width: 320px;
    height: 350px;
    margin: auto;
}

.m-cont>div {
    height: 40px;
    line-height: 40px;
    text-align: center;
}

#code,
#code1 {
    width: 300px;
    height: 300px;
    margin: 0 auto;
    margin-top: 10px;
}

.close1 {
    width: 30px;
    height: 30px;
    position: absolute;
    right: 0;
    opacity: 1;
}

button.close {
    background-color: #fff;
}