﻿.l_01_middle { display: flex; flex-direction: column; }

.pageHead { display: flex; padding: 0px 0px; width: 1500px; justify-content: space-between; margin: 20px auto 0px; box-sizing: border-box; border-bottom: solid 1px #ccc; }
.filterContainer { width: 524px; height: 150px; position: relative; background-color: var(--SecondaryColor); padding: 16px 20px; box-sizing: border-box; border-radius: 8px 8px 0px 0px; margin-left: 20px; border: 1px solid #ccc; border-bottom: none; }
    .filterContainer:after { content: "搜索"; position: absolute; top: -0.75em; left: 1em; width: 5em; height: 1.5em; line-height: 1.5em; text-align: center; }
    .filterContainer:before { content: ""; position: absolute; top: -1px; left: 1em; width: 5em; height: 1px; background-color: #e1e1e1; }

.filterContainer { display: flex; flex-direction: column; justify-content: flex-start; }
    .filterContainer .ipt_keyword { width:100%;height:3em;outline:none;border-radius:4px;border:1px solid #ccc;box-sizing:border-box;padding:0px 0.5em;}
    .filterContainer .btnSearch { width: 4em; height: 2.3em; border-radius: 4px; background-color: var(--PrimaryColor); text-align: center; line-height: 2.3em; color: white; margin-top: 10px; display: block; }

.loadmore { cursor: pointer; user-select: none; text-align: center; }

.listContainer { width: 1500px; margin: 0 auto; background-color: var(--SecondaryColor); padding: 40px 50px; box-sizing: border-box; }

.resourceList{display:flex;flex-wrap:wrap;justify-content:flex-start;}

    .resourceList .resourceItem { width: 450px; height: 300px; overflow: hidden; margin-bottom: 20px; border-radius: 8px; border: 1px solid #eee; box-sizing: border-box; position:relative;}
        .resourceList .resourceItem:not(:nth-child(3n)) { margin-right:25px;}

        .resourceList .resourceItem .rMainImage { width: 100%; height: 100%; background-size: contain; background-repeat: no-repeat; background-position: center;background-color:#eee; }
        .resourceList .resourceItem .MainImage {  }

        .resourceList .resourceItem .rInfo { display: flex; flex-direction: column; position: absolute; bottom: 0; left: 0; width: 100%; background-image: linear-gradient(0deg,rgba(0,0,0,1),rgba(0,0,0,0.5)); }

        .resourceList .resourceItem .rTitle { text-align: center; font-size: 18px; margin:15px 5px 5px;color:var(--PrimaryColor); }
        .resourceList .resourceItem .rL_1 { display: flex; justify-content: space-around;color:#ccc; margin:5px 0px 10px;}



