/* clearfix */
#newsWrap .clearfix:after { content:"."; display:block; clear:both; height:0; visibility:hidden; }
#newsWrap .clearfix { display:inline-block; }

/* for macIE \*/
* html #newsWrap .clearfix { height:1%; }
#newsWrap .clearfix { display:block; }

#newsWrap ul#newsList{
	margin:0 0 15px;
	padding:0;
	font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#newsWrap ul#newsList li{
	display: grid;
	grid-template-columns: [date-start] 75px [date-end] 5px [category-start] max-content [category-end] 10px [title-start] 1fr [title-end];
	grid-template-rows: auto auto;
	row-gap: 5px; /* 行間のスペース */
	align-items: start;

	list-style-type: none;
	margin: 0 0 3px 0;
	padding: 5px 0 3px 0;
	border-bottom: 1px dotted #ccc;
	line-height: 120%;
	color: #666;
	font-size: 12px;
}
#newsWrap ul#newsList li .title a {
    color:#36F;
		text-decoration:underline;
}
#newsWrap ul#newsList li .title a:hover {
    color:#039;
		text-decoration:none;
}
#newsWrap ul#newsList li .up_ymd {
    grid-column: date-start;
    grid-row: 1;
    white-space: nowrap;
    margin: 0;
    padding: 0;
}
#newsWrap ul#newsList li .catName {
    grid-column: category-start;
    grid-row: 1;
    white-space: nowrap;
    display:inline-block;
    padding:3px 8px;
    border:1px solid #ccc;
    border-radius:6px;
    font-size:11px;
    line-height:100%;
    margin:0 2px;
		margin-top: -3px;
		width: 75px;
    text-align: center;
    box-sizing: border-box;
}
#newsWrap ul#newsList li .title {
    grid-column: title-start / title-end;
    grid-row: 1;
    margin: 0;
    padding: 0;
}
#newsWrap ul#newsList li > div.clearfix {
    display: contents;
}
#newsWrap .thumbNailWrap{
    grid-column: date-start;
    grid-row: 2;
	display:block;
	width:110px;
	overflow:hidden;
    margin: 0;
    padding: 0;
		margin-left: 80px;
}
#newsWrap .comment{
    grid-column: title-start / title-end;
    grid-row: 2;
	display:block;
	padding:3px 0;
    margin: 0;
}
#newsWrap .thumbNailWrap .thumbNail {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
}
#newsWrap .thumbNailWrap:not(:has(img)) {
    display: none;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
}
#newsWrap .newMark{
	display:inline-block;
	border:1px solid #F00;
	padding:1px 4px;
	font-size:11px;
	line-height:100%;
	background:#F00;
	color:#fff;
	box-shadow:1px 1px 1px #999;
	border-radius:8px;
	font-style:italic;
}