hatena_mobile_preview

<style type="text/css">
/* ### 日付(〇日前)の囲みとアイコンの追加 ### */
.list-entry-article .entry-footer-time {
  position: relative;
  color: #ffffff; /*文字色*/
  background: #41AC88; /*日付の背景色*/
  font-weight:700; /*文字の太さ*/
  padding: 3px 10px 3px 23px;/*日付の文字まわりのスペース*/
}
.list-entry-article .entry-footer-time:before{
  font-family: FontAwesome;
  content: "\f017"; /*アイコンのユニコード*/
  position: absolute;
  left: 0;
  top: 0;
  padding:0 8px;
  color: #fff; /*アイコンの色*/
}
/* ### 日付の囲みとアイコンの追加 ### */
.date{
  position: relative;
  color: #fff; /*文字色*/
  background: #cc4f5e;  /*背景色*/
  padding: 1px 10px 0px 28px;
}
.date:before{
  font-family: FontAwesome;
  content: "\f272"; /*アイコンのユニコード*/
  position: absolute;
  left: 0;
  top: 0;
  padding:1px 10px;
  color: #fff;　/*アイコンの色*/
}
/* ### サムネイルの大きさ調整 + 色で囲む ### */
.list-entry-article .thumb-image {
  width:70px;
  height:70px;
  border-radius: 0em;
  border: solid 3px #3f3f3f;　/*色で囲む*/
}
/* ### 余白を小さくしてコンパクトに ### */
.list-entry-article {
  padding: 5px 0 !important;
}
/* ### 記事一覧のタイトルの文字の大きさを小さく ### */
.list-entry-article .entry-title{
  font-size: 15px;
}
/* ### 記事と記事の間の線 ### */
.list-entry-article {
  border-bottom: 3px dashed #F3F3F3; /* 破線にする */
  padding: 0 0;　/* 余白を減らす */
}
/* ### 記事一覧の概要欄の行間を小さく ### */
.entry-list p{
  line-height: 18px !important;
}
</style>