/* extracted from diy_header.html */

        /*阿里字体库 BEGIN*/
        @font-face {font-family: 'iconfont';
            src: url('/static/plugins/iconfont/iconfont.eot'); /* IE9*/
            src: url('/static/plugins/iconfont/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
            url('/static/plugins/iconfont/iconfont.woff') format('woff'), /* chrome、firefox */
            url('/static/plugins/iconfont/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
            url('/static/plugins/iconfont/iconfont.svg#uxiconfont') format('svg'); /* iOS 4.1- */
        }
        .iconfont{font-family:"iconfont" !important;font-size:16px;font-style:normal;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
        /*阿里字体库 END*/
        @media screen and (min-width: 980px) {
            .wap {
                display: none;
            }

            .pc {
                display: block;
            }
        }

        @media screen and (max-width: 980px) {
            .wap {
                display: block;
            }

            .pc {
                display: none;
            }
        }
    

        .cygl {
            margin-top: 20px;
        }
        .el-select .el-input .el-select__caret.is-reverse{
            position: relative;
            top: -4px;
        }
        .el-select .el-input .el-select__caret{
            position: relative;
            top: 1px;
        }
        .el-select-dropdown__item{
            color: #0A0B0E;
        }
        .cygl ul:after {
            content: ".";
            display: block;
            height: 0;
            visibility: hidden;
            clear: both;
        }

        .cygl ul li {
            float: left;
            width: 245px;
            background: #ffffff;
            margin-right: 20px;
            padding: 14px 24px;
            height: 124px;
        }

        .cygl ul li:last-child {
            margin-right: 0;
            padding: 14px 15px;
            width: 238px;
        }

        .cygl ul li:nth-child(2), .cygl ul li:nth-child(3),
        .cygl ul li:nth-child(4) {
            width: 240px;
        }

        .cygl ul li dl {
            margin-top: 5px;
        }

        .cygl ul li dl:last-child {
            margin-top: 16px;
        }

        .cygl ul li dl dt {
            font-size: 16px;
            color: #808080;
            line-height: 14px;
        }

        .cygl ul li dl dd {
            font-size: 28px;
            color: #0063fe;
            font-weight: 700;
            line-height: 34px;
            margin-top: 16px;
            font-family: 'PingFangSC-Semibold, sans-serif' !important;
        }

        .cygl ul li dl dd.sub {
            font-size: 18px;
            margin-top: 0;
            color: #207EC5;
            font-weight: 500
        }

        .cygl ul li dl dd span {
            display: inline-block;
            /*background-image: url(https://c1.gasgoo.com/sns/default/images/overview/arrow_upnews@2x.png);*/
            background-position: center 0;
            background-size: 19px;
            background-repeat: no-repeat;
            /*width: 18px;*/
            vertical-align: top;
        }
        .cygl ul li dl dd span:first-child{
            font-family: Avenir !important;
            font-size: 32px;
        }
        .cygl ul li dl dd span:nth-child(2){
            position: relative;
            top: 3px;
        }

        .hotkeys:after {
            content: ".";
            display: block;
            height: 0;
            visibility: hidden;
            clear: both;
        }

        .hotkeys {
            margin-top: 12px;
        }

        .hotkeys a {
            display: inline-block;
            font-size: 14px;
            width: 60px;
            text-align: center;
            color: #333;
            float: left;
            line-height: 20px;
            margin-bottom: 22px;
        }

        .hotkeys a.blueTxt {
            color: #026AB0;
        }

        .hotkeys
        a.yellowTxt {
            color: #FF9D00;
        }

        .cyLayer {
            background: #ffffff;
            margin-top: 20px;
        }

        .cyLayer ul:after {
            content: ".";
            display: block;
            height: 0;
            visibility: hidden;
            clear: both;
        }

        .cyLayer ul {
            padding: 20px 0;
        }

        .cyLayer ul li {
            float: left;
            width: 268px;
            height: 178px;
            position: relative;
            margin-left: 19px;
        }

        .cyLayer ul li:last-child {
            margin-right: 0;
        }

        .cyLayer ul li a {
            display: block;
        }

        .cyLayer ul li img {
            display: block;
            width: 100%;
        }

        .cyLayer ul li a em {
            display: block;
            width: 32px;
            height: 32px;
            position: absolute;
            bottom: 0;
            right: 0;
        }

        /*弹层*/
        .blackLayerbg {
            background: rgba(0, 0, 0, 0.5);
            width: 100%;
            height: 100%;
            position: fixed;
            top: 0;
            left: 0;
            z-index: 99;
        }

        .openAccount {
            background: #ffffff;
            width: 380px;
            height: 540px;
            border-radius: 2px;
            position: fixed;
            left: 50%;
            top: 50%;
            margin-left: -190px;
            margin-top: -270px;
            z-index: 100;
        }

        .popClose {
            background: url("/WebResource/sns/default/images/pop_close@2x.png") no-repeat;
            background-size: 16px;
            width: 16px;
            height: 16px;
            position: absolute;
            top: 12px;
            right: 12px;
        }

        .closeIcon {
            text-align: right;
            padding: 10px 10px 0 0;
        }

        .closeIcon a {
            background: url(/WebResource/sns/default/images/pop_close@2x.png) no-repeat;
            background-size: 16px 16px;
            width: 16px;
            height: 16px;
            display: inline-block;
        }

        .openAccount b {
            display: block;
            font-size: 22px;
            color: #333333;
            text-align: center;
        }

        .openAccount ul {
            padding: 0 40px;
        }

        .openAccount
        ul li {
            width: 298px;
            height: 40px;
            border: 1px solid #EBEBEB;
            border-radius: 4px;
            margin-top: 20px;
        }

        .openAccount ul li input {
            width: 282px;
            height: 35px;
            padding-left: 16px;
            font-size: 14px;
            line-height: 40px;
        }

        .openAccount
        ul li input::-webkit-input-placeholder {
            color: #BBBBBB;
        }

        .openAccount
        ul li input:-moz-placeholder {
            color: #BBBBBB;
        }

        .openAccount ul li input::-moz-placeholder {
            color: #BBBBBB;
        }

        .openAccount ul li input::-ms-input-placeholder {
            color: #BBBBBB;
        }

        .openAccount p {
            display: block;
            text-align: center;
            font-size: 12px;
            color: #999999;
            margin-top: 20px;
        }

        .openAccount a.uploadBut {
            display: block;
            background: #00578F;
            width: 300px;
            height: 42px;
            border-radius: 4px;
            font-size: 14px;
            color: #ffffff;
            text-align: center;
            line-height: 42px;
            margin: 10px auto 0;
        }

        .tip {
            color: #fff;
            font-size: 16px;
            display: block;
            width: 300px;
            position: fixed;
            background: #000;
            border-radius: 0.3em;
            text-align: center;
            line-height: 32px;
            left: 39%;
            top: 50%;
            z-index: 10000;
            padding: 10px 20px;
        }

        .submitLayer, .submitLayersend {
            width: 240px;
            background: #FFFFFF;
            border-radius: 4px;
            position: fixed;
            top: 50%;
            left: 50%;
            margin-left: -120px;
            margin-top: -110px;
            padding: 30px;
            z-index: 300;
        }

        .submitLayer em, .submitLayersend em {
            display: block;
            background: url(/WebResource/sns/default/images/com_icon_suc@2x.png) no-repeat;
            background-size: 50px;
            width: 50px;
            height: 50px;
            margin: 8px auto 0;
        }

        .submitLayer p, .submitLayersend p {
            display: block;
            text-align: center;
            font-size: 16px;
            margin-top: 14px;
        }

        .disabled {
            pointer-events: none;
        }

        .openAccount {
            height: auto !important;
            padding-bottom: 20px;
        }

        .emailTips {
            margin-top: 10px;
            margin-left: 41px;
        }

        .emailTips em {
            background: url(https://c1.gasgoo.com/sns/default/images/person/icon_mailerror_tips@2x.png) no-repeat left center;
            background-size: auto 12px;
            color: #ff0000 !important;
            font-size: 12px;
            line-height: 18px !important;
            padding-left: 16px;
            text-align: left;
            margin-top: 0 !important;
            margin-right: 24px;
        }

        .emailTips p {
            line-height: 18px;
            font-size: 12px;
            color: #666666;
            display: inline-block;
            margin-top: 2px;
        }

        .emailTips
        a {
            color: #006AB0;
            line-height: 18px;
            font-size: 12px;
        }
    

        .nav2022 ul li.navCur2022 ol li a {
            background: none;
        }

        .nav2022 ul li {
            position: relative;
        }

        .nav2022 ul li ol {
            box-shadow: 0px 1px 4px 0px rgba(195, 195, 195, 0.5);
            width: 140px;
            position: absolute;
            left: 0;
            top: 58px;
            background: #ffffff;
            z-index: 999;
        }

        .nav2022 ul li ol li a {
            height: 38px;
            text-align: center;
            font-size: 14px;
            line-height: 38px;
            color: #666666;
            width: 130px;
            padding: 0;
            border-bottom: 1px solid #ededed;
        }

        .nav2022
        ul li ol li a:hover {
            background: none;
            /*color: #00578f;*/
        }

        .supplierSwitchTab {
            display: none;
        }

        .supplierTab:hover .supplierSwitchTab {
            display: block;
        }

        .supplierSwitchTab:hover {
            display: block;
        }

        .nav2022 ul li em.naNew {
            position: absolute;
            top: 7px;
            right: 15px;
            height: 10px;
        }

        .nav2022 ul
        li em.naNew img {
            margin: 0;
            border: 0;
            padding: 0;
            font-style: normal;
            list-style: none;
            vertical-align: text-top;
        }

        .nav2022 ul li s {
            background: url(https://c1.gasgoo.com/sns/default/images/new1.png) no-repeat left center;
            background-size: 25px 14px;
            width: 25px;
            height: 14px;
            display: block;
            position: absolute;
            right: 3px;
            top: 15px;
        }

        /*小程序落地页*/
        .littleSystem {
            height: 100vh;
            background: url(https://c2.gasgoo.com/app/cn/image/bottombg@3x.png) no-repeat left bottom;
            background-size: 100% auto;
        }

        .sMain {
            padding: 0 5%;
            width: 90%;
            position: absolute;
            top: 50%;
            left: 50%;
            -moz-transform: translate(-50%,
            -50%);
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%,
            -50%);
            transform: translate(-50%, -50%);
        }

        .wap {
            background-color: #fff;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0px;
            bottom: 0px;
        }

        .wap-loading {
            position: absolute;
            top: 40%;
            left: 50%;
            transform: translate(-50%,
            -50%);
            text-align: center;
        }

        .wap-loading img {
            max-width: 100%;
            height: auto;
        }

        .wap-loading p {
            display: block;
            text-align: center;
            font-size: 14px;
            color: #999999;
        }
    

    .diy-company-nav .search {
        position: relative
    }

    .diy-company-nav .banner-search {
        background: #fff;
        border-radius: 10px;
        display: flex;
        height: 56px;
        /*margin: 24px auto 0;*/
    }

    .diy-company-nav .el-input {
        flex: 1
    }

    .diy-company-nav .el-input__inner {
        border: none;
        border-radius: 10px;
        color: #0A0B0E;
        height: 56px
    }

    .diy-company-nav .search-link {
        background: #2875e8;
        border-radius: 6px;
        color: #fff;
        height: 48px;
        line-height: 48px;
        margin: 4px 4px 0 0;
        width: 100px
    }

    .diy-company-nav .search-more {
        color: #fff;
        cursor: pointer;
        font-size: 14px;
        margin-left: 10px;
        position: absolute;
        right: 14%;
        top: 20px
    }

    .diy-select .el-input__inner, .diy-select .el-input__inner:focus {
        border: none !important;
        color: #0a0b0e;
    }

    .message-bubble {
        position: absolute;
        top: 2px;
        right: 5px;
        background-color: #ff4d4f;
        border-radius: 50%;
        width: 9px;
        height: 9px;
    }


    .el-input__inner{
        height: 35px;
    }
    .el-input__suffix-inner{
        line-height: 45px;
    }

    .el-color-picker__icon, .el-input, .el-textarea {
        display: inline-block;
        width: 80%;
    }
    .search-data-yk,
    .search-project-compang-yk{
        width: 520px;
        color: #0A0B0E;
        background: #fff;
        box-shadow: 0 4px 24px -2px rgba(42,60,94,0.12);
        border: 1px solid #FFFFFF;
        padding: 16px;
        z-index: 900;
        position: absolute;
        display: none;
        box-sizing: border-box;
    }
    .search-data-yk .search-data-yk-box:nth-child(2){
        margin-top: 24px;
    }
    .search-data-yk-box-con{
        display: flex;
        flex-wrap: wrap;
    }
    .search-data-yk-box-con span{
        cursor: pointer;
    }
    .search-data-yk-box-tit{
        margin-bottom: 18px;
    }
    .search-data-yk-box-tit span{
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
    }
    .search-data-yk-box-con a{
        padding: 4px 8px;
        background-color: #EFF1F4;
        font-size: 12px;
        color: #0A0B0E;
        margin: 6px 8px 6px 0;
    }
    .search-data-yk-box-con a:hover{
        color: #fff;
        background-color: #0063FE;
    }

    .search-project-compang-yk-top{
        color: #7F8388;
        line-height: 20px;
        margin-bottom: 16px;
    }
    .search-project-compang-yk-box-tit{
        height: 40px;
        background-color: #F1F3F6;
        line-height: 40px;
        padding: 0 14px;
        display: flex;
        justify-content: space-between;
    }
    .search-project-compang-yk-box-tit i{
        font-style: normal;
        color: #7F8388;
        font-size: 14px;
        cursor: pointer;
    }

    .search-project-compang-yk-box-tit i:after{
        content: '';
        display: inline-block;
        vertical-align: middle;
        width: 16px;
        height: 16px;
        background: url('/static/diy/image/ic_16_next2x.png') no-repeat;
        background-size: contain;
        margin-left: 10px;

    }
    .search-project-compang-yk-box-con{
        margin: 6px 0;
        max-height: 230px;
        overflow-y: auto;
        overflow-x: hidden;

    }
    .search-project-compang-yk-box-con::-webkit-scrollbar {
        width: 8px; /* 垂直滚动条宽度 */
        height: 8px; /* 水平滚动条高度 */
    }
    .search-project-compang-yk-box-con::-webkit-scrollbar-track {
        background-color: #f1f1f1; /* 滚动条轨道背景色 */
        border-radius: 4px; /* 轨道圆角 */
    }
    .search-project-compang-yk-box-con::-webkit-scrollbar-thumb {
        background-color: #c1c1c1; /* 滚动条滑块颜色 */
        border-radius: 4px; /* 滑块圆角 */
    }
    .search-project-compang-yk-box-con::-webkit-scrollbar-thumb:hover {
        background-color: #a1a1a1; /* 鼠标悬停时滑块颜色 */
    }
    /* Internet Explorer 和 Edge 旧版本滚动条样式 */
    .search-project-compang-yk-box-con {
        -ms-overflow-style: -ms-autohiding-scrollbar; /* 自动隐藏滚动条 */
    }

    /* Firefox 浏览器滚动条样式 */
    .search-project-compang-yk-box-con {
        scrollbar-width: thin; /* 滚动条宽度 */
        scrollbar-color: #c1c1c1 #f1f1f1; /* 滑块颜色和轨道颜色 */
    }
    .search-project-compang-yk-box-con a{
        display: block;
        width: 488px;
        padding: 16px;
        height: 74px;
        box-sizing: border-box;
    }
    .search-project-compang-yk-box-con a:hover{
        background-color: rgba(0, 99, 254, 0.08);
    }
    .search-project-compang-yk-box-con a span{
        display: block;
    }
    .search-project-compang-yk-box-con a span:first-child{
        font-weight: 600;
        color: #25262A;
        font-size: 14px;
    }
    .search-project-compang-yk-box-con a span:nth-child(2){
        color: #7F8388;
        font-size: 12px;
        margin-top: 4px;
    }
    #txtnewsearchKeyOuter{
        position: relative;

    }
    #txtnewsearchKeyOuter em{
        position: absolute;
        right: 16px;
        top: 50%;
        background: url('/static/diy/image/ic_16_close@2x.png') no-repeat;
        background-size: contain;
        width: 17px;
        height: 17px;
        transform: translateY(-50%);
        cursor: pointer;
        display: none;
    }

    #my-search-tools{
        right: 66px;
        overflow-y: hidden;
    }

    .search-project-compang-yk-box-con-empty{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 200px;
        font-size: 14px;
        margin:12px auto 0 auto
    }
    .search-project-compang-yk-box-con-empty i{
        color: #7F8388;
        margin-top: 12px;
        font-size: 14px;
        font-style: normal;
    }
    .search-project-compang-yk-box-con-empty img{
        width: 120px;
        height: 120px;
    }

    #txtnewsearchKey{
        /* 验收#24: 搜索框边框对齐稿灵 #e0e2e3 */
        border-color: #e0e2e3;
    }
    .mainMenuTitle .catalog-header{
        height: 48px;
        padding:0;
        align-items: center;
        padding-left: 14px;
    }

    .nav2022 ul li a{
        /*height: 48px;*/
        /*line-height: 48px;*/
    }
    .mainMenuTitle{
        height: 48px;
    }
    .diy-noLoUser dl dd em{
        padding-top:0;
        margin-top: 0;
        line-height: 1.6;
        color: #0a0b0e;
    }

    .el-popper .popper__arrow, .el-popper .popper__arrow::after{
        border-style: none !important;
    }
    .el-select-dropdown{
       margin-left: -10px;
    }
    .el-select-dropdown__list{
        box-shadow: 0px 4px 24px -2px rgba(42,60,94,0.12);
    }
    .el-select-dropdown__item.selected{
        color: #0063fe;
    }


    .layui-layer-dialog .layui-layer-content .layui-icon-tips{
        background:url("/static/diy/image/center/ic_remind_warning@2x.png") no-repeat;
        background-size: contain;
        background-position: center center;
        width: 20px;
        height: 20px;
        top: 19px;
        left: 26px;
    }
    .layui-icon-tips:before{
        content: '' !important;
    }
    .layui-layer-dialog .layui-layer-padding{

    }
    .layui-layer-btn{
        padding: 0 15px 20px;
    }
    .diy-noLoUser dl dd{
        width: 102px;
    }

    .layui-icon-success:before{
        content: '' !important;
        background: url("/static/diy/image/center/ic_remind_complete@2x.png") no-repeat;
        background-size: contain;
        width: 20px;
        height: 20px;
        display: block;
        position: relative;
        left: 13px;
        top:2px;
    }
    .el-select-dropdown{
        border-radius: 0;
        border:0;
    }

    .el-icon-arrow-up:before{
        content: '' !important;
        background: url("/static/diy/image/ic_16_nextr_black@2x.png") no-repeat;
        background-size: contain;
        width: 14px;
        height: 14px;
        display: block;
        position: relative;
        top:9px;

    }
    .el-select .el-input .el-select__caret.is-reverse{
        top: 1px;
    }
    .el-select .el-input .el-select__caret.is-reverse:before{
        /*过渡*/
        transition: transform .3s, -webkit-transform .3s;
        background: url("/static/diy/image/ic_16_expand_black@2x.png") no-repeat;
        background-size: contain;
    }
    .el-icon-arrow-up{
        transform:none!important;
    }
    .diy-text-wrap{
        display: inline-block;
        line-height: 1.2;
        margin: 0 auto;
        max-width: 2em;
        word-break: break-all;
        color: #fff !important;
    }
    .diy-company-logo{
        border: 1px solid #ebebeb;
        border-radius: 4px;
        float: left;
        width: 68px;
        height: 68px;
        background-color: #8ca3cc;
        align-items: center;
        color: #fff;
        display: flex;
        font-size: 20px;
        font-weight: 700;
        justify-content: center;
        text-align: center;
    }




    .nav2022 ul li > a:hover{
        /*font-weight: normal;*/
        height: 40px;
    }
    .diy-header-nav-list{
        position: relative;
    }
    .nav2022 ul li a:hover, .nav2022 ul li.navCur2022 a{
        color: #0063fe;

    }
    .secDinfo dl dd a:hover,
    .secDinfo dl dt{
        height: auto !important;
        line-height: normal !important;
    }





    .nav2022 ul li.navCur2022 ol li a {
        background: none;
    }

    .nav2022 ul li {
        position: relative;
    }

    .nav2022 ul li ol {
        box-shadow: 0px 1px 4px 0px rgba(195, 195, 195, 0.5);
        width: 140px;
        position: absolute;
        left: 0;
        top: 58px;
        background: #ffffff;
        z-index: 999;
    }

    .nav2022 ul li ol li a {
        height: 38px;
        text-align: center;
        font-size: 14px;
        line-height: 38px;
        color: #666666;
        width: 130px;
        padding: 0;
        border-bottom: 1px solid #ededed;
    }

    .nav2022
    ul li ol li a:hover {
        background: none;
        color: #00578f;
    }

    .supplierSwitchTab {
        display: none;
    }

    .supplierTab:hover .supplierSwitchTab {
        display: block;
    }

    .supplierSwitchTab:hover {
        display: block;
    }

    .nav2022 ul li em.naNew {
        position: absolute;
        top: 7px;
        right: 15px;
        height: 10px;
    }

    .nav2022 ul
    li em.naNew img {
        margin: 0;
        border: 0;
        padding: 0;
        font-style: normal;
        list-style: none;
        vertical-align: text-top;
    }



/* extracted from diy_footer.html */

    .diy-footer-header {
        width: 1200px;
        margin: 0 auto;
        padding: 15px 0 24px 0;
    }
    .diy-footer-header hr{
        background-color: #EAEDF0;
    }

    .diy-footer-header ul {
        display: flex;
        margin-bottom: 10px;
    }
    .diy-footer-header ul li:first-child{
        padding:0 8px 8px;
    }
    .diy-footer-header ul li:last-child {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        color: #0A0B0E;
    }

    .diy-footer-header .diy-logo img {
        width: 180px;
    }

    .footer2022 dl dd p{
        color: #0A0B0E;
    }
    .btxt{
        color: #B5BBC3;
        padding-bottom: 29px;
    }
    .footer2022{
        background-color: #FFFFFF;
    }
    .copy2022{
        border:none;
        margin-top: 24px;
        padding: 0;
    }

    .common2022 .daohang li{
        width: auto;
        height: auto;
        color: #0A0B0E;
        padding: 0 8px;
    }
    .common2022 .daohang li a{
        color: #0A0B0E;
        font-size: 16px;
    }
    .common2022 .daohang li:first-child{
        padding-left: 0;
    }

    .footer2022 dl dd p{
        margin-top: 10px;
    }
    .footer2022 dl dd p.info1,
    .footer2022 dl dd p.info2,
    .footer2022 dl dd p.info3{
        display: flex;
        align-items: center;
    }
    .footer2022 dl dd p.info1{
        margin-top: 53px;

    }
    .footer2022 dl dd p.info1::before{
        content: "";
        display: block;
        width: 16px;
        height: 16px;
        margin-right: 10px;
        background: url("/static/diy/image/ic_32_iPhone@2x.png") no-repeat;
        background-size: 100% 100%;
    }

    .footer2022 dl dd p.info2::before{
        content: "";
        display: block;
        width: 16px;
        height: 16px;
        margin-right: 10px;
        background: url("/static/diy/image/ic_32_email@2x.png") no-repeat;
        background-size: 100% 100%;
    }
    .footer2022 dl dd p.info3::before{
        content: "";
        display: block;
        width: 16px;
        height: 16px;
        margin-right: 10px;
        background: url("/static/diy/image/ic_32_address@2x.png") no-repeat;
        background-size: 100% 100%;
    }
    .qrcode-diy{
        position: absolute;
        right: 0;
        top: 0;
    }
    .qrcode-diy li:last-child{
        margin-right: 0;
    }
    .footer2022 span{
        color: #1A202A;
        text-align: center;
    }
    .footer2022 dl dd ul{
        margin-top: 0;
    }

/* extracted from base_right_info.html */

    * {
        font-family: PingFangSC-Regular, PingFang SC;
    }
    div.right-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: fixed;
        right: 24px;
        bottom: 48px;
        /*transform: translateY(50%);*/
        z-index:99999999;
    }

    div.right-top {
        background: linear-gradient(180deg, #0C59FC 0%, #478EFF 100%);
        width: 52px;
        height: 141px;
        box-shadow: 0px 2px 24px -2px rgba(42, 60, 94, 0.12);
        border-radius: 26px;
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 14px;
        color: #fff;
        position: relative;
        cursor: pointer;
    }

    div.right-top div.top-1 {
        width: 24px;
        height: 24px;
        background: url('/static/diy/image/right-fixed-top.png') no-repeat;
        background-size: 24px 24px;
        margin-top: 20px;
    }

    div.right-top div.top-2 {
        writing-mode: vertical-rl;
        text-orientation: upright;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
        letter-spacing: 4px;
        margin-top: 8px;

    }

    div.right-top div.top-3 {
        width: 229px;
        height: 142px;
        color: #0A0B0E;
        font-size: 20px;
        background: #FFFFFF;
        padding: 20px;
        box-shadow: 0px 2px 24px -2px rgba(42,60,94,0.12);
        background: linear-gradient( 180deg, #F5F6F6 0%, #FFFFFF 100%);
        border: 1px solid #FFFFFF;
        position: absolute;
        right: 74px;
        top: 0;
        display: none;
        box-sizing: border-box;
    }

    .sanjiao-diy {
        position: absolute;
        right: -10px;
        top: 50%;
        transform: translateY(-50%);
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid #FFFFFF;
    }
    .sanjiao2-diy {
        position: absolute;
        right: -10px;
        top: 50%;
        transform: translateY(-50%);
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid #FFFFFF;
    }


    div.right-top div.top-3 p {
    }

    div.right-top div.top-3 p.top-p1 {
        font-weight: 600;
        font-size: 20px;
        line-height: 30px;
    }

    div.right-top div.top-3 p.top-p2 {
        font-weight: 600;
        line-height: 36px;
        font-size: 24px;
        color: #0063FE;
        margin-top: 6px;
    }

    div.right-top div.top-3 p.top-p3 {
        font-size: 14px;
        color: #7F8388;
        line-height: 20px;
        margin-top: 10px;
        letter-spacing: 1px;
    }

    div.right-bottom {
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        width: 52px;
        height: 195px;
        background: linear-gradient(180deg, #F0F2F6 0%, #FFFFFF 100%);
        box-shadow: 0px 2px 24px -2px rgba(42, 60, 94, 0.12);
        border-radius: 26px;
        border: 1px solid #FFFFFF;
        font-size: 10px;
        margin-top: 14px;
    }

    div.right-bottom-wechat,
    div.right-bottom-offical,
    div.right-bottom-miniapp {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        cursor: pointer;
    }
     .qrcode-hide{
        display: none;
     }
    .wechat-qrcode,
    .offical-qrcode,
    .miniapp-qrcode {
        width: 190px;
        height: 184px;
        text-align: center;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        position: absolute;
        right: 74px;
        top:-69px;
        background: #fff;
        background: linear-gradient( 180deg, #F5F6F6 0%, #FFFFFF 100%);
        box-shadow: 0px 2px 24px -2px rgba(42,60,94,0.12);
        border: 1px solid #FFFFFF;
        font-size: 16px;
    }

    .wechat-qrcode img,
    .offical-qrcode img,
    .miniapp-qrcode img {
        width: 100px;
        height: 100px;
    }

    .wechat-qrcode span,
    .offical-qrcode span,
    .miniapp-qrcode span {
        font-size: 14px;
        margin-top: 9px;
        color: #25262A;
    }
    .diy-yk-footer{
        width: 52px;
        height: 52px;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #fff;
        border: 1px solid #FFFFFF;
        box-shadow: 0px 2px 24px -2px rgba(42,60,94,0.12);
        background: linear-gradient( 180deg, #F0F2F6 0%, #FFFFFF 100%);
        border-radius: 33px;
        margin-top: 14px;
        cursor: pointer;
    }
    .diy-yk-footer .footer-img{
        background: url('/static/diy/image/ic_16_nextr_gray.png') no-repeat;
        background-size: 24px 24px;
        width: 24px;
        height: 24px;
    }
    .diy-yk-footer:hover .footer-img{
        background-image: url('/static/diy/image/ic_16_nextr_gray_hover.png');
    }
    .right-bottom-wechat > span,
    .right-bottom-offical > span{
        font-size: 14px;
    }



/* 区块标题 title2022 全宽装饰线细化到1px(对齐设计: 0.5px全宽 + 1px蓝accent) */
.title2022{border-bottom-width:1px}