@charset "utf-8";
/* CSS Document */
/*全局*/
html { word-wrap: break-word; word-break: break-all; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; text-size-adjust: 100%;font: 12px/1.5 Microsoft Yahei,PingFang SC,Helvetica,Arial,Hiragino Sans GB,STHeiTi,sans-serif; -webkit-font-smoothing: antialiased;}
a, html { color: #111e36;}
div {display: block;}
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, center, cite, code, dd, del, details, button, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, input, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, select, small, span, strike, strong, sub, summary, sup, textarea, time, tt, u, ul, var, video { margin: 0; padding: 0; border: 0; font-size: 100%;font: inherit; vertical-align: baseline;}
body{margin:0; padding:0; color:#31424e;background: #eef1f9/*#f7f8fc*/; -webkit-text-size-adjust:none; }
ol,ul{list-style:none}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
img{border:none; vertical-align:top; -webkit-transition:opacity .2s; transition:opacity .2s; -ms-transition:none}
i,em{font-style:normal}
input,select,option,textarea{font-size:13px;font-family:Microsoft Yahei,tahoma,HELVETICA;outline:none}
a {color: #323232;text-decoration: none;}
a:hover {color:#0088FF;text-decoration: none;}
a:hover em,a:hover b,a:hover i,a:hover span{cursor:pointer}
a:hover img{opacity:0.9}
.clearfix{*zoom:1}
.clearfix:after{visibility:hidden; content:""}
.clear,.clearfix:after{clear:both; overflow:hidden;display:block}
.line-dotted {border-top: 1px #ccc dotted;height: 0;line-height: 0; font-size: 0;overflow: auto; margin: 5px 0; padding: 0;width: 100%;}
.bg-white{background-color:#fff; position: relative; }
.bg-gray{background-color:#f5f5f5; position: relative; }
.textC{text-align:center}
.ellipsis{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.ellipsis-two{overflow: hidden;text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2;-webkit-box-orient: vertical;}
.ellipsis-three{ overflow: hidden; text-overflow: ellipsis;display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical;}
.sticky-icon{position: absolute;left: -25px;top: 36px;display: block;width: 90px;height: 30px;line-height: 30px;background: #F60;color: #fff;font-size: 16px;font-weight: 500;text-align: center;transform: rotate(318deg);transform-origin:0% 0%;padding: 0;margin-left: 0px;z-index: 1;}
[class*=" icon-"],[class^=icon-]{font-family:"dnbs-icon" !important;font-size:13px;font-style:normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
[class^=designPage-] {width: 1280px; margin: 0 auto; min-height:200px;}

/******** design布局 ********/
.wrapper {width: 100%;  background: #eef1f9; overflow:hidden; }
.container{position: relative; max-width:1300px; margin:0 auto;}
.design-wrap{position: relative;display: block;min-height:600px; margin: auto;}
.design-section {position: relative;display: inline-block;width: 100%; margin: 0px auto 20px;}
.design-section .section-wrap {}
.design-section .section-content {}
.design-section .section-head {margin-bottom: 20px;}
.design-mainbar{float: left;width:950px;width: -webkit-calc(100% - 350px);}
.design-sidebar{float: right;width:330px;}
.flex{display: flex;justify-content: space-between;flex-direction: row;align-items: center; }
/*design-union*/
.design-union{width:100%;text-align: center;overflow:hidden;}
.design-union .pull-left{flex: 0 0 calc(100% - 330px);background: #FFF;}
.design-union .pull-right{width:330px;height:90px;background: #FFF;}
.design-union .pull-right img{width:100%;height:100%;;}
.design-union .wrap{display: flex;flex-direction: row;justify-content: space-between;align-items: center;overflow:hidden;background: #ffffff;border-radius: 5px;}
.design-union .content{min-height:90px;display: flex;justify-content: center;align-items: center;}
/**design-page-bg**/
.design-page-bg{position:absolute;left:0;right:0;top:0;padding-top:17.5vw;overflow:hidden}
.design-page-bg::after{content:'';display:block;position:absolute;left:0;right:0;bottom:0;top:40%;background:linear-gradient(0deg, #eef1f9, rgba(0,0,0,0))}
.design-page-bg .bg-wrap{position:absolute;left:50%;right:0;top:0;bottom:0;overflow:hidden}
.design-page-bg .bg-wrap::after{content:'';display:block;position:absolute;left:0;right:0;top:0;bottom:0}
.design-page-bg .bg-thumb{display:block; position:absolute;left:0;right:0;top:0;bottom:0; -webkit-transform:rotate(30deg);-moz-transform:rotate(30deg); -ms-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg); -webkit-filter:blur(30px);filter:blur(30px)}
.design-page-bg .bg-thumb .thumb{position:absolute;right:0;top:0;width:100%;height:100%;display:block; -o-object-fit:cover;object-fit:cover;-webkit-transform:scale(2); -moz-transform:scale(2);-ms-transform:scale(2);-o-transform:scale(2); transform:scale(2)}
.design-page-bg.bg-blue{background-color:#6acaff}
.design-page-bg.bg-blue .bg-wrap{left:0;}
.design-page-bg.bg-blue .bg-thumb{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg); -ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg); -webkit-filter:blur(30px);filter:blur(30px)}
.design-page-bg.bg-blue .bg-wrap::after{background:-webkit-linear-gradient(192.6deg, rgba(250,250,250,0.2) 2%, #6acaff 80%);background:-moz- oldlinear-gradient(192.6deg, rgba(250,250,250,0.2) 2%, #6acaff 80%);background:-o-linear-gradient(192.6deg, rgba(250,250,250,0.2) 2%, #6acaff 80%);linear-gradient(257.4deg, rgba(250, 250, 250, 0.2) 2%, rgb(106 202 255 / 60%) 20%)}
.design-page-bg.bg-height{padding-top:12.5vw;}

.group-singular-bg .img {display: block;position: absolute;left: 0;right: 0;top: 0;bottom: 0;-webkit-transform: rotate(30deg);-moz-transform: rotate(30deg);-ms-transform: rotate(30deg);-o-transform: rotate(30deg);transform: rotate(30deg);-webkit-filter: blur(4px);filter: blur(4px);}

/*====== design-topbar ======*/
.design-topbar{min-width: 1280px; height: 35px; line-height: 35px; background: #2a2a32; font-size: 14px;overflow:hidden;}
.design-topbar .flex{display: flex;justify-content: space-between;flex-direction: row;align-items: center; }
.design-topbar .top-slogan{float:left;text-align:center; color: #f2f2f2; overflow:hidden;}
.design-topbar .top-slogan span{font-size: 14px;}
.design-topbar .top-menu {float:right;}
.design-topbar .top-menu a{ color: #eee; padding: 0 5px;}
.design-topbar .top-menu a:hover{ color:#ff5722;}
.design-topbar .top-menu a span{color:#63B73D; padding-right:5px;}

/*====== design-headbar ======*/
.design-header {height:80px;width: 100%; background: #fff; box-sizing: border-box;box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.05);z-index: 9999;}
.design-header .container {margin: 0 auto;/* display: flex; */align-items: center;overflow: hidden;}
.design-header .site-logo {display: flex;align-items: center;justify-content: center;height: 50px;float: left;margin: 15px 0;}
.design-header .site-logo a {display: inline-block;height: 60px;}
.design-header .site-logo img {width: 100%;height: 100%;}
.design-header .site-navbar {float: left;margin: 20px 0;/* width: 100%; *//* height: 100%;  display: flex;justify-content: space-between; */}
.design-header .site-navbar .site-menu {width: 100%;height: 100%;display: flex;align-items: center;gap: 30px;}
.design-header .site-navbar .site-menu li {margin: 0px;}
.design-header .site-navbar .site-menu li a {display: inline-block;color: #262626;line-height: 40px;font-size: 18px;position: relative;box-sizing: border-box;}
.design-header .site-navbar .site-menu li a::after {content: ''; position: absolute; bottom: 0;left: 50%; transform: translateX(-50%); width: 0%; height: 3px; background-color: #0088FF; transition: all 0.8s; border-radius: 4px;}
.design-header .site-navbar .site-menu li.active a, .design-header .site-navbar .site-menu li:hover a {color: #0088FF;}
.design-header .site-navbar .site-menu li.active a::after ,.design-header .site-navbar .site-menu li:hover a::after {width: 50%;}
.design-header .site-search {width: 160px;background-color: #fff;overflow: hidden;float: right;margin: 20px 0;}
.design-header .site-search .search-input {height: 40px;width: 100%;position: relative;display: flex;align-items: center;}
.design-header .site-search .search-input #search-input {height: 100%;width: 100%;box-sizing: border-box;background-color: #f2f2f2;border-radius: 100px;outline: none;border: none;padding-left: 20px;padding-right: 36px;font-size: 14px;}
.design-header .site-search .search-input .after-box {cursor: pointer;width: 16px;height: 16px;content: '';position: absolute;top: 40%;right: 6px;transform: translate(-50%, -50%);background: url(../images/sousuo.png) no-repeat center;
background-size: contain;}
.design-header .site-search .search-input .after-box .icon-search{position: absolute;top:2px;font-size: 18px;}
.design-header .site-search .search-input .after-box .icon-search:before{font-size: 18px;}

/*====== design-footer ======*/
.design-footer{padding:0px 0;overflow: hidden;}
.design-footer .friend-links{padding:15px 0;font-size:14px; background:#FFFFFF;}
.design-footer .friend-links h6{font-weight:bold;display:inline;margin:0;}
.design-footer .friend-links .friend-links-ul {color:#a1a1a1;display: flex;flex-wrap: wrap;justify-content: flex-start;gap: 10px;}
.design-footer .friend-links .friend-links-ul li{display: block;}
.design-footer .friend-links .friend-links-ul a{color:#a1a1a1;}
.design-footer .friend-links .friend-links-ul a:hover{color:#0088FF;}
.design-footer .footer-copy{background:#2a2a32;font-size:13px;color:#949498;letter-spacing:0;text-align:center; padding:15px 0}
.design-footer .footer-copy a{color:#949498;}
.design-footer .footer-copy a:hover{color:#fff}
.design-footer .footer-copy p{line-height:1.9;}
.design-footer .footer-copy p a{white-space:nowrap;margin:0 5px}
.design-footer .footer-copy .footer-bottom-menu{float: right;}
.design-footer .footer-copy .footer-bottom-menu li{display:inline;margin:0 2px}

/*page1*/
.list_page {margin: 20px auto 0;}
.pageLink {line-height: 30px;clear: both;font-family: "Microsoft Yahei", simsun;margin: 0px;display: flex;flex-direction: row;justify-content: center;align-items: center;gap: 10px;}
.pageLink a,.list_page a {margin: 0px 0px;padding: 0px 11px 0px;border: 1px solid #eee;background: #fff;text-align: center;display: inline;font-size: 14px;border-radius: 3px;}
.pageLink a:hover,.list_page a:hover {border: 1px solid #0088ff;background: #0088ff;color: #FFF;text-align: center;font-weight: normal;text-decoration: none;}
.pageLink b {margin: 0px 0px;padding: 0px 11px 0px;border: 1px solid #0088ff;background: #0088ff;color: #FFFFFF;text-align: center;display: inline;font-size: 14px;border-radius: 3px;}
.epages a,.epages b{padding: 0px 13px;line-height: 36px;}
/*page2*/
.showpage .epages {text-align: center;}
.epages {margin: 20px auto 0;font-family: "Microsoft Yahei", simsun;text-align: center;font-size: 15px;display: flex;justify-content: center;align-items: center;gap: 10px;}
.epages * {vertical-align: middle;}
.epages a {/* margin:0px 5px; */padding: 8px 13px 8px;border: 1px solid #eee;background: #fff;text-align: center;text-decoration: none;font-family: "Microsoft Yahei", simsun;border-radius: 4px;}
.epages a:hover {border: #0088ff 1px solid;background: #ffffff;text-decoration: none;color: #0088ff}
.epages input {margin-bottom: 0px;border: 1px solid #0096A5;height: 15px;padding-bottom: 1px;padding-left: 1px;margin-right: 1px;color: #0096A5}
.epages b {/* margin:0px 3px; */padding: 8px 13px;border: 1px solid #0088ff;background: #0088ff;color: #FFF;text-align: center;text-decoration: none;border-radius: 4px;}
.epages a,.epages b{padding: 0px 13px;line-height: 36px;}

/*crumb*/
.crumbs {position: relative;margin: 0px ;padding: 15px 0px;font-size: 14px;color: #FFF;overflow: hidden;}
.crumbs .container {display: flex;justify-content: space-between;}
.crumbs .crumbs-bread {float: left;display: inline;}
.crumbs .crumbs-bread a {color: #FFF;}
/*hot-topics*/
.hot-topics {display: block;color: #999;font-size: 14px;}
.hot-topics a{color: #999;}
.hot-topics a+a{margin-left:15px;}
.hot-topics a i{margin-right:3px;color: #999;}
.hot-topics a:hover,.hot-topics a:hover i{color: #ff6000;}
/**section-title**/
.section-title {position:relative; height: 30px;line-height: 30px;margin:0px 0 20px;overflow: hidden;display: flex;flex-direction: row;justify-content: space-between;}
.section-title .cat-name {display: block;font-size: 24px;line-height: 30px;font-weight: 400;}
.section-title .cat-menu {display: block;float: right;height: 30px;overflow: hidden;padding-top: 0px;font-size: 14px;display: flex;justify-content: center;align-items: center;gap: 15px;}
.section-title .cat-menu a{display: inline-block;height: 28px;line-height: 28px;padding: 0 8px;border: 1px solid #dbdee0;color: #5a5a5a; border-radius: 4px;-webkit-border-radius: 4px;-webkit-transition: none;-o-transition: none;transition: none;}
.section-title .cat-menu a:hover {color: #fff; background: #3385ff; border-color: #3385ff;}
.section-title .cat-menu a.current{color: #fff; background: #3385ff; border-color: #3385ff;}
.section-title .cat-menu .more{float: right;}
.section-title .hot-tags{margin-top: 0px;color: #999; }
.section-title .hot-tags a{line-height: 30px;padding: 0 8px; border: 0px solid #dbdee0;color: #8f8f8f; border-radius: 4px;}
.section-title .hot-tags a:hover { background: #e3efff; border-color: #dbe8fa;}
/**panel-title**/
.panel-title {position:relative; height: 30px;line-height: 30px;margin:5px 0 20px;overflow: hidden;display: flex;flex-direction: row;justify-content: space-between;}
.panel-title .panel-name {display: block;font-size: 24px;line-height: 30px;font-weight: 400;}
/*tags-title*/
.tags-title {font-size: inherit;font-weight: normal;color: #8a8a8a;text-align: center;position: relative;margin-bottom:0px;}
.tags-title::before {content: '';display: block;width: 100%;height: 0;border-bottom: 1px solid #f0f0f0;position: absolute;left: 0;right: 0;top: 50%;}
.tags-title span {position: relative;display: inline-block;padding: 0 30px;font-size: 16px;background-color: #fff;}
/*左侧h3标题开始*/
.itembox-title h3 {display: inline-block;height: 24px;line-height: 24px;position: relative;font-size: 18px;font-weight: bold;color: #358ff0;margin-bottom: 20px;display: flex;align-items: center;}
.itembox-title h3:before,.itembox-title h3:after {content: '';display: block;width: 5px;height: 20px;background: #358ff0;margin-top: 0px;}
.itembox-title h3:before {float: left;margin-right: 13px}
.itembox-title h3:after {float: right;margin-left: 13px}
.itembox-title h3 em {display: inline-block;vertical-align: middle;width: 28px;height: 24px;color: #FFFFFF;text-align: right;position: relative;/* top: -3px; */}
.itembox-title h3 em b {display: block;width: 100%;height: 36px;transform: skewY( 348deg);background: #358ff0;position: absolute;left: -2px;/* top: 50%; */margin-top: -6px;x}
.itembox-title h3 em big {display: block;width: 100%;height: 100%;text-align: right;position: relative;z-index: 1;/* top: -2px; */left: -6px;font-size: 20px;font-weight: bold;font-style: normal}
/*====== list-info ======*/
/*list-info-picul*/
.list-info-picul {display: block; margin: 0px;display: flex; flex-wrap: wrap;justify-content: flex-start; gap: 20px;}
.list-info-picul .item {/*width: -webkit-calc(20% - 16px);*/flex: 0 0 calc(20% - 16px); border-radius: 5px;box-shadow: 0px 1px 48px 0px rgba(0, 0, 0, 0.06);overflow: hidden;}
.list-info-picul .item .item-wrap {padding: 0px; overflow: hidden; position: relative;background: #fff;}
.list-info-picul .item .item-thumb {position:relative; display: inline-block; width: 100%; height: 165px; overflow: hidden;}
.list-info-picul .item .item-thumb img {width: 100%;min-height: 100%;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;}
.list-info-picul .item:hover .item-thumb img {transform:scale(1.14); -webkit-transform:scale(1.14); -ms-transform:scale(1.14); -o-transform:scale(1.14);}
.list-info-picul .item .item-main {padding: 10px 15px 15px;}
.list-info-picul .item .item-main .item-title {margin-bottom: 15px;height: 48px; line-height: 24px; font-size: 16px; font-weight: 400;}
.list-info-picul .item .item-main .item-title a{overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
.list-info-picul .item:hover .item-main .item-title a{color: #0088ff}
.list-info-picul .item .item-main .item-meta {font-size: 13px;overflow: hidden;display: flex;justify-content: space-between;align-items: center;}
.list-info-picul .item .item-main .item-meta span {color: #999;}
.list-info-picul .item .item-main .item-meta span a {color: #999;}
.list-info-picul .item .item-main .item-meta span a:hover {color: #FF6000;}
.list-info-picul .item .item-main .item-meta span.time {float:right;margin-right:0px;}
.list-info-picul .item .item-main .item-meta span.view {float:right;}
.list-info-picul .item .item-main .item-meta span.icon-view:before {margin-right:3px; font-size: 15px;}
.list-info-picul .item .item-main .item-meta .author a img{width:24px;height:24px;margin-right:5px;/*vertical-align:middle;*/border-radius:50px;padding:0px;border:0px solid #0088ff; -webkit-transition:-webkit-transform 0.4s ease-out;-moz-transition:-moz-transform 0.4s ease-out;transition:transform 0.4s ease-out;}
.list-info-picul .item .item-main .item-meta .author a:hover img{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);transform:rotate(360deg);}
/*list-info-imgul*/
.list-info-imgul {display: block;margin: 0px;overflow: hidden;display: flex;flex-direction: column; gap: 20px;}
.list-info-imgul .item {overflow: hidden;}
.list-info-imgul .item .item-thumb {position:relative;float: left;margin-right: 15px;width: 126px; height: 80px;overflow: hidden;border-radius: 5px;}
.list-info-imgul .item .item-thumb img{width: 100%;min-height: 100%;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;}
.list-info-imgul .item .item-thumb img:hover {transform:scale(1.04); -webkit-transform:scale(1.04); -ms-transform:scale(1.04); -o-transform:scale(1.04);}
.list-info-imgul .item .item-main {padding: 0px;}
.list-info-imgul .item .item-main .item-title {margin-bottom: 15px;height: 48px;line-height: 1.5; font-size: 16px; font-weight: 400; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
.list-info-imgul .item .item-main .item-meta {height: 18px;line-height: 18px;font-size: 12px;color: #999;overflow: hidden;display: flex; justify-content: space-between;}
.list-info-imgul .item .item-main .item-meta span{font-size: 14px; color: #999;}
.list-info-imgul .item .item-main .item-meta span a{color: #999;}
.list-info-imgul .item .item-main .item-meta span.time{float:right;margin-right:0px;}
.list-info-imgul .item .item-main .item-meta span.view{float:right;}  
.list-info-imgul .item .item-main .item-meta span.icon-view:before {margin-right:3px; font-size: 15px;}
.list-info-imgul .item .item-main .item-meta span.icon-date:before {margin-right:3px; font-size: 15px;}
/*list-topic-infoul*/
.list-topic-infoul {display: inline-block; margin:0px;}
.list-topic-infoul .item {width: 20%;float: left;overflow: hidden;}
.list-topic-infoul .item .item-wrap {margin: 10px; overflow: hidden; position: relative; display: block; background: #fff; border-radius: 6px;}
.list-topic-infoul .item .item-thumb {position:relative; width: 100%;height: 180px;overflow: hidden;}
.list-topic-infoul .item .item-thumb:after {position: absolute; content: '';display: block;left: 0;right: 0;bottom: 0;height: 20px;background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%, #fff 100%);background-image: linear-gradient(to bottom, rgba(255,255,255,0.7) 0%, #fff 100%);background-repeat: repeat-x;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3ffffff', endColorstr='#ffffffff', GradientType=0);z-index: 10;}
.list-topic-infoul .item .item-thumb img {width: 100%;min-height: 100%;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;}
.list-topic-infoul .item .item-term {position: absolute;top: 10px;left: 0;padding: 2px 5px;background: #ff6000;font-size: 14px;color: #fff;border-radius: 0px 5px 5px 0;}
.list-topic-infoul .item .item-term .term-i{}
.list-topic-infoul .item .item-info {padding: 0px 20px 15px;}
.list-topic-infoul .item .item-info .item-title{font-size: 18px;font-weight: bold;text-align: center;color: #323232;}
.list-topic-infoul .item .item-info .item-title:hover{color: #ff6000;}
.list-topic-infoul .item .item-info .item-desc{height: 40px;margin: 15px 0;line-height: 20px;font-size: 12px;overflow: hidden;color: #999;text-overflow: ellipsis;-webkit-line-clamp: 2;display: -webkit-box;-webkit-box-orient: vertical;}
.list-topic-infoul .item .item-info .item-meta {text-align: center;overflow: hidden;}
.list-topic-infoul .item .item-info .item-meta .btn-orange-border{display: block;font-size: 14px;color: #777;line-height:34px;overflow: hidden; background: #fafafa;border: 1px solid transparent;border-radius: 6px;}
.list-topic-infoul .item .item-info .item-meta .btn-orange-border:hover{color: #ffffff; background: #ff6000;}
.list-topic-infoul .item:hover .item-thumb img{transform:scale(1.04); -webkit-transform:scale(1.04); -ms-transform:scale(1.04); -o-transform:scale(1.04);}
.list-topic-infoul .item:hover .item-info .item-title{color: #ff6000;} 
/*list-topic-recul*/
.list-tags-recul {display: flex;justify-content: space-between;flex-wrap: wrap;gap:20px;}
.list-tags-recul .item {display: block;flex: 0 0 calc(16.666% - 16.666px);}
.list-tags-recul .item .item-wrap{display: block;padding: 20px;background-color: #fff;border-radius: 6px;overflow: hidden;-webkit-transition: all .2s;-o-transition: all .2s;-moz-transition: all .2s;transition: all .2s;box-shadow: 0px 1px 48px 0px rgba(0, 0, 0, 0.06);}
.list-tags-recul .item i {display: inline-block;vertical-align: top;margin-right: 10px;width: 24px;height: 24px;line-height: 24px;background: #E0E7FF;text-align: center;border-radius: 100%;overflow: hidden;}
.list-tags-recul .item .item-title {line-height: 24px;margin-bottom: 10px;white-space: nowrap;overflow: hidden;color: #323232;-o-text-overflow: clip;text-overflow: clip;}
.list-tags-recul .item .item-title strong {font-size: 16px;color: #323232;font-weight: 600;}
.list-tags-recul .item:hover .item-title strong {color: #0088ff;}
.list-tags-recul .item .item-desc {font-size: 13px;color: #8f8f8f;line-height: 18px;height:auto;text-align: center;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.list-tags-recul .item .item-desc em {color: #ff6000;}
.list-tags-recul .item:nth-child(2n+2) i {background: #E0E7FF;}
.list-tags-recul .item:nth-child(2n+3) i {background: #F6E2FF;}
.list-tags-recul .item:nth-child(2n+4) i {background: #FFEDE1;}
.list-tags-recul .item:nth-child(2n+5) i {background: #FFE8E8;}
/*.list-tags-recul .item:nth-child(2n+5) i {background: #DEFCFE;}
.list-tags-recul .item:nth-child(2n+6) i {background: #FEF5D7;}
.list-tags-recul .item:nth-child(2n+7) i {background: #D7FFE2;}
.list-tags-recul .item:nth-child(2n+8) i {background: #E0E7FF;}
.list-tags-recul .item:nth-child(2n+9) i {background: #DEFCFE;}
.list-tags-recul .item:nth-child(10) i {background: #FEF5D7;}
.list-tags-recul .item:nth-child(11) i {background: #D7FFE2;}
.list-tags-recul .item:nth-child(12) i {background: #E0E7FF;}*/

/*list-col-5*/
.list-col-5 { wrap;gap:15px;}
.list-col-5 .item {display: block;flex: 0 0 calc(20% - 12px);}
.list-col-5 .item .item-wrap{padding: 15px;background-color: #fff;border-radius: 10px;}
.list-col-5 .item i {margin-right: 8px;width: 24px;height: 24px;line-height: 24px;}
.list-col-5 .item .item-title {line-height: 24px;}
.list-col-5 .item .item-title .title {font-size: 15px;font-weight:500;}
/*list-col-4*/
.list-col-4 { wrap;gap:20px;}
.list-col-4 .item {display: block;flex: 0 0 calc(25% - 15px);}
.list-col-4 .item .item-wrap{background-color: #fff;border-radius: 5px;}
.list-col-4 .item i {margin-right: 8px;width: 24px;height: 24px;line-height: 24px;}
.list-col-4 .item .item-title {line-height: 24px;}
.list-col-4 .item .item-title .title {font-size: 15px;font-weight:500;}
.list-col-4 .item .item-thumb {height: 143px;}

/*list-topic-recul*/
.list-topic-recul {display: flex;justify-content: space-between;flex-wrap: wrap;gap:20px;}
.list-topic-recul .item {display:inline-block; flex: 0 0 calc(25% - 15px);overflow: hidden;box-shadow: 0px 1px 48px 0px rgba(0, 0, 0, 0.06);}
.list-topic-recul .item .item-wrap{position: relative;display: inline-block;padding: 20px 15px;background-color: #fff;overflow: hidden;border-radius: 6px;}
.list-topic-recul .item .item-patch {position: absolute;top: 2px;right: -28px;z-index: 1000;width: 80px; height: 18px;line-height: 18px; background:#0088ff;color: #ffffff; -webkit-transform: rotate(45deg);transform: rotate(45deg);font-size: 12px;text-align: center;}
.list-topic-recul .item .item-thumb {float: left;display: inline-block;margin-right: 15px;vertical-align: top;width: 63px;height: 63px;border-radius: 20%;overflow: hidden;}
.list-topic-recul .item .item-thumb img {width: 100%;height: 100%;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;}
.list-topic-recul .item:hover .item-thumb img {transform:scale(1.5); -webkit-transform:scale(1.5); -ms-transform:scale(1.5); -o-transform:scale(1.5);}
.list-topic-recul .item .item-main {}
.list-topic-recul .item .item-title{margin-bottom: 7px;font-size: 16px;color: #3c3c3c;line-height: 1.2;font-weight: 600;white-space: nowrap;overflow: hidden;color: #3c3c3c;-o-text-overflow: clip;text-overflow: clip;}
.list-topic-recul .item .item-desc {font-size: 12px;color: #8f8f8f;line-height: 18px;height: 36px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.list-topic-recul .item:nth-child(1) .item-wrap {background: linear-gradient(180deg, #E0E7FF 0%, #fff 100%);}
.list-topic-recul .item:nth-child(2) .item-wrap {background: linear-gradient(180deg, #F6E2FF 0%, #fff 100%);}
.list-topic-recul .item:nth-child(3) .item-wrap {background: linear-gradient(180deg, #FFEDE1 0%, #fff 100%);}
.list-topic-recul .item:nth-child(4) .item-wrap {background: linear-gradient(180deg, #FFE8E8 0%, #fff 100%);}
.list-topic-recul .item:nth-child(5) .item-wrap {background: linear-gradient(180deg, #DEFCFE 0%, #fff 100%);}
.list-topic-recul .item:nth-child(6) .item-wrap {background: linear-gradient(180deg, #FEF5D7 0%, #fff 100%);}
.list-topic-recul .item:nth-child(7) .item-wrap {background: linear-gradient(180deg, #D7FFE2 0%, #fff 100%);}
.list-topic-recul .item:nth-child(8) .item-wrap {background: linear-gradient(180deg, #E0E7FF 0%, #fff 100%);}

/*wlist-info-imgul*/
.wlist-info-imgul {display: block;overflow: hidden;display: flex;flex-direction: column; gap: 16px;}
.wlist-info-imgul .item {overflow: hidden;}
.wlist-info-imgul .item .item-thumb {position:relative;float: left;margin-right: 15px;width: 110px; height: 75px;overflow: hidden;border-radius: 6px;}
.wlist-info-imgul .item .item-thumb img{width: 100%;min-height: 100%;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;}
.wlist-info-imgul .item .item-thumb img:hover {transform:scale(1.04); -webkit-transform:scale(1.04); -ms-transform:scale(1.04); -o-transform:scale(1.04);}
.wlist-info-imgul .item .item-main {padding: 0px;}
.wlist-info-imgul .item .item-main .item-title {margin-bottom: 15px;height: 48px;line-height: 1.5; font-size: 15px;}
.wlist-info-imgul .item .item-main .item-title a{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
.wlist-info-imgul .item .item-main .item-meta {height: 18px;line-height: 18px;font-size: 12px;color: #999;overflow: hidden;display: flex; justify-content: space-between;}
.wlist-info-imgul .item .item-main .item-meta span{font-size: 13px; color: #999;}
.wlist-info-imgul .item .item-main .item-meta span a{color: #999;}
.wlist-info-imgul .item .item-main .item-meta span.time{float:right;margin-right:0px;}
.wlist-info-imgul .item .item-main .item-meta span.view{float:right;}  
.wlist-info-imgul .item .item-main .item-meta span.icon-view:before {margin-right:3px; font-size: 15px;}
.wlist-info-imgul .item .item-main .item-meta span.icon-date:before {margin-right:3px; font-size: 15px;}
/*widget-rank*/
.wlist-rank-infoul {margin-bottom: 0px;display: flex;flex-direction: column;gap: 15px;}
.wlist-rank-infoul .item {margin: 0px;} 
.wlist-rank-infoul .item + .item{margin-top: 0px;}
.wlist-rank-infoul .item .item-wrap {display: block;padding-left: 50px;position: relative;}
.wlist-rank-infoul .item .item-wrap span{position: absolute;top: 2px;left: 0;width: 36px;height: 36px;line-height: 36px; font-size: 22px;text-align: center;color: #999;background: #eee;font-family: cursive;font-weight: 500;border-radius: 4px;}
.wlist-rank-infoul .item .item-wrap:hover {color: #0088ff;}
.wlist-rank-infoul .item .item-wrap:hover span {color: #0088ff;opacity: 1;}
.wlist-rank-infoul .item .item-wrap .item-title {font-size: 15px;font-weight: normal;line-height: 20px;height: 40px; overflow: hidden;}
/*list-topic-imgul*/
.wlist-topic-imgul {display:inline-block; padding: 0px 0px; display: flex;flex-wrap: wrap; justify-content: center;flex-direction: column;gap: 16px;}
.wlist-topic-imgul .item {float:left;margin: 0px;width: -webkit-calc(100% - px); text-align:center; border:0px #eee solid;border-radius:6px; color:#666;background-color:#ffffff;overflow: hidden;}
.wlist-topic-imgul .item .item-wrap { position: relative; height: 120px;display:block;padding: 0px 0px;font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wlist-topic-imgul .item .item-wrap img {width: 100%;min-height: 100%;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;-o-transition: all .5s;}
.wlist-topic-imgul .item .item-wrap .item-info {position: absolute;top: 0;left: 0;width: 100%;height: 100%;color: #fff;background: rgb(0 0 0 / 31%);border-radius: 0px;display: flex;align-items: center;justify-content: center;}
.wlist-topic-imgul .item .item-wrap .item-info span {line-height: 100%;font-size:22px;font-weight:600;}
.wlist-topic-imgul .item .item-wrap .item-info .entitle {margin-top:0px;}
.wlist-topic-imgul .item:hover {background-color:#0099ff;}
.wlist-topic-imgul .item:hover .item-wrap img {transform: scale(1.2,1.2);-ms-transform: scale(1.2,1.2);-webkit-transform: scale(1.2,1.2);-o-transform: scale(1.2,1.2);-moz-transform: scale(1.2,1.2)}
.wlist-topic-imgul .item:hover a {color:#fff}
/*wlist-rank-titul*/
.wlist-rank-titul {padding: 0px 0;}
.wlist-rank-titul li {height: auto;}
.wlist-rank-titul li + li {margin-top: 10px;padding-top: 10px;border-top: 1px #eee dashed;}
.wlist-rank-titul li a {text-decoration: none;cursor: pointer;line-height: 22px !important;display: block;font-size: 15px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.wlist-rank-titul li a.line1 {padding-top: 12px;}
.wlist-rank-titul li a i {text-decoration: none;cursor: pointer;line-height: 22px !important;display: table-cell;font-style: normal;}
.wlist-rank-titul li em {display: inline-block;text-align: center;width: 22px;height: 22px;line-height: 22px;float: left;margin: 1px 10px 0px 0;font-size: 14px;color: #fff;border-radius: 2px;background:#afb2b7;}
.wlist-rank-titul li:nth-child(1) em {background-color: #0088ff; }
.wlist-rank-titul li:nth-child(2) em {background-color: #0099ff; }
.wlist-rank-titul li:nth-child(3) em {background-color: #55bbff; }
/*====== sidebar ======*/ 
.widget{position: relative;margin-bottom:20px; border-radius: 6px;overflow:hidden;background-color:#ffffff;}
.widget-fixed{position: relative;width: 330px;}
.widget .content{display:block; padding:18px;background: #fff;}
/**widget-title**/
.widget .widget-title{position:relative;margin-bottom:0px;padding: 15px;line-height: 1;border-bottom: 1px #eee solid;}
.widget .widget-title h3{position:relative;font-size:18px;line-height:1;font-weight:500;margin:0;padding-left:15px}
.widget .widget-title h3:before{content:"";position:absolute;top:1px;left:0;height:20px;width:5px;border-radius:2px;background-color:#00a4ff}
.widget .widget-title .more{position:absolute;top: 18px;right: 15px;font-size:14px}
.widget .widget-title .more a{margin-left:20px;color:#bbb}
.widget .widget-title .more a:first-child{margin-left:0}
.widget .widget-title .more a:hover{color:#00a4ff}

/*list-topic-recul*/
.widget .list-topic-recul { flex-direction: column;gap:15px;}