section{margin-bottom: 20px; background-color: #fff;}
section::before{content:'';	display: table;}
.primary-title-wrapper{padding: 15px 20px;border: 1px solid #EFF0F2; background-color: #fbfbfb;position: relative;margin-bottom: -1px;}
.primary-title{font-size: 18px;line-height: 18px;}
.primary-title-wrapper a{position: absolute; right: 10px;color: #fff; font-size: 11px;padding: 2px 15px;background-color: #2C74E6;border: 0px solid #EFF0F2; border-radius: 3px; }
.secondary-title-wrapper{margin: 20px 0px;border-left: 6px solid #2C74E6; padding-left:40px;border-bottom: #fff; background-color: #fff;position: relative;margin-bottom: -1px;}
.secondary-title-wrapper a{position: absolute;top:-4px; right: 10px;color: #fff; font-size: 11px;padding: 2px 15px;background-color: #2C74E6;border: 0px solid #EFF0F2; border-radius: 3px; }
.secondary-title{font-size: 14px;line-height: 16px;}
i{margin-right: 10px;}


.link-template{ background-color: #fff;}
.link-template .wrapper{padding: 10px;display: grid;grid-template-columns: repeat(5, 19.6%);grid-row-gap: 8px;grid-column-gap: 0.5%;grid-auto-flow: row dense;}
.link-template .wrapper.col5{grid-template-columns: repeat(5, 19.6%)!important;grid-row-gap: 8px;grid-column-gap: 0.5%;}
.link-template .wrapper.col4{grid-template-columns: repeat(4, 24.7%)!important;grid-row-gap: 8px;grid-column-gap: 0.4%;}
.link-template .wrapper.col3{grid-template-columns: repeat(3, 33%)!important;grid-row-gap: 5px;grid-column-gap: 0.5%;}
.link-template .wrapper.col2{grid-template-columns: repeat(2, 49.5%)!important;grid-row-gap: 8px;grid-column-gap: 1%;}
.link-template .inner{}
.link-template .item{ background-color: #FAFBFD; height: 130px;    display: block; position: relative;padding-left:100px; padding-right: 5px; transition:all 0.3s linear 0s; box-sizing: border-box;}
.link-template .item:hover{box-shadow: 0 10px 10px #eee;transform:scale(1.05); transition:all 0.3s linear 0s;}
.link-template .item .icon{position:absolute; top:15px;left: 15px; width: 70px; height: 70px;line-height: 70px; border-radius: 5px; background-color:rgba(0,0,0,0.70);background-size: auto 100%; background-position: 0% 50%; text-align: center;font-weight: bold;  backdrop-filter:contrast(4) blur(150px); color:#fff;font-size: 18px; text-shadow: 1px 1px 5px #333}
.link-template .item .title{padding-top: 10px; font-size: 15px; font-weight: bold; overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.link-template .item .description{padding-top: 3px; font-size: 12px; color: #666; overflow: hidden;text-overflow: ellipsis; height:34px;}
.link-template .item .tags{padding-top: 5px; font-size: 12px;color: #999; overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.link-template .item .tags span{font-size: 10px; border:1px solid #aaa; color: #333;display: inline-block; padding: 2px 5px; margin-right: 5px; border-radius: 2px;}

.link-template .item .rate ul{transform: scale(1); margin-top: 0px;}
.link-template .item .rate ul li i.layui-icon { font-size: 16px !important;}
.link-template .item .bg0{background-color: #ecd5c3}
.link-template .item .bg1{background-color: #b9dce6}
.link-template .item .bg2{background-color: #ccbce2}
.link-template .item .bg3{background-color: #cbdaaa}
.link-template .item .bg4{background-color: #e5b3b2}
.link-template .item .bg5{background-color: #a3bddb}
.link-template .item .bg6{background-color: #afc7e3}
.link-template .item .bg7{background-color: #dad4b5}
.link-template .item .bg8{background-color: #debdbd}
.link-template .item .bg9{background-color: #dad4d4}

/* 左侧菜单layui样式替换 */
.layui-menu .layui-menu-item-checked{}
.layui-menu .layui-menu-item-checked a{color: #2C74E6!important;background-color:#f8f8f8}
.layui-menu .layui-menu-item-checked::after{border-right: 0px solid #2C74E6;}
.layui-menu .layui-menu-item-down>ul {background-color: #f8f8f8}
.layui-menu .layui-menu-item-divider {
  margin:0px 0;
  padding:0;
  height:0;
  line-height:0;
  border-bottom:1px dotted #eee;
  overflow:hidden
}
.layui-menu li{padding:10px 27px;white-space:normal!important;}
.layui-menu .layui-menu-item-group>.layui-menu-body-title { color:rgba(0,0,0,100);}
@media screen and (max-width: 1024px) { 
/*当屏幕尺寸小于1200px时，应用下面的CSS样式*/
.link-template .wrapper{margin:-0.5%!important;display:grid;grid-template-columns: repeat(3,33%);grid-row-gap: 5px;grid-column-gap: 0.5%;}
.link-template .wrapper.col5{grid-template-columns: repeat(3, 33%)!important;grid-row-gap: 5px;grid-column-gap: 0.5%;}
.link-template .wrapper.col4{grid-template-columns: repeat(3, 33%)!important;grid-row-gap: 5px;grid-column-gap: 0.5%;}
.link-template .wrapper.col3{grid-template-columns: repeat(3, 33%)!important;grid-row-gap: 5px;grid-column-gap: 0.5%;}
.link-template .wrapper.col2{grid-template-columns: repeat(3, 33%)!important;grid-row-gap: 5px;grid-column-gap: 0.5%;}
}

@media screen and (max-width: 900px) { /*当屏幕尺寸小于900px时，应用下面的CSS样式*/

.link-template .wrapper{margin:-0.5%!important;display:grid;grid-template-columns: repeat(2,49.5%);grid-row-gap: 8px;grid-column-gap: 1%;}
.link-template .wrapper.col5{grid-template-columns: repeat(2, 49.5%)!important;grid-row-gap: 8px;grid-column-gap: 1%;}
.link-template .wrapper.col4{grid-template-columns: repeat(2, 49.5%)!important;grid-row-gap: 8px;grid-column-gap: 1%;}
.link-template .wrapper.col3{grid-template-columns: repeat(2, 49.5%)!important;grid-row-gap: 8px;grid-column-gap: 1%;}
.link-template .wrapper.col2{grid-template-columns: repeat(2, 49.5%)!important;grid-row-gap: 8px;grid-column-gap: 1%;}
.link-template .item{padding-left:70px;}
.link-template .item .icon{width: 50px;height: 50px;left: 10px;line-height: 50px;}
.link-template .item .rate ul li i.layui-icon { font-size: 11px !important;}

}