@charset "utf-8";

.news-list {display:grid; grid-template-columns:repeat(3, 1fr); gap:20px;}
@media screen and (max-width: 1080px) {
  .news-list {grid-template-columns:repeat(2, 1fr);}
}
@media screen and (max-width: 640px) {
  .news-list {grid-template-columns:repeat(1, 1fr); gap:0; background-color:#fff; padding:16px 0;}
}
.news-list__item {background-color:#fff; padding:36px 24px 40px;}
@media screen and (max-width: 640px) {
  .news-list__item {padding:16px 40px;}
}
@media screen and (max-width: 480px) {
  .news-list__item {padding:16px 20px;}
}

.news-pagenation {text-align:center; margin-top:1em;}
.news-pagenation span { border:solid 1px var(--green); background:var(--green); color:#fff; display:inline-block; height:30px; width:30px; margin:0 5px;}
.news-pagenation a {color:var(--green); display:inline-block; height:30px; margin:0 5px;}
.news-pagenation a.page {border:solid 1px var(--green); width:30px;}

.news-detail h1 {color:var(--green);}
.news-detail div.date {text-align:right; font-size:0.9em; margin:0.5em;}
.news-detail div.detail {margin:1em 0 2em 0;}
.news-detail div.detail p {margin:1em 0;}
.news-detail div.detail table {border-collapse:separate; border-spacing:0; margin:1em 0; border-right:solid 1px #ccc; border-bottom:solid 1px #ccc;}
.news-detail div.detail table td, .news-detail div.detail table th {border:solid 1px #ccc; border-right:0; border-bottom:0; padding:0.25em 0.5em;}
.news-detail div.detail table p {margin:0;}