@font-face {
  font-family: "TsunagiGothic";
  src: url("fonts/tsunagi-gothic.woff2") format("woff2"), url("fonts/tsunagi-gothic.woff") format("woff");
  font-display: swap;
}
/*========================================================================
   news layout
========================================================================*/
#news #mainVisual {
  background: url(../img/news/mainimg.jpg) no-repeat center/cover;
}

.btn_admin {
  text-align: right;
  font-size: 0.85em;
  padding: 0.5em;
}
.btn_admin a {
  color: rgb(104.2731707317, 99.3853658537, 96.1268292683);
}

.backORcloseBtn {
  text-align: center;
  line-height: 100%;
  padding-top: 30px;
}
.backORcloseBtn a {
  display: inline-block;
  padding: 4px 15px;
  border: 1px solid #888;
  color: rgb(104.2731707317, 99.3853658537, 96.1268292683);
  border-radius: 6px;
  text-decoration: none;
  font-size: 12px;
}

#news_wrap {
  padding-bottom: clamp(5rem, 2.394rem + 4.587vw, 9rem);
  max-width: 1100px;
}

/* news #newslist
***************************************************/
.pager {
  text-align: right;
  padding: 1em 0.6em;
  box-sizing: border-box;
}
.pager a {
  color: rgb(231.2, 136, 147.9);
  font-size: 0.93em;
  line-height: 1.1;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 1.84em;
  border-radius: 1em;
  padding: 0.4em;
  box-sizing: border-box;
  margin: 0 0.4em;
  text-decoration: none;
  transition: 0.3s;
}
.pager a.current {
  color: #fff;
  background: rgb(231.2, 136, 147.9);
}
.pager a:hover {
  color: #fff;
  background: rgba(231.2, 136, 147.9, 0.5);
}

.newsList_wrap {
  padding: 20px;
  box-sizing: border-box;
}
.newsList_wrap #newsList {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.newsList_wrap #newsList > * {
  color: #333;
  border-bottom: dotted 1px #666;
}
.newsList_wrap #newsList > * {
  width: 100%;
}
.newsList_wrap .cat-0 .catName {
  background-color: #ea6;
}
.newsList_wrap .cat-1 .catName {
  background-color: #ec6;
}
.newsList_wrap .cat-2 .catName {
  background-color: #bc6;
}
.newsList_wrap .cat-3 .catName {
  background-color: #6cd;
}
.newsList_wrap li {
  padding: 1em;
}
.newsList_wrap li:not(:last-child) {
  margin-bottom: 1.5em;
}
.newsList_wrap .newMark {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  padding: 1px 4px;
  font-size: 0.9em;
  line-height: 1.3;
  font-weight: bold;
  color: #fff;
  background-color: #d53;
  border-radius: 3px;
  margin: 0.15em;
}
.newsList_wrap .cont {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
}
.newsList_wrap .cont > * {
  display: inline-block;
  line-height: 1.4;
  margin: 0.15em;
}
.newsList_wrap .cont .title {
  display: block;
  width: calc(100% - 0.3em);
}
.newsList_wrap .up_ymd, .newsList_wrap .catName, .newsList_wrap .newMark {
  min-width: -moz-fit-content;
  min-width: fit-content;
}
.newsList_wrap .catName {
  padding: 2px 6px;
  font-size: 0.85em;
  color: #fff;
  border-radius: 999px;
}
.newsList_wrap .title {
  font-size: 1.06em;
}
.newsList_wrap .thumbNailWrap {
  max-width: 100px;
  display: block;
  margin-top: 0.4em;
  margin-right: 0.4em;
  margin-bottom: 0.4em;
  float: left;
}
.newsList_wrap .comment {
  display: block;
  margin-top: 0.6em;
}

/* news_detail #single
***************************************************/
#single {
  max-width: 1000px;
}
#single .pNav {
  font-size: 0.9em;
  margin-bottom: 1em;
  color: rgba(51, 51, 51, 0.8);
}
#single .pNav a {
  padding-inline: 0.4em;
  color: rgb(231.2, 136, 147.9);
  text-decoration: underline;
}
#single article {
  padding-block: clamp(3rem, 1.5rem + 3.125vw, 6rem);
  padding-inline: clamp(2rem, 1rem + 2.778vw, 5rem);
  box-sizing: border-box;
  border-radius: 8px;
  background: url(../img/bg_white.jpg);
  color: #333;
}
#single article h3 {
  font-size: 1.4em;
  line-height: 1.3;
  padding: 5px 0;
  margin-bottom: 0.4em;
  border-bottom: 3px dotted rgba(51, 51, 51, 0.4);
}
#single article #up_ymd {
  text-align: right;
  font-size: 1em;
  margin: 0em 0 1em;
}
#single article #detail > *:not(:last-child) {
  margin-bottom: 3em;
}
#single article .detailText {
  font-size: inherit;
  line-height: inherit;
}
#single article .detailUpfile {
  text-align: center;
}
#single article .detailUpfile img {
  max-width: 100%;
  height: auto;
}