#header_section.head_logo {
  background-image:url(/items/images/logo/logo_cl_140x140.png);
  background-size: 70px auto;
  background-position: center 59px;
}
#header_section.head_event {
  background-image:url(/items/event/head_mark.png);
  background-size: 75px auto;
  background-position: center 57px;
}
#header_section.head_useful {
  background-image:url(useful.png);
  background-size: auto 65px;
  background-position: center 65px;
}
#header_section h1 {
    border-bottom:3px solid #333;
    padding-bottom:30px;
}
#sec01 {
  margin-top: 40px;
}
#news_items {
  margin-top: 40px;
}
#news_items:after {
  content: "";
  display: block;
  clear: both;
}
#news_items li {
  width: 22%;
  margin-right: 3.9%;
  float: left;

  margin-bottom: 30px;
}
#news_items li:nth-child(4n) {
  float: right;
  margin-right: 0;
}
#news_items li:nth-child(4n+1) {
  clear: both;
}
#news_items li a {
  display: block;
  color: black;
  text-decoration:none;
  transition: opacity .3s;
}
#news_items li a:hover {
  opacity : 0.8;
  filter: alpha(opacity=80);
}
#news_items li a b {
  height: 190px;
  display: block;
  background-size: contain;
  background-position:center center;
  background-repeat:no-repeat;
}

#news_items li a cite {
  font-size: 16px;
  font-weight:bold;
  display: block:
}
#news_items li a time {
  font-size: 12px;
  color: #646464;
  display:block;
}
#news_items li a > span {
  padding: 20px 0;
  text-align:right;
  display: block;
}
#news_items li a > span img {
  height: 15px;
}

@media only screen and (max-width: 768px) {
#news_items li,
#news_items li:nth-child(4n) {
  width: 32%;
  margin-right: 1.3%;
  float: left;
}
#news_items li:nth-child(4n+1) {
  clear: none;
}
#news_items li:nth-child(3n) {
  margin-right: 0;
  float: right;
}
#news_items li:nth-child(3n+1) {
  clear: both;
}

}
@media only screen and (max-width: 520px) {
#news_items li,
#news_items li:nth-child(4n) {
  width: 48.6%;
  margin-right: 0;
  float: left;
}
#news_items li:nth-child(3n) {
  float: left;
}

#news_items li:nth-child(odd) {
  clear: both;
}

#news_items li:nth-child(even) {
  margin-right: 0;
  float: right;
}
#news_items li:nth-child(3n+1) {
  clear: none;
}
}
@media only screen and (max-width: 414px) {
#news_items li a {
  background-size: auto 135px;
/*  padding-top: 143px;*/
}
#news_items li a cite {
  font-size: 14px;
}
}
@media only screen and (max-width: 340px) {
#news_items li {
  width: 100%!important;
  float: none!important;
  margin-right: 0!important;
}
}