@charset "UTF-8";

/* --------------------- */
/* -----TOPお知らせ一覧------ */
/* --------------------- */
/* リストかこみ*/
#newsWrap #newsList {
  display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px 3%;
}
/*◎768px以下*/
@media screen and (max-width: 768px) {
#newsWrap #newsList {
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 20px 4%;
}
}




/* --------------------- */
/* -----共通------ */
/* --------------------- */

/* サムネイル画像 */
#newsWrap #newsList .thumbNailWrap .img {
  position: relative;
  width: 100%;
  height: 100%;
aspect-ratio: 3 / 2;
  margin-bottom: 10px;
  overflow: hidden;
}
#newsWrap #newsList .thumbNailWrap .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: all 0.5s ease;
}

#newsWrap #newsList .thumbNailWrap .img img:hover {
  scale: 1.1;
}

/*カテゴリ*/
#newsWrap #newsList .thumbNailWrap .img .catName {
  top: 0;
  left: 0;
  position: absolute;
  display: block;
  padding: 3px 5px;
  font-size: var(--s12);
  color: var(--color-white);
}

.cat-0 .catName {
  background-color: #39b34a;
}

.cat-1 .catName {
  background-color: #f9ae3b;
}

.cat-2 .catName {
  background-color: #ff7baa;
}

.cat-3 .catName {
  background-color: #d6bc4d;
}

.cat-4 .catName {
  background-color: #7ed1e8;
}

/*日付*/
#newsWrap #newsList li .up_ymd {
  display: inline-block;
  font-size: var(--s14);
  color: var(--color-blue);
}

/* タイトル */
#newsWrap #newsList li .title {
  display: block;
  color: var(--color-black);
  font-size: var(--s14);
  margin: 3px 0;
white-space:nowrap;
overflow: hidden;
text-overflow: ellipsis;
-webkit-text-overflow: ellipsis; /*Safari用*/
-o-text-overflow: ellipsis; /*Opera用*/
}

/* news */
#newsWrap #newsList li .newMark {
  color: #C1272D;
  display: inline-block;
  margin: 0 5px;
}

/* PDF直リンクにはアイコン */
#newsWrap #newsList li .title a[href$=".pdf"]::after {
  content: url(../../common/img/icon/icon_pdf.gif);
  margin-left: 5px;
}

/* 画像直リンクにはアイコン */
#newsWrap #newsList li .title a[href$=".jpg"]::after,
#newsWrap #newsList li .title a[href$=".gif"]::after,
#newsWrap #newsList li .title a[href$=".png"]::after,
#newsWrap #newsList li .title a[href$=".jpeg"]::after {
  content: url(../../common/img/icon/icon_img.gif);
  margin-left: 5px;
}

/* Word直リンクにはアイコン */
#newsWrap #newsList li .title a[href$=".doc"]::after,
#newsWrap #newsList li .title a[href$=".docx"]::after {
  content: url(../../common/img/icon/icon_word.gif);
  margin-left: 5px;
}

/* エクセル直リンクにはアイコン */
#newsWrap #newsList li .title a[href$=".xlsx"]::after,
#newsWrap #newsList li .title a[href$=".xls"]::after {
  content: url(../../common/img/icon/icon_excel.gif);
  margin-left: 5px;
}

/* パワポ直リンクにはアイコン */
#newsWrap #newsList li .title a[href$=".ppt"]::after,
#newsWrap #newsList li .title a[href$=".pptx"]::after {
  content: url(../../common/img/icon/icon_ppt.gif);
  margin-left: 5px;
}

/* 外部リンクにはアイコン */
#newsWrap #newsList li .title a[href^="http:"]::after,
#newsWrap #newsList li .title a[href^="https:"]::after {
  content: "";
  background-image: url(../../common/img/icon/bt_icon_03.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  padding-right: 20px;
}






/*------------------------------------------------*/
/*------------------- ページャー -------------------*/
/*------------------------------------------------*/
.pager01{
margin: 0 0 20px 0;
}
.pager02{
text-align:right;
margin: 20px 0 100px 0;
}
@media screen and (max-width: 400px) {
.pager01{
margin: 30px 0 20px 0;
}
}

.pager01,.pager02{clear:both;}

/*ページャーボタン*/
.pager01 a, .pager02 a{
background:#999;
display: inline-flex;
justify-content: center;
align-items: center;
border-radius: 50%;
flex-flow: column;
vertical-align: top;
width: 40px;
height: 40px;
color: var(--color-white);
margin: 3px 3px;
}

/*現在のページのボタン*/
.pager01 a.current,.pager02 a.current{background: var(--color-blue);}
.pager01 a:hover,.pager02 a:hover{background:var(--color-blue);}









/*------------------------------------------------*/
/*------------------- 詳細ページ -------------------*/
/*------------------------------------------------*/

.news-detail .content {
}

/*日付*/
.news-detail .date {
  font-size: var(--s16);
  line-height: var(--s16);
  font-weight: 400;
margin-bottom: 40px;
}

.news-detail .detail{
margin-bottom: 30px;
width: 100%;
display: inline-block;
word-break : break-all;
word-wrap: break-word;
white-space:initial;

}

/* 本文 */
.news-detail .detailText{
width: 100%;
display: inline-block;
word-break : break-all;
word-wrap: break-word;
white-space:initial;
}
/* detailText 内の Google系div の暴走を止める */
@media screen and (max-width: 768px) {
.news-detail .detailText div {
  width: 100% !important;
  max-width: 100% !important;
  overflow-wrap: break-word;
}
}





.news-detail .detail a{
  color: var(--color-blue);
  border-bottom: 1px solid var(--color-blue);
margin: 0 3px;
}
.news-detail .detail a.bt03{
  color: var(--color-black);
  border-bottom: none;
margin: 0;
}


/* リンクと外部リンクにはアイコン */
.news-detail .detail a[href^='http:']::after,
.news-detail .detail a[href^='https:']::after {
  content: '';
  width: 10px;
  height: 10px;
  display: inline-block;
  background: url(../../common/img/icon/icon_outlink.svg) no-repeat;
  background-position: center;
  background-size: contain;
  padding-right: 20px;
}

.news-detail .detail a[href^='http:']:hover,
.news-detail .detail a[href^='https:']:hover {
  opacity: 0.6;
}



/*リスト*/
.news-detail ol,
.news-detail ul {
  list-style: none;
  counter-reset: number;
}

.news-detail ul li,
.news-detail ol li {
  font-size: var(--s16);
  line-height: var(--s29);
  margin-bottom: 5px;
}

.news-detail ul li,
.news-detail ol li {
  position: relative;
  margin-left: 15px;
}

/*点*/
.news-detail ul li::before {
  content: '・';
  position: absolute;
  top: 0;
  left: -15px;
  font-size: var(--s30);
color: var(--color-red);
}

/*数字*/
.news-detail ol li::before {
  content: counter(number) '.';
  counter-increment: number;
  position: absolute;
  top: 0;
  left: -15px;
color: var(--color-red);
}

/* 余白 */
.news-detail ul,
.news-detail ol,
.news-detail .bt01,
.news-detail img {
margin: 20px 0;
}


/* 戻るボタン */
.news-detail-back{
text-align: center;
transform: scale(1.2);
}