@charset "utf-8";


section#list{ padding-top:45px;min-height:350px; }
ul.list{ 
clear:both;
display:block;
width:95%;
max-width:1072px;
margin:0 auto;
overflow:hidden;
display: -webkit-box;
display: -moz-box;
display: -ms-box;
display: -webkit-flexbox;
display: -moz-flexbox;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: flex;
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
ul.list li{ display:block; text-align:center; overflow:hidden;}
ul.list li .thumb{ display:block; margin-bottom:10px; max-height:180px; overflow:hidden;}
ul.list li .thumb img{ max-width:100%; width:88%; height:auto!important;}
ul.list li .contributor{ display:block; text-align:left; width:88%; max-width:315px; margin:0 auto; overflow:hidden;}
ul.list li .content{ display:block; text-align:left;width:88%; max-width:315px; height:50px; margin:10px auto 0 auto; overflow:hidden; line-height:1.23}
a.more{ display:block; width:275px; margin:5px auto 37px auto;}
.article_search{ text-align:center;}
.article_search a{ color:#63717D; text-decoration:underline;}
/******** PC用 ********/
@media screen and (min-width:980px){
ul.list li{ float:left; width:33.3%; text-align:center; margin:0 0 40px 0; }
}
/******** タブレット用 ********/
@media screen and (max-width:979px){
ul.list li{ float:left; width:50%; text-align:center; margin:0 0 30px 0; }
ul.list li .thumb img{ max-width:100%; width:auto; height:auto!important;}
ul.list li .contributor{ width:100%; max-width:295px;}
ul.list li .content{ width:100%; max-width:295px;}
}
/******** スマホ用 ********/
@media screen and (max-width:640px){
ul.list li{ width:96%; margin:0 2% 30px 2%; }
}