カテゴリタグ付きグリッド記事一覧

<div class="grid06-07-05">
          <div class="c06-07-05"><span class="th06-07-05 th06-07-05-1"></span><span class="cat06-07-05 cat06-07-05-a">暮らし</span><p>四季を感じる部屋づくり</p></div>
          <div class="c06-07-05"><span class="th06-07-05 th06-07-05-2"></span><span class="cat06-07-05 cat06-07-05-b">グルメ</span><p>秋の味覚を楽しむレシピ</p></div>
          <div class="c06-07-05"><span class="th06-07-05 th06-07-05-3"></span><span class="cat06-07-05 cat06-07-05-c">仕事術</span><p>会議を短縮する進め方</p></div>
          <div class="c06-07-05"><span class="th06-07-05 th06-07-05-4"></span><span class="cat06-07-05 cat06-07-05-a">暮らし</span><p>観葉植物の育て方入門</p></div>
        </div>

.d06-07-05{width:100%;}
        .d06-07-05 .grid06-07-05{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
        .d06-07-05 .c06-07-05{display:flex;flex-direction:column;gap:6px;position:relative;}
        .d06-07-05 .th06-07-05{display:block;width:100%;height:48px;border-radius:6px;}
        .d06-07-05 .th06-07-05-1{background:linear-gradient(135deg,#bde0fe,#3a7bd5);}
        .d06-07-05 .th06-07-05-2{background:linear-gradient(135deg,#ffd8a8,#e8630f);}
        .d06-07-05 .th06-07-05-3{background:linear-gradient(135deg,#c9f5d9,#2f9e5c);}
        .d06-07-05 .th06-07-05-4{background:linear-gradient(135deg,#f3c9ff,#9a3fd6);}
        .d06-07-05 .cat06-07-05{align-self:flex-start;font-size:9px;padding:2px 7px;border-radius:10px;color:#fff;}
        .d06-07-05 .cat06-07-05-a{background:#4a8fd8;}
        .d06-07-05 .cat06-07-05-b{background:#e8730f;}
        .d06-07-05 .cat06-07-05-c{background:#2f9e5c;}
        .d06-07-05 .c06-07-05 p{margin:0;font-size:10.5px;color:#333;}