#content { background-color: #efefef; }

.container { margin-top: 85px; }

.article-wrapper, form { background-color: #fff; border-radius: 10px; }

.news-item footer { text-align: right; margin-top: 1em; color: #444; }
.news-item footer span { display: inline-block; font-weight: bold; }
.news-item footer span.date { position: relative; top: 1px; }
.news-item footer span.cate { margin-left: 0.5em; vertical-align: bottom; }
.news-item footer span.cate .cate-inner { display: flex; justify-content: center; align-items: center; border: 1px solid #444; text-align: center; width: 6em; }

@media screen and (max-width: 767px) { header .container { margin-top: 0px; }
  .article-wrapper, form { padding: 20px; }
  .news-item { margin-top: -40px; padding-top: 40px; }
  .news-item footer { font-size: 12px; line-height: 18px; }
  .news-item footer .cate img { height: 18px; }
  .news-item + .news-item { margin-top: -10px; } }
@media screen and (min-width: 768px), print { .article-wrapper, form { padding: 40px; }
  .news-item { margin-top: -140px; padding-top: 140px; }
  .news-item footer { font-size: 14px; line-height: 20px; margin-top: 1.5em; }
  .news-item footer .cate { font-size: 13px; position: relative; top: 1px; }
  .news-item footer .cate img { height: 20px; }
  .news-item + .news-item { margin-top: -80px; } }
.bnumber { margin-top: 0.5em; }
.bnumber ul { text-align: center; }
.bnumber li { display: inline; }
.bnumber li + li::before { content: "-"; }
.bnumber a { display: inline-block; padding: 0 0.5em; }

#navigation { margin-top: 3em; }