



.crawler_list_wrap                                    {position:relative; border-top:2px solid #333;  }
.crawler_list_wrap li                                 {position:relative;  border-bottom:1px solid #e5e5e5; transition: 0.4s;  background:#fff; }
.crawler_list_wrap li a                              { display: grid; grid-template-columns:25% auto; gap:1.7em; padding:1.2em 1em;   }
.crawler_list_wrap li figure                      { overflow:hidden; aspect-ratio: 320 / 200; overflow: hidden;  }
.crawler_list_wrap li figure img              { width: 100%; height: 100%; transition: 0.4s; object-fit: contain; }
.crawler_list_wrap li .tit                           {font-size:1em; color:#000; font-weight:bold;  padding-bottom:15px;  line-height:1.4; }
.crawler_list_wrap li .txt                          {font-size:0.9em; color:#777;   line-height:1.4; overflow:hidden; text-overflow:ellipsis;-o-text-overflow:ellipsis; display:-webkit-box;-webkit-line-clamp: 3;-webkit-box-orient:vertical; word-wrap:break-word;}
.crawler_list_wrap li .date                        {position:relative;  font-size:0.9em; color:#aaa; margin-top:15px;  }
.crawler_list_wrap li .date::after             {position:absolute; content:''; right:0; top:4px; width:20px;height:20px; background:url('./top_blank01.png') no-repeat right 0;  filter: grayscale(100%); opacity:0.5; }
.crawler_list_wrap li:hover .date::after         {filter: grayscale(0%); opacity:1; }

.crawler_list_wrap li:hover                       {background:#f5f5f5; }




@media screen and (max-width:1024px) { 
.crawler_list_wrap li a                              {  gap:1.5em; padding: 1em 0.7em;   }
}
@media screen and (max-width:768px) { 
.crawler_list_wrap li a                              {   gap:1.2em; padding: 1em 0.5em;   }
}
@media screen and (max-width:580px) { 
.crawler_list_wrap li a                              { grid-template-columns:1fr; padding: 1em;   }
}


