* {
    padding: 0;
    margin: 0;
    border-radius: 0;
}

html,
body {
    width: 100%;
    height: 100%;
    font-family: pingfontweb,-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Roboto,Arial,PingFang SC,Hiragino Sans GB,Microsoft Yahei,Microsoft Jhenghei,sans-serif;
    /*font-size: 14px; font-weight: 400;color: rgb(97, 97, 97);*/
}
.trWidth10 {
    width: 10px;
}

.trWidth20 {
    width: 20px;
}

.trWidth30 {
    width: 30px;
}

.trWidth40 {
    width: 40px;
}

.trWidth50 {
    width: 50px;
}

.trWidth60 {
    width: 60px;
}

.trWidth70 {
    width: 70px;
}

.trWidth100 {
    width: 100px;
}

.trWidth200 {
    width: 200px;
}

.trWidth300 {
    width: 300px;
}

.linkFontColor {
    color: red;
    cursor: pointer;
}

.verticalAlignTop {
    vertical-align: top
}

.layui-nav-item a {
    cursor: pointer;
}

.wordBreak {
    word-break: break-all;
}

.verticalAlignCenter {
    vertical-align: center;
}

.codeBackground {
    width: 100%;
    height: auto;
    padding: 10px;
    margin: 10px;
    background-color: rgb(252, 252, 252);
    border: 1px solid rgb(225, 225, 232);
}

.redLink {
    color: red;
}

.apiItemBtn > .layui-btn {
    width: 200px;
    height: 137px;
    margin-bottom: 20px;
    margin-left: 8px;
    margin-right: 8px;
}

/*iframe 外层样式 内容部分*/
.main-container {
    width: calc(100% - 210px);
    /*height: calc(100% - 60px);*/
    height: calc(100%);
    position: absolute;
    left: 210px;
    /*top: 60px*/
    top: 0;
}

/*手机端菜单按钮*/
.menu-wrap-btn {
    display: none !important;
}

.menu-wrap {
    display: none;
}

.menu-wrap .close-button {
    position: absolute;
    opacity: 0;
}

html,
body {
    width: 100%;
    height: 100%;
    margin: 0 auto;
}

.content-div-wrap {
    width: 100%;
    min-height: 100%;
    height: auto;
    display: flex;
    flex-direction: row
}

.div-detail-table {
    width: 100%;
    padding-right: 10px;
    overflow: auto
}

.div-detail-code {
    width: 91%;
    background-color: #0C0C0C;
    color: white;
    padding: 10px;
    overflow: auto
}

.title-h2 {
    text-align: left;
    padding-top: 30px;
    padding-left: 77px;
}

.title-h2 h3 {
    font-weight: bolder;
}

.text-body {
    text-align: left;
    padding-top: 30px;
    padding-left: 77px;
    padding-right: 77px;
}

.api-container {
    width: auto;
    height: 100%;
    overflow: auto;
    padding: 10px;
    line-height: 26px;
    padding-right: 0;
    padding-bottom: 0;
}

.div-detail-code {
    margin-top: -20px!important;
    background-color: #2b303b;
}

.div-detail-code > p {
    color: #d0d4d7;
    font-weight: bold;
    font-size: 13px;
    padding-top: 10px;
}

.list-body {
    text-align: left !important;
}

.list-body .layui-btn {
    margin-bottom: 20px;
    margin-left: 10px;
    margin-right: 10px;
    background-color: #ffffff;
    border: solid 1px #f5f5f5;
    border-radius: 6px;
    box-shadow: 0 4px 32px 0 rgba(7,18,59,0.1);
    width: 190px!important;
}

.list-body .layui-btn:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 32px 0 rgba(7,18,59,0.40);
    border-radius: 4px;
}

.layui-nav-tree {
    height: calc(100% - 50px);
    overflow-y: scroll;
    /*background-color: #393D49!important;*/
    background-color: #fafafa;
    padding-right: 3px;
    padding-left: 3px;
    box-shadow: inset -1px 0 0 rgba(0,0,0,.05);
}

.toolbar {
    /*display: none;*/
}

.toolbar #back-top {
    display: none;
}

.toolbar {
    display: block;
    position: fixed;
    bottom: 20px;
    right: 15px;
}

.toolbar a {
    padding: 8px 10px 10px 10px;
    display: block;
    margin-top: 10px;
    width: 44px;
    height: 44px;
    background-color: rgba(255, 255, 255, .3);
    box-sizing: border-box;
    border-radius: 50%;
    border: 1px solid #777;
    box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .12);
}

#showArea {
    height: 100%;
}

table tbody tr td:first-child p:first-child {
    font-weight: 600;
    min-width: 110px;
    max-width: 130px;
    word-break: break-all;
    word-wrap: break-word;
}

table tbody tr td:first-child p:nth-child(3) {
    display: block;
    font-weight: 400;
    color: #a2a2a2;
    font-style: italic;
}

.layui-table td, .layui-table th{
    font-size: 13px;
}

.layui-table tr td {
    border-bottom: solid 1px #f0f4f7!important;
}

.layui-table tr td .subText {
    font-size: 12px;
    color: #afafaf;
}

.layui-bg-black {
    background-color: #fafafa!important;
    color: rgba(0,0,0,.75) !important;
    box-shadow: inset -1px 0 0 rgba(0,0,0,.05);
}

.all-header .layui-nav .layui-nav-item a {
    color: white;
}

.layui-nav .layui-nav-item a {
    color: rgba(0,0,0,.75);
}

.layui-nav-itemed>a, .layui-nav-tree .layui-nav-title a, .layui-nav-tree .layui-nav-title a:hover {
    color: #000!important;
    font-weight: 400;
}

.layui-nav .layui-nav-item.layui-this a {
    color: white;
}

.layui-nav-tree .layui-nav-item a:hover {
    background-color: white;
    color: #000;
}

.layui-nav-tree .layui-nav-child, .layui-nav-tree .layui-nav-child a:hover{
    background-color:#c3e6e3;
    color:#000;
}

.layui-nav .layui-nav-more {
    border-top-color: rgba(0,0,0,.55) !important;
    padding-right: 0;
}

.layui-nav .layui-nav-mored, .layui-nav-itemed>a .layui-nav-more {
    border-color: transparent transparent rgba(0,0,0,.55) !important;
}

.layui-nav-itemed>.layui-nav-child {
    background-color: #f1f1f1!important;
}

.layui-nav-itemed>.layui-nav-child * {
    font-size: 13px;
}

.layui-nav-itemed>.layui-nav-child dd a {
    padding-left: 30px;
}

.all-header {
    display: none;
}

.menu-header {
    font-size: 15px;
    height: 45px;
    color: #000;
    line-height: 45px;
    padding-left: 20px;
    /*text-align: center;*/
    background-color: #f1f1f1;
    border-bottom: solid 1px #e4e4e4;
}

.weightText {
    color: #009688;
    /*font-weight: bold;*/
}

.layui-text h3 {
    padding: 0;
}

.imgList {
    display: flex;
    align-items: start;
}

.imgList img{
    border: dashed 1px #dadada;
    border-radius: 8px;
    margin: 10px;
    width: 27%;
    max-width: 315px;
    padding: 10px;
    box-shadow: 0 2px 8px 0 rgba(7,18,59,0.05);
}

.imgList .right img{
    width: 78%;
}

.layui-table .subTableTitle {
    position: relative;
    padding-left: 20px;
    cursor: pointer;
}

.layui-table .subTableTitle .tdTitle {
    position: relative;
}

.layui-table .subTableTitle .tdTitle p:first-child {
    color: #1E9FFF;
}

.layui-table .subTableTitle.open td {
    border-bottom: dashed 1px #f0f4f7!important;
}

.layui-table .subTableTitle .subBtn {
    position: absolute;
    top: 14px;
    left: 0;
    width: 12px;
    height: 12px;
}

.layui-table .subTableTitle.close .subBtn {
    background: url("images/add.jpg");
    background-size: cover;
}

.layui-table .subTableTitle.open .subBtn {
    background: url("images/minus1.jpg");
    background-size: cover;
}

.sub-layui-table {
    width: 100%;
}

table.sub-layui-table tbody tr td:nth-child(1) p:first-child {
    font-weight: 600!important;
    min-width: 94px;
    word-break: break-all;
    word-wrap: break-word;
}

table.sub-layui-table tbody tr td:nth-child(2) p:first-child {
    font-weight: 400!important;
    max-width: 100%;
}

table.sub-layui-table tbody tr td:nth-child(2) p:nth-child(3) {
    display: block;
    font-weight: 400;
    color: #666!important;
    font-style: inherit!important;
}

.sub-sub-layui-table tr td {
    border-bottom: solid 1px #e6e9ea!important;
}

.hideTr {
    display: none;
}

.hiddenTr td:first-child p:first-child{
    color: #c5c5c5!important;
}

.showTr {
    display: contents;
}

.menuList {
    display: flex;
}

.menuList .left {
    width: 45%;
}

.basisThisMenu {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: aliceblue;
    padding: 10px;
    max-height: calc(100vh - 60px);
    overflow-y: scroll;
}
.basisThisMenu ul {
    margin-left: 20px;
}

.basisThisMenu a {
    color: #4ea1db;
    text-decoration: none;
}

.basisContent {
    margin-right: 260px
}

@media screen and (max-width: 800px) {
    /**/
    .menu-wrap {
        display: block;
        position: absolute;
        z-index: 1001;
        width: 300px;
        height: 100%;
        background: #373a47;
        padding: 0;
        font-size: 1.15em;
        -webkit-transform: translate3d(-320px, 0, 0);
        transform: translate3d(-320px, 0, 0);
        -webkit-transition: -webkit-transform 0.4s;
        transition: transform 0.4s;
        -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
        transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
    }

    .menu-wrap.show {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-transition: -webkit-transform 0.8s;
        transition: transform 0.8s;
        -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
        transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
    }

    .menu-wrap a {
        color: white;
    }

    .menu-wrap .close-button {
        position: absolute;
        right: -28px;
        top: 15px;
        padding: 2px;
        border-radius: 0 4px 4px 0;
        background: #989898;
        opacity: 0;
    }

    .menu-wrap.show .close-button {
        opacity: 1;
    }

    .menu-wrap.show .layui-nav-tree {
        width: 100% !important;
        /*height: calc(100%);*/
        height: calc(100% - 60px);
        overflow-y: scroll;
    }

    .menu-pc {
        display: none;
    }

    .main-container {
        width: 100%;
        height: calc(100% - 60px);
        left: 0 !important;
        top: 60px !important;
    }

    .api-container {
        height: auto;
        padding-right: 10px;
        padding-bottom: 10px;
    }

    .menu-wrap-btn {
        display: block !important;
        padding-left: 15px;
        border-bottom: solid 1px #d4d4d4;
    }

    /*文档的title eg:API文档简介*/
    .title-h2 {
        padding: 0 10px !important;
    }

    .title-h2 h3 {
        padding-top: 15px !important;
    }

    /*文档的内容 eg:本API文档介绍了天阙平台对外服务接口的各种应用场景*/
    .text-body {
        padding: 10px !important;
    }

    /*文档内容的接口详情list eg:TQM001 图片资料上传接口*/
    .list-body {
        text-align: center !important;
    }

    .list-body .layui-btn {
        margin-bottom: 15px;
        margin-left: 5px;
        margin-right: 5px;
    }

    .content-div-wrap {
        width: 100%;
        /*height: 100%;*/
        display: flex;
        flex-direction: column;
    }

    .div-detail-table {
        width: auto;
        padding-right: 0px;
    }

    .div-detail-code {
        width: auto;
        padding-top: 0;
        margin-top: 0!important;
    }

    .toolbar #back-top {
        display: none;
    }

    .toolbar {
        display: block;
        position: fixed;
        bottom: 20px;
        right: 15px;
    }

    .toolbar a {
        padding: 8px 10px 10px 10px;
        display: block;
        margin-top: 10px;
        width: 44px;
        height: 44px;
        background-color: rgba(255, 255, 255, .93);
        box-sizing: border-box;
        border-radius: 50%;
        border: 1px solid #ddd;
        box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .12);
    }

    #showArea {
        height: calc(100% - 40px);
    }

    .all-header {
        display: block;
    }

    .menu-header {
        display: none;
    }

    table tbody tr td:first-child p:first-child {
        min-width: 70px;
        max-width: 90px;
    }

    .imgList {
        display: inline-block;
    }

    .imgList img{
        width: 100%;
        max-width: 100%;
        margin: 10px 0;
        padding: 5px 0 0 0;
    }

    .imgList .right img{
        width: 100%;
    }

    .menuList {
        display: block;
    }

    .menuList .left {
        width: 100%;
    }

    .basisThisMenu {
        position: relative;
        background-color: aliceblue;
        padding: 10px;
        margin-left: 40px;
        margin-top: 20px;
        display: none;
    }

    .basisContent {
        margin-right: 0
    }

}


.myJs {margin-top: 10px; font-family: Menlo,Bitstream Vera Sans Mono,Monaco,Consolas,monospace;font-size: 12px;line-height: 22px; border-radius: 3px}
.hljs-emphasis,address,em{font-style:italic}.button,.strong,address,body,em,h1,h2,h3,h4,h5,h6,strong{font-family:pingfontweb,-apple-system,BlinkMacSystemFont,Helvetica Neue,Helvetica,Roboto,Arial,PingFang SC,Hiragino Sans GB,Microsoft Yahei,Microsoft Jhenghei,sans-serif}.button,.hljs-strong,.strong,strong{font-weight:700}.hljs-comment,.hljs-quote{color:#65737e}.hljs-deletion,.hljs-name,.hljs-regexp,.hljs-selector-class,.hljs-selector-id,.hljs-tag,.hljs-template-variable,.hljs-variable{color:#bf616a}.hljs-built_in,.hljs-builtin-name,.hljs-link,.hljs-literal,.hljs-meta,.hljs-number,.hljs-params,.hljs-type{color:#d08770}.hljs-attribute{color:#ebcb8b}.hljs-addition,.hljs-bullet,.hljs-string,.hljs-symbol{color:#a3be8c}.hljs-section,.hljs-title{color:#8fa1b3}.hljs-keyword,.hljs-selector-tag{color:#b48ead}.hljs{display:block;overflow-x:auto;background:#1f2127;color:#c0c5ce;padding:.5em}

.newTable img {
    max-width: none!important;
}

/*新平台弹窗提示*/
#newModal {
    display: none;
}

#newModal.open {
    display: block;
}

.new-website-modal-mask {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1000;
    height: 100%;
    background-color: rgba(0,0,0,.45);
    filter: alpha(opacity=50);
}

.new-website-modal {
    position: fixed;
    width: 300px;
    height: 180px;
    top: 35vh;
    left: 45%;
    border: 0;
    border-radius: 4px;
    -webkit-box-shadow: 0 4px 12px rgb(0 0 0 / 35%);
    box-shadow: 0 4px 12px rgb(0 0 0 / 35%);
    pointer-events: auto;
    z-index: 100000;
    background-color: white;
}

.new-website-modal .modal-body {
    padding: 15px 12px;
    text-align: center;
    line-height: 32px;
}

.new-website-modal .modal-btn {
    padding: 12px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}