@charset "utf-8";

/* --------------------------------------------


お知らせ


---------------------------------------------- */


/* --------------------------------------------

一覧ページ

---------------------------------------------- */
/* --------------------------------------------
上部　カテゴリリンク
---------------------------------------------- */
.newsCtgLink.inner {
 max-width: 1280px;
 margin: 12px auto 48px;
 padding: 8px 0;
 background-color: rgba(255, 0, 0, 0.27);
}

.newsCtgLink ul {
 padding: 8px 0;
 justify-content: center;
}

.newsCtgLink ul li {
 margin: 0 8px;
}

.newsCtgLink ul li a {
 display: inline-block;
 font-size: 1.6rem;
 font-weight: 600;
 text-decoration: underline;
}

.newsCtgLink ul li a.current {
 text-decoration: none;
 color: #00321e;
}

.newsCtgLink ul li a::before {
 content: "";
 display: inline-block;
 width: 24px;
 height: 24px;
 margin: -0.2em 0.5em 0 0;
 vertical-align: middle;
 background-color: rgba(0, 0, 0, 0.3);
 border: 1px solid #000;
 border-radius: 50%;
 overflow: hidden;
}

.newsCtgLink ul li:nth-of-type(1) a::before {
 background-image: url(../_image/common/icon-arrow-g.svg);
 background-color: #fff;
 border-color: rgba(0, 51, 31, 0.7);
}

.newsCtgLink ul li:nth-of-type(2) a::before {
 background-image: url(../_image/common/icon-arrow-w.svg);
 background-color: #00693e;
 border-color: #00693e;
}

.newsCtgLink ul li:nth-of-type(3) a::before {
 background-image: url(../_image/common/icon-arrow-w.svg);
 background-color: #ed6425;
 border-color: #ed6425;
}

.newsCtgLink ul li:nth-of-type(4) a::before {
 background-image: url(../_image/common/icon-arrow-w.svg);
 background-color: #6cbf3e;
 border-color: #6cbf3e;
}

@media only screen and (max-width:640px) {
 .newsCtgLink.inner {}

 .newsCtgLink ul {
  justify-content: center;
 }

 .newsCtgLink ul li {
 }

 .newsCtgLink ul li a {
  font-size: 1.5rem;
 }

 .newsCtgLink ul li a.current {}

 .newsCtgLink ul li a::before {
  margin: -0.2em 0.3em 0 0;
 }

}


/* --------------------------------------------
リスト
---------------------------------------------- */
.newsList.inner.flex {
 max-width: 1280px;
 justify-content: flex-start;
}

.newsItem {
 width: 30%;
 margin: 32px 0;
}

.newsItem:nth-of-type(3n+2) {
 margin: 32px 5%;
}

.newsItem a {
 display: block;
 text-decoration: none;
}

.newsItem_thum {
 width: 100%;
 height: 220px;
 margin: 0 0 16px;
 border-radius: 10px;
 overflow: hidden;
}

.newsItem_thum img {
 object-fit: cover;
 width: 100%;
 height: 100%;
}

.newsItem a,
.newsItem_thum,
.newsItem_thum img {
 transition: 0.5s;
}

.newsItem a:hover {
 opacity: 0.65;
}

.newsItem a:hover .newsItem_thum {
 box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}

.newsItem a:hover .newsItem_thum img {
 transform: scale(1.05);
}

span[class*="newsItem_ctg"],
span[class*="newsItem_ctg"] {
 display: inline-block;
 width: 96px;
 padding: 4px;
 text-align: center;
 font-size: 1.2rem;
 font-weight: 600;
 color: #fff;
 border-radius: 40px;
}

span.newsItem_ctg-info {
 background-color: #00693e;
}

span.newsItem_ctg-event {
 background-color: #ed6425;
}

span.newsItem_ctg-report {
 background-color: #6cbf3e;
}

.newsItem_time {
 margin-left: 32px;
 padding-left: 24px;
 font-size: 1.4rem;
 font-weight: 500;
 color: #00321e;
 border-left: 1px solid rgba(0, 0, 0, 0.8);
 opacity: 0.5;
}

.newsItem_ttl {
 margin: 16px 0 12px;
 font-size: 1.8rem;
 font-weight: 600;
}

.newsItem_text {
 color: #7d7d7d;
}

@media only screen and (max-width:640px) {
 .newsList.inner.flex {
  max-width: 1280px;
 }

 .newsItem {
  width: 47%;
  margin: 16px 0;
 }

 .newsItem:nth-of-type(3n+2) {
  margin: 16px 0;
 }

 .newsItem:nth-of-type(2n+2) {
  margin: 16px 0 16px 6%;
 }

 .newsItem_text {
  font-size: 1.3rem;
  height: 118px;
  overflow: hidden;
 }

}



/* --------------------------------------------

詳細ページ

---------------------------------------------- */
.newsPostHeader {
 padding-bottom: 24px;
 border-bottom: 1px solid #dcdcdc;
}

.newsPostHeader_ttl {
 margin: 90px auto 24px;
 font-size: 2.4rem;
 font-weight: 600;
}

.newsPostHeader_ctg-news {}


@media only screen and (max-width:640px) {
 .btn-back {
  margin-bottom: 64px;
 }
}