/*# zfa 2026/1/20 09:38:49 2022-5-13-others-ppgf-out */
@charset "UTF-8";body{font:14px/28px "微软雅黑","宋体";font-family:"STHeiti","Microsoft YaHei",Helvetica,Arial,sans-serif;background:#fff}
a{text-decoration:none}
img{image-rendering:-moz-crisp-edges;image-rendering:-o-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}
#app{overflow-x:hidden}
#app .header{position:fixed;background-color:#fff;z-index:9;min-width:1112px;height:80px;overflow:hidden;-webkit-box-shadow:rgba(0,0,0,0.08) 0 1px 5px;box-shadow:rgba(0,0,0,0.08) 0 1px 5px;width:100%;top:0}
#app .header .wrapper{overflow:hidden;height:34px;margin-top:23px}
#app .header .wrapper .logo{float:left;margin-left:56px}
#app .header .wrapper .logo img{height:34px}
#app .header .wrapper .divider{float:left;height:14px;width:1px;background-color:#cfd1d0;margin:0 16px;margin-top:10px}
#app .header .wrapper .title{float:left;font-size:16px;line-height:26px;font-weight:normal;color:#7a7d7a;height:100%;line-height:34px;font-weight:bold}
#app .main{position:relative;min-height:1000px;color:#333333;overflow:hidden;margin-top:80px}
#app .main .left{position:absolute;width:280px;min-width:280px;height:100%;border-right:solid #eeeeee 1px;background-color:#fff}
#app .main .left .nav{position:fixed;top:136px;left:56px}
@media screen and (max-height:750px){#app .main .left .nav{top:116px}}
@media screen and (max-height:730px){#app .main .left .nav{top:100px}}
#app .main .left .nav::before{content:"";position:absolute;height:100%;width:2px;left:0;top:0;background-color:#eeeeee}
#app .main .left .nav a{display:block;padding-left:22px;height:24px;font-size:14px;line-height:24px;color:#333333;position:relative;margin:32px 0}
#app .main .left .nav a:first-child{margin-top:0}
#app .main .left .nav a:last-child{margin-bottom:0}
#app .main .left .nav a:hover{color:#23c268}
#app .main .left .nav a.active{color:#23c268}
#app .main .left .nav a.active::before{background-color:#23c268}
#app .main .left .nav a::before{content:"";position:absolute;height:100%;width:2px;left:0;top:0;background-color:#eeeeee}
#app .main .right{margin-left:410px;overflow:hidden}
@media screen and (max-width:1800px){#app .main .right{margin-left:400px}}
@media screen and (max-width:1600px){#app .main .right{margin-left:390px}}
@media screen and (max-width:1400px){#app .main .right{margin-left:340px}
#app #topic-10 .panel-example img{width:102%}}
@media screen and (max-width:1400px){#app .main .right{margin-left:320px}}
#app .main .right .block{margin-right:375px;padding-top:35px;min-width:400px}
@media screen and (max-width:1800px){#app .main .right .block{margin-right:300px}}
@media screen and (max-width:1600px){#app .main .right .block{margin-right:225px}}
@media screen and (max-width:1400px){#app .main .right .block{margin-right:150px}}
@media screen and (max-width:1400px){#app .main .right .block{margin-right:50px}}
#app .main .right .block > .title{font-size:32px;line-height:42px;font-weight:bold;padding:46px 0 30px 0}
#app .main .right .block .description{font-size:14px;line-height:24px;font-weight:normal}
#app .main .right .block .title-row-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex}
@media screen and (max-width:1160px){#app .main .right .block .title-row-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column nowrap;flex-flow:column nowrap}}
#app .main .right .block .title-row{margin-top:40px}
#app .main .right .block .title-row .title{font-size:12px;line-height:22px;font-weight:normal;padding-bottom:17px;color:#666}
#app .main .right .block .title-row .title .lb-tag{display:inline-block;vertical-align:top;height:12px;line-height:12px;padding:7px 10px;font-size:12px;background:rgba(35,194,104,0.08);color:#0AAC3C;border-radius:7px;margin:-2px 4px 0}
#app .main .right .block .panel .item{border-radius:8px;background-color:#f6f6f6}
#app .main #topic-2{padding-bottom:6px}
#app .main #topic-3{padding-bottom:6px}
#app .main #topic-4{padding-bottom:6px}
#app .main #topic-5{padding-bottom:6px}
#app .main #topic-6{padding-bottom:6px}
#app .main #topic-7{padding-bottom:6px}
#app .main #topic-1 > .title{font-size:32px}
#app .main #topic-2 .title-row-wrapper .title-row,#app .main .modPanel .title-row-wrapper .title-row{width:48%;-ms-flex-negative:0;flex-shrink:0}
#app .main #topic-2 .title-row-wrapper .title-row:first-child,#app .main .modPanel .title-row-wrapper .title-row:first-child{margin-right:4%}
@media screen and (max-width:1160px){#app .main #topic-2 .title-row-wrapper .title-row{width:100%;margin-right:0 !important}
#app .main .modPanel .title-row-wrapper .title-row{width:100%;margin-right:0 !important}}
#app .main #topic-2 .panel,#app .main .modPanel .panel{display:-webkit-box;display:-ms-flexbox;display:flex}
#app .main #topic-2 .panel .item,#app .main .modPanel .panel .item{width:100%;height:180px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;overflow:hidden}
#app .main #topic-2 .panel .item img,#app .main .modPanel .panel .item img{max-width:90%}
#app .main #topic-2 .panel .item:hover .download,#app .main .modPanel .panel .item:hover .download{opacity:1}
#app .main #topic-2 .panel .item .download,#app .main .modPanel .panel .item .download{-webkit-transition:all 0.2s;transition:all 0.2s;opacity:0;position:absolute;width:100%;height:56px;background-color:rgba(0,0,0,0.4);bottom:0;left:0;border-radius:8px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
#app .main #topic-2 .panel .item .download a,#app .main .modPanel .panel .item .download a{color:#fff;font-size:14px;background:url(../assets/download.png) no-repeat left center;height:28px;line-height:28px;padding-left:24px;margin:0 27px;-webkit-transition:all 0.2s;-webkit-transition:all 0.2s ease;transition:all 0.2s ease}
#app .main #topic-2 .panel .item .download a:hover,#app .main .modPanel .panel .item .download a:hover{opacity:0.6}
#app .main #topic-3 .panel .item{height:230px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
#app .main #topic-3 .panel .item img{margin-left:48px}
@media screen and (max-width:1000px){#app .main #topic-3 .panel .item img{width:80%}}
#app .main #topic-4 .panel img,#app .main #topic-5 .panel img{width:100%}
#app .main #topic-5 .description{padding-bottom:16px}
#app .main #topic-5 .title-row{margin-top:24px}
#app .main #topic-6 .panel,#app .main #topic-7 .panel{position:relative;overflow:hidden;width:448px;height:252px}
#app .main #topic-6 .panel:hover .download,#app .main #topic-7 .panel:hover .download{opacity:1}
#app .main #topic-6 .panel .download,#app .main #topic-7 .panel .download{-webkit-transition:all 0.2s;transition:all 0.2s;opacity:0;position:absolute;width:100%;height:56px;background-color:rgba(0,0,0,0.4);bottom:0;left:0;border-radius:8px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
#app .main #topic-6 .panel .download a,#app .main #topic-7 .panel .download a{color:#fff;font-size:14px;background:url(../assets/download.png) no-repeat left center;height:28px;line-height:28px;padding-left:24px;margin:0 27px;-webkit-transition:all 0.2s;transition:all 0.2s}
#app .main #topic-6 .panel .download a:hover:hover,#app .main #topic-7 .panel .download a:hover:hover{opacity:0.6}
#app .empty{height:150px}
#app .footer{background:#333333;color:#9a9a9a;font-size:12px;margin:0;position:relative;z-index:2}
#app .footer > div{width:1200px;margin:0 auto;padding:20px 0 30px;background:#333333}
#app .footer em{color:#ffaf0f}
#app .footer .all-icon{background:url(../assets/all.png) no-repeat}
#app .footer .wenhuajingying{display:inline-block;height:22px;width:22px;background-position:-283px -34px;vertical-align:-5px;margin-right:2px}
#app .footer .share{float:right;color:white}
#app .footer .share a{text-decoration:none;display:inline-block;*display:inline;*zoom:1;margin-left:27px;float:none;font-size:12px;padding-left:0px;line-height:24px;height:24px;background:url("../assets/all.png") center no-repeat;cursor:pointer;vertical-align:middle}
#app .footer .share a.qq_1{height:24px;width:21px;background-position:-240px 0}
#app .footer .share a.wechat_1{height:23px;width:28px;background-position:-314px 0}
#app .footer .share a.weibo_1{height:26px;width:28px;background-position:-342px 0}
#app .footer .share a.wechat{height:30px;width:30px;background-position:-370px 0}
#app .footer .share a.qq{height:30px;width:30px;background-position:-400px 0}
#app .footer .share a.wb{height:30px;width:30px;background-position:-460px 0}
#app .footer .share a.qq_zone{height:30px;width:30px;background-position:-490px 0}
#app .footer .link{color:white;line-height:30px}
#app .footer .link-1{font-size:13px;font-weight:bold}
#app .footer .about{margin:15px 0}
#app .footer a{color:white}
#app .footer a:hover{color:#23c268;text-decoration:underline}
#app .footer .des{line-height:20px;margin-top:10px}
#app .footer .des a{color:#9a9a9a}
#app .main .modPanel .title-row .desc{font-size:14px;margin-top:24px;line-height:1.4}
#app .main .modPanel .title-row .desc dt{font-weight:bold}
#app .main .modPanel .title-row .desc dd{color:#7A7D7A;margin-top:16px}
.cGreen{color:#0AAC3C}
.cRed{color:#F16456}
#app .main #topic-10 .panel img{width:100%}
.cf{*zoom:1}
.cf:after{content:"";display:block;height:0;clear:both}
.fl{float:left}
.fr{float:right}
.btn-download{background:url(../assets/title-download-btn.png) no-repeat;width:150px;height:38px;overflow:hidden;line-height:99;margin-top:-4px}
.btn-download:hover{-webkit-filter:brightness(1.1);filter:brightness(1.1)}
#topic-10 b{font-weight:bold}
#app .main #topic-10 .title-row .title{padding-bottom:40px}
#topic-10 .title-row .panel{background:#131715;padding:80px 54px;border-radius:32px}
#topic-10 .title-row .panel p{font-size:16px;color:#fff;line-height:28px;margin-top:100px;margin-bottom:26px}
#topic-10 .title-row .panel img{display:block;border-radius:16px}
#topic-10 .panel-example{margin-top:120px}
#topic-10 .panel-example .title{font-size:16px;font-weight:bold;line-height:1;color:#3E403F}
#topic-10 .panel-example img{display:block;width:116%;height:auto;margin-top:40px}
.follow-item{height:30px}
.follow-item .follow-text{float:left;line-height:30px;font-size:14px;color:#666;margin-right:10px}
.follow-li{float:left;width:30px;height:30px;position:relative;margin-right:10px}
.follow-li:hover .inner{display:block}
.follow-li .inner{display:none;width:240px;height:160px;position:absolute;left:-122px;top:42px;background:#fff;-webkit-box-shadow:0 0 10px rgba(0,0,0,0.3);box-shadow:0 0 10px rgba(0,0,0,0.3);border-radius:5px;padding:30px 10px;z-index:100}
.follow-li .inner img{display:block;width:130px;height:130px;margin:0 auto}
.follow-li .inner p{height:22px;line-height:24px;font-size:14px;color:#333;text-align:center;margin-top:10px}
.follow-li .inner p span{color:#00BA0C;padding:0 3px}
.follow-li .it{background:url(../assets/follow-ico.png) no-repeat;display:block;width:30px;height:30px}
.follow-li .it:hover{opacity:0.8}
.follow-li .wx{background-position:0 0}
.follow-li .wb{background-position:-32px 0}
.follow-li .zh{background-position:-64px 0}
.follow-li .dy{background-position:-96px 0}
.follow-li .bz{background-position:-128px 0}
.footer .follow-item{float:right}
.footer .follow-li .inner{top:-240px}
.footer .follow-li{margin-left:15px}
.footer .follow-li .it{background-image:url(../assets/follow-ico-footer.png)}
#app .main #topic-2 .title-row-wrapper .panel .item:first-child{margin-right:0}
#app .main #topic-2 .title-row-wrapper .panel .item:first-child:only-child{width:100%}
#app .main #topic-2 .panel .item:first-child{margin-right:22px}
#app .main #topic-2 .panel .item:first-child:only-child{width:50%}
.block-inner{background:#F6F6F6;border-radius:32px;padding:48px;overflow:hidden;margin-top:40px}
.block-inner .title{font-size:20px;line-height:1.5;font-weight:bold;color:#131715;padding:0 0 30px 0}
.block-inner .description{font-size:14px;line-height:24px;font-weight:normal;color:#3E403F}
#app .main .modPanel .block-inner .panel .item{height:auto}
#app .main .modPanel .block-inner .panel .item img{max-width:100%}
#app .main #topic-11 .panel .item{padding:58px 32px;display:-webkit-box;display:-ms-flexbox;display:flex}
#app .main #topic-11 .panel .item img{max-width:100%}
#app .main #topic-12 .title-row{margin-top:0}
#app .main #topic-12 .panel .item{padding:58px 32px;display:-webkit-box;display:-ms-flexbox;display:flex}
#app .main #topic-12 .panel .item img{max-width:100%}