続・はてなブログのカスタマイズ http://twilyze.hatenablog.jp/entry/hatena-blog-custom3

hatenablog.css

@media screen and (min-width: 1139px) {
  #content {
    margin: 20px 55px 35px;
  }
}

/* 記事のフォントサイズ */
.entry-content {
  font-size: 100%;
  line-height: 27px;
}

/* 記事の見出し */
.entry-title {
  font-size: 120% !important;
}
.entry-content h3:first-child {
  margin-top: 1em;
}
.entry-content h3 {
  font-size: 1.4rem;
  margin-top: 3em;
  margin-bottom: 1em;
  background: #f7f7f7;
  border-left: 5px solid #888;
  border-bottom: 3px solid #cfcfcf;
  padding: 6px 12px 4px;
}
.entry-content h4 {
  font-size: 1.3rem;
  margin-top: 2em;
  margin-bottom: 1em;
  border-left: 5px solid #888;
  border-bottom: 3px solid #cfcfcf;
  padding-left: 10px;
}
.entry-content h5 {
  font-size: 1.15rem;
  margin-top: 1.5em;
  margin-bottom: 1em;
  border-left: 5px solid #888;
  padding-left: 10px;
}
.entry-content h3 + h4 {
  margin-top: 1em;
}
.entry-content h4 + h5 {
  margin-top: 1em;
}

/* 目次 */
#main-inner .table-of-contents {
  background-color: #f8f8f8;
  margin: 16px 48px 16px 16px;
  padding: 60px 70px 20px 50px !important;
  border: 1px solid #e5e5e5;
  font-size: 15px;
}
@media screen and (max-width: 1138px) {
  #main-inner .table-of-contents {
    margin: 16px 8px;
  }
}
#main-inner .table-of-contents li {
  line-height: 1.5em;
}
#main-inner .table-of-contents a:not(.keyword) {
  color: #1487bd;
  display: block;
}
#main-inner .table-of-contents a:visited {
  color: #789dae;
}
#main-inner .table-of-contents a:hover {
  color: #0f5373;
  text-decoration-line: underline;
}
#main-inner .table-of-contents li > ul {
  margin-left: 1.6em;
  padding-left: 0;
}
#main-inner .table-of-contents + h3 {
  margin-top: 1em;
}
#main-inner .table-of-contents + h4 {
  margin-top: 1em;
}
#main-inner .table-of-contents li a {
  line-height: 27px;
}

/* 続きを読む */
.entry-see-more {
  margin: 8px 0 20px;
  padding: 8px 20px;
  color: #fcfcfc;
  background-color: #636363;
  text-decoration: none;
  border-radius: 6px;
  display: inline-block;
  border: 2px solid #636363;
  transition: color .15s ease-in-out, background-color .15s ease-in-out;
}
.entry-see-more:visited {
  color: #fcfcfc;
}
.entry-see-more:hover {
  color: #454545;
  background-color: transparent;
}
.entry-see-more::before {
  content: "\f0a9";
  display: inline-block;
  font-family: FontAwesome;
  margin-right: 7px;
}

.hatena-star-container,
.social-buttons,
.comment-box {
  display: none;
}
.page-entry .hatena-star-container,
.page-entry .social-buttons,
.page-entry .comment-box {
  display: block;
}

li p {
  margin: 0 !important;
}

.entry-content code {
  border: 1px solid #d8d8d8;
}

.entry-content blockquote {
  padding: 10px;
}

#stoc a {
  color: #789dae;
}

hatenablog_footer.css

/* トップへ戻るボタン */
#pagetop {
  position: fixed;
  bottom: 10px;
  right: 10px;
  line-height: 36px;
  padding: 2px 8px 0 12px;
  color: #fff;
  font-size: 19px;
  text-decoration: none;
  background: rgba(0,0,0,0.15);
  border-radius: 19px;
  border: 0;
  opacity: 0.8;
  transition: .2s;
  backface-visibility: hidden;
}
@media screen and (max-width: 1138px) {
  #pagetop {
    bottom: 8px;
    right: 8px;
    padding: 1px 11px 1px 10px;
  }
  #pagetop:before {
    content: '▲';
  }
}
@media screen and (min-width: 1139px) {
  #pagetop:before {
    content: 'TOP▲';
  }
}
#pagetop:hover:not(.touch) {
  background: #3c3c3c;
}

#pagetop.fade-in {
  animation: fadeIn 200ms;
}
@keyframes fadeIn {
  0% {opacity: 0}
  100% {opacity: 0.8}
}
#pagetop.fade-out {
  animation: fadeOut 200ms;
}
@keyframes fadeOut {
  0% {opacity: 0.8}
  100% {opacity: 0}
}

hatenablog_footer.js

<!-- トップへ戻るボタン -->
<a id='pagetop' href='#' style='display:none;'></a>
<script>
// ボタンを表示するスクロール位置
const PAGETOP_BUTTON_OFFSET = 500;
const SCROLL_TIME_PC    = 400;
const SCROLL_TIME_TOUCH = 400;

const win = window;
const doc = document;

// 縦方向のスムーズスクロール
const smoothScrollY = (function() {
  const frameTime = 1000 / 30;
  const scrollTo = win.scrollTo;
  const timer = win.performance ? performance : Date;
  let requestId, request, cancel, exsitRAF;
  {
    const strRAF = 'requestAnimationFrame';
    exsitRAF = win.hasOwnProperty(strRAF);
    if (exsitRAF) {
      request = win[strRAF];
      cancel = win.cancelAnimationFrame;
    }
    else {
      request = win.setTimeout;
      cancel = win.clearTimeout;
    }
  }

  function easeInOutQuad(t) {
    return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
  }

  return function(target, duration) {
    const startTime = timer.now();
    const startY = win.pageYOffset;
    const startX = win.pageXOffset;
    const distance = target - startY;
    let elapsedTime;

    cancel(requestId);
    requestId = request(exsitRAF ? step : step2);

    // requestAnimationFrame
    function step(timestamp) {
      elapsedTime = timestamp - startTime;
      if (elapsedTime >= duration) {
        scrollTo(startX, target);
        return;
      }
      scrollTo(startX, easeInOutQuad(elapsedTime / duration) * distance + startY);
      requestId = request(step);
    }

    // setTimeout
    function step2() {
      elapsedTime = timer.now() - startTime;
      if (elapsedTime >= duration) {
        scrollTo(startX, target);
        return;
      }
      scrollTo(startX, easeInOutQuad(elapsedTime / duration) * distance + startY);
      requestId = request(step2, frameTime);
    }
  };
}());

// トップへ戻るボタン
(function() {
  const CLASS_FADE_IN = 'fade-in';
  const CLASS_FADE_OUT = 'fade-out';
  const TOUCH_DEVICE = 'ontouchstart' in window;
  const SCROLL_TIME = TOUCH_DEVICE ? SCROLL_TIME_TOUCH : SCROLL_TIME_PC;
  const SMOOTH_SCROLL = SCROLL_TIME > 0 ? true : false;
  const elPagetop = doc.getElementById('pagetop');
  const stPagetop = elPagetop.style;
  const checkClass = (function() {
    let current = -1;
    return function(set) {
      if (set !== current) {
        current = set;
        return true;
      }
      return false;
    };
  }());

  // タッチデバイス用のクラス追加
  if (TOUCH_DEVICE)
    elPagetop.classList.add(CLASS_TOUCH);

  elPagetop.addEventListener('click', function(e) {
    e.preventDefault();
    e.stopPropagation();
    if (SMOOTH_SCROLL)
      smoothScrollY(0, SCROLL_TIME);
    else
      win.scrollTo(win.pageXOffset, 0);
  }, false);
  elPagetop.addEventListener('animationend', function() {
    if (elPagetop.classList.contains(CLASS_FADE_OUT))
      stPagetop.display = 'none';
  }, false);
  win.addEventListener('scroll', updateScroll, false);

  function removeClass(className) {
    elPagetop.classList.remove(className);
  }
  function addClass(className) {
    elPagetop.classList.add(className);
  }
  function fadeIn() {
    stPagetop.display = '';
    removeClass(CLASS_FADE_OUT);
    addClass(CLASS_FADE_IN);
  }
  function fadeOut() {
    removeClass(CLASS_FADE_IN);
    addClass(CLASS_FADE_OUT);
  }
  function updateScroll() {
    if (win.pageYOffset > PAGETOP_BUTTON_OFFSET) {
      if (checkClass(0))
        fadeIn();
    }
    else {
      if (checkClass(1))
        fadeOut();
    }
  }
}());
</script>