@charset "UTF-8";

/*
======== context ======================================

Last Updated:YYMMDD
Summary:ニュース固有レイアウト設定

- 
- 
=======================================================
*/

/*-----------------------------------------------------
news Box
-------------------------------------------------------*/
.newsMonth {
  margin: 0;
  padding: 10px;
  background-color: #f1f0d5;
  border: 1px solid #d5d4d4;
  font-size: 1.2em;
  font-weight: bold;
  background-image: none; /* 2016/06/20 add for accessibility div -> h2 */
}
.newsMonth:after {
	content: none;
}

.newsBox {
  padding: 0;
  margin: 0 0 20px 0;
}

#contentsArea .newsBox ul {
  margin: 0;
}

#contentsArea .newsBox ul li {
  margin: 0;
  list-style: none;
  border-bottom: 1px solid #D9D9D9;
}

#contentsArea .newsBox ul li.lastChild,
#contentsArea .newsBox ul li:last-child {
  background: none;
}

.newsBox table {
  margin: 0;
  padding: 0;
  border-spacing: 0 24px;
}
.newsBox table td {
  padding: 0;
  vertical-align: top;
}

.newsBox table td.title {
  width: 60%;
  padding-right: 10px;
}
.en .newsBox table td.title {
  width: 85%;
}

.newsBox table td.data {
  font-weight: bold;
  font-size: 1.8rem;
  letter-spacing: 0;
  min-width: 90px;
  padding-right: 10px;
  white-space: nowrap;
  text-indent: -9999px;
  vertical-align: top;
}

.newsBox table tr.firstChild td.data,
.newsBox table tr:first-child td.data {
  text-indent: 0;
}

.newsBox table td.label {
  padding: 2px 10px 0 0;
}

.newsBox table td.post {
  width: 23%;
  font-size: 1.6rem;
  letter-spacing: 0;
}


/*-----------------------------------------------------
dl
-------------------------------------------------------*/
.tpNews .newsList {
  margin: 0 0 0 10px;
  
}

.tpNews .newsList dt {
  margin: 0;
  padding: 3px 10px;
  background-color: #e8edf0;
  border: 1px solid #d5d4d4;
  border-top: none;
  font-size: 1.2em;
  font-weight: bold;
}

.tpNews .newsList dt.firstChild,
.tpNews .newsList dt:first-child {
  border-top: 1px solid #d5d4d4;
}

.tpNews .newsList dd {
  margin: 0;
  padding: 3px 5px;
  border: 1px solid #d5d4d4;
  border-top: none;
  zoom: 1;
}

/*-----------------------------------------------------
table
-------------------------------------------------------*/

.tpNews .newsList dd table {
  border-bottom: 1px dotted #D9D9D9;
  margin: 0 0 10px 0;
  padding: 0;

}

.tpNews .newsList dd table td {
  padding: 3px 3px 5px 3px;
  vertical-align: top;
}

.tpNews .newsList dd table td.data {
  font-weight: bold;
  font-size: 1.2em;
  width: 10%;
  white-space: nowrap;
  text-indent: -9999px;
  vertical-align: top;
}

.tpNews .newsList dd table tr.firstChild td.data,
.tpNews .newsList dd table tr:first-child td.data {
  text-indent: 1px;
}

.tpNews .newsList dd table td.post {
  width: 25%;
}

.tpNews .newsList dd table td.title a {

  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226%22%20height%3D%229%22%20viewBox%3D%220%200%206%209%22%3E%3Cpath%20d%3D%22M14.2%2C18.2a1%2C1%2C0%2C0%2C1-.659-1.753l3.14-2.747-3.14-2.747a1%2C1%2C0%2C1%2C1%2C1.317-1.505l4%2C3.5a1%2C1%2C0%2C0%2C1%2C0%2C1.505l-4%2C3.5A1%2C1%2C0%2C0%2C1%2C14.2%2C18.2Z%22%20transform%3D%22translate(-13.2%20-9.2)%22%20fill%3D%22%23004697%22%2F%3E%3C%2Fsvg%3E") no-repeat left .7em;
  padding: 0 0 0 10px;
  display: block;

}

.tpNews table.tblDatalist {
  font-size : 1.2em;
  width : 100%;
  border-right : solid 1px #000000;
  border-top : solid 1px #000000;
  margin-bottom : 15px;
}

.tpNews table.tblDatalist caption { 
  border-left: 4px solid #004697;
  margin: 0 0 3px;
  padding : 0 0 0 10px;
  text-align : left;
  font-weight : bold;
}
 
.tpNews table.tblDatalist td { 
  text-align : center;
  border-left : solid 1px #000000;
  border-bottom : solid 1px #000000;
}


/*-----------------------------------------------------
 2016/06/20 add for text label class
 2018/05/30 modify color, add newsLabel-06
-------------------------------------------------------*/
.newsLabel {
  display: block;
  width: 74px;
  height: 100%;
  padding: 7px 0;
  border-radius: 4px;
  color: #fff;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
  box-sizing: border-box;
}
.newsLabel-00 {
  background-color: #767676;
  border-color: #767676;
}
.newsLabel-01 {
  background-color: #8D1A6E;
  border-color: #8D1A6E;
}
.newsLabel-02 {
  background-color: #D02800;
  border-color: #D02800;
}
.newsLabel-03 {
  background-color: #00765D;
  border-color: #00765D;
}
.newsLabel-04 {
  background-color: #004697;
  border-color: #004697;
}
.newsLabel-05 {
  background-color: #FFD800;
  border-color: #FFD800;
  color: #333 !important;
}
.newsLabel-06 {
  background-color: #73762E;
  border-color: #73762E;
}
.newsLabel-07 {
  background-color: #006F89;
  border-color: #006F89;
}
.newsLabel-08 {
  background-color: #387900;
  border-color: #387900;
}
.newsLabel-09 {
  background-color: #645101;
  border-color: #645101;
}


/************************************************************************************
smaller than 640 SP
*************************************************************************************/
@media screen and (max-width: 640px) {
  #contentsArea .newsBox ul li {
    margin: 0 0 32px;
    border-bottom: none;
  }

  .newsBox table {
    width: 100%;
    border-spacing: 0 8px;
  }

  .newsBox table td.label,
  .newsBox table td.title,
  .newsBox table td.post{
    width:100%;
    display: block;
    box-sizing: border-box;
  }

  .newsBox table tr:first-child td.data{
    width:100%;
    display: block;
    box-sizing: border-box;
    background: #F8F8F5;
    border-bottom: 1px solid #bbb;
    margin-bottom: 16px;
    padding: 10px;
  }
  .newsBox table td.data{
    display: none;
  }

  .newsBox table td.label {
    padding: 0 0 4px;
  }

  .newsBox table td.title{
    width: auto;
    padding: 0 0 4px;
  }

  .newsBox table td.post {
    width: 100%;
    font-size: 1.4rem;
    text-align: right;
  }
}
