@charset "UTF-8";

/*clearfix*/
.cf:before,
.cf:after {
  content: "";
  display: table;
}
.cf:after,
.clear {
  clear: both;
}

cf::after {
  content: " ";
  clear: both;
  display: block;
  height: 0;
  line-height: 0;
  visibility: hidden;
}
.tc {
  text-align: center !important;
}
.tr {
  text-align: right !important;
}
.tl {
  text-align: left !important;
}

.contBoxInner {
  padding-top: 2%;
}
.recTxtboxInner {
  padding: 0 3%;
}

.newsBox {
  position: relative;
  max-width: 920px;
  width: 100%;
  margin: 0 auto;
}


.recTxtbox {
  height: auto;
  border: 2px solid #b086ff;
  background: #330033;
  font-size: 2.2rem;
}
.recTxtbox {
  border: 2px solid #57595e;
  background: #25262f;
  font-size: 2.2rem;
}

.recInfo .infoList {
  width: 100%;
}



.recInfo .infoList .infoTitlesub,
.detailTitle .infoTitlesub {
  display: inline;
  max-width: 125px;
  width: 20%;

  vertical-align: top;
}

@media screen and (max-width: 640px) {
  .recInfo .infoList .infoTitlesub,
  .detailTitle .infoTitlesub {
    width: 14%;
  }
}

.infoList .infoTitle {
  display: block;
  width: 100%;
  padding-left: 0.6em;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.recInfo .infoList li a {
  position: relative;
  display: flex;
  width: 100%;
}
.recInfo .infoList .infoDay,
.detailTitle .infoDay {
  float: none;
  display: block;
  padding-top: 1.5%;
}

.recInfo .infoList .new {
  position: absolute;
top: -63%;
  left: -2%;
  z-index: 100;
  width: 8%;
}

.recInfo .infoList li {
  padding: 2% 0;
  background: url(../image/info_line.jpg) bottom center no-repeat;
  background-size: 100% auto;
}

.recInfo .infoList li:last-child {
  background: none;
}

.recInfo .infoList li.not_entry {
  position: relative;
  margin: 0 auto 1.3% auto;
  background: none;
  text-align: center;
}

.detailTitle {
  position: relative;
  display: flex;
  width: 100%;
  padding: 1% 0;
  background: url(../image/info_line.jpg) bottom center no-repeat;
  background-size: 100% auto;
}

.detailTitle .infoTitle {
  display: block;
  width: 100%;
  padding-left: 0.6em;
}

.detailTitle .new {
  position: absolute;
  top: 1%;
  left: -2%;
  z-index: 100;
  width: 8%;
}

.detailTextBox {
  margin: 1%;
}
.detailTextBox a {
  display: inline-block;
}
.backBtn {
  margin-top: 2%;
  color: #ffffff;
  font-size: 3.0rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.0;
          filter: drop-shadow(0px 2px 0px rgba(0, 0, 0, 0.8));

  -webkit-filter: drop-shadow(0px 2px 0px rgba(0, 0, 0, 0.8));
}


.backBtn.noteRe {
    text-align:center;
}
.backBtn.noteRe a {
    display:inline-block;
}



/*==================================
pager
===================================*/

.news-pagerbox {
  margin-top: 2%;
  color: #ffffff;
  font-size: 3.0rem;
  font-weight: bold;
  line-height: 1.0;
          filter: drop-shadow(0px 2px 0px rgba(0, 0, 0, 0.8));

  -webkit-filter: drop-shadow(0px 2px 0px rgba(0, 0, 0, 0.8));
}

.news-pagerbox li {
  display: inline-block;
  width: 1.5em;
  margin-right: 1.5%;
  font-size: 3.0rem;
  vertical-align: middle;
}

.news-pagerbox li a {
  color: #ffffff;
  text-decoration: none;
}

.news-pagerbox .count {
  width: 100%;
  margin: 0 auto;
}
.news-pagerbox li span.no {
  color: #00ffff;
}
.news-pagerbox li:last-child {
  margin-right: 0;
}
.news-pagerbox .prev,
.news-pagerbox .next {
  max-width: 23px;
  width: 2.34%;
}

.news-pagerbox .first,
.news-pagerbox .end {
  max-width: 36px;
  width: 5.20%;
}

/*==================================
blog Detail design
===================================*/

.detailTextBox a:link,
.detailTextBox a:hover,
.detailTextBox a:active {
  color: #00ffff;
  text-decoration: underline;
}
.detailTextBox a:visited {
  color: #00ffff;
}
.detailTextBox a:focus {
  outline: none;
}