@charset "UTF-8";




body {
  background-color: transparent !important ;
  width: 100%;
}

.news-wrap {
  width: 90%;
  margin: auto;
}

.news-wrap .news {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-bottom: 3rem;
}
@media screen and (max-width: 768px) {
  .news-wrap .news {
    width: 100%;
    padding: 0 3%;
  }
}

.news-wrap .news li {
  width: 33.3%;
  padding: 0 3%;
  color: var(--base-text-color);
  list-style: none;
}
  @media screen and (max-width: 768px) {
    .news-wrap .news li {
      width: 100%;
      padding: 0 3% 2rem 3% ;
    }
  }

.news-wrap .news li a {
  text-decoration: underline;
  color: var(--base-text-color);
}


.news-wrap .news li:nth-child(n) {
  margin-top: 0;
}
.news-wrap .news li:nth-child(2n) {
  margin-top: 4%;
}
.news-wrap .news li:nth-child(3n) {
  margin-top: 8%;
}

.news-wrap .news li h3 {
  padding: 0 0.5rem 0 0 ;
  color: var(--base-text-color);
  font-size: 1.2rem;
}

.news-wrap .news li p {
  font-size: 1rem ;
  line-height: 2;
  color: var(--base-text-color);
}

.thumbNailWrap img.thumbNail {
  width: 100%;
}

.catName{
	display:inline-block;
	padding:3px 8px;
	border:1px solid #ccc;
	border-radius:6px;
	font-size:0.8rem;
	line-height:100%;
}


.newMark{
	display:inline-block;
	border:1px solid #F00;
	padding:1px 4px;
	font-size:0.8rem;
	line-height:100%;
	background:#A73333;
	color:#fff;
	box-shadow:1px 1px 1px #999;
	border-radius:4px;
}
/*
.comment{
	display:block;
	padding:3px 0;
	float:left;
	overflow:hidden;
	width:500px;

}
.thumbNailWrap{
	display:block;
	width:600px;
	float:left;
	overflow:hidden;
}
*/

/* Pager style（外部化可） */
.pager{
	text-align:right;
  padding: 3%;
}
/*ページャーボタン*/
.pager a{
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #333;
    font-size: 12px;
    padding: 3px 7px 2px;
    text-decoration: none;
	margin:0 1px;
}

/*現在のページのボタン*/
.pager a.current{
    background: #999;
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #fff;
    font-size: 12px;
    padding: 3px 7px 2px;
	margin:0 1px;
    text-decoration: none;
}

.pager a:hover{
    background:#999;
    color: #fff;
}

.overPagerPattern{
	padding:0 2px ;
}
/* /Pager style */
