dreamark

<script type="text/javascript">
$(function(){
  $(window).on("DOMContentLoaded resize", function(){
    var adswich=$(window).width();
      if(adswich <=675){
        $('.ads-slot-02').insertAfter('.pager');
      }else{
        $('.ads-slot-02').insertAfter('.ads-slot-01');
      }
});

dreamark

<div id="foot">
  <div class="footer-area">
    <div class="hatena-module-title">
      <span class="foot-title">タイトル</span>
    </div>
      <span class="foot-body">本文</span>
  </div><!-- endfooter-area -->

  <div class="footer-area">
    <div class="hatena-module-title">

dreamark

/*カエレバ・ヨメレバ*/
  .kaerebalink-box{
    display: block;
    border: 1px solid #1D3557;
    padding: 8px;
    margin: 16px 0;
  }

  .kaerebalink-image{
    padding: 8px;

dreamark

/* 吹き出し */
  .balloon {
    overflow: hidden;
    margin: 16px 8px;
    font-size: 80%
  }

  .balloon-board-right{
    float:left;
    width:60%;

dreamark

/* 目次 */
  .table-of-contents{
    margin:24px 0;
    background: #e5e5e5;
    border: 1px solid #ccc;
    width: 70%;
    padding: 2em;
    counter-reset: toc;
    list-style-type: none;
    font-size: 0.9em;

dreamark

/*マーカー*/
  .markb {
    background: linear-gradient(transparent 30%, #87C8EF 30%);
    background: -moz-linear-gradient(transparent 30%, #87C8EF 30%);      /* Firefox用 */
    background: -webkit-linear-gradient(transparent 30%, #87C8EF 30%);   /* Safari用 */
    background: -ms-linear-gradient(transparent 30%, #87C8EF 30%);       /* IE用 */
    background: -o-linear-gradient(transparent 30%, #87C8EF 30%);        /* Opera用 */
    text-decoration: none;
  }
  strong {

dreamark

/*コラム枠*/
  .point,.column,.attention{
    position: relative;
    border: 1px dashed #1D3557;
    margin: 32px 16px;
    background-color: #e5e5e5;
    padding: 50px 20px 20px;
    font-size: 90%;
  }

dreamark

<nav id="recomend">
  <div class="navmenu">
    <span class="navmenuInner">
      <span class="image"><a href=""><img src="画像のURL" alt=""></a><br></span>
      <span class="date">日付け</span><br>
      <span class="title"><a href="">おすすめの記事や注目の記事等を表示させる事が出来ます</a></span>
    </span>
    <span class="navmenuInner">
      <span class="image"><a href=""><img src="画像のURL" alt=""></a><br></span>
      <span class="date">日付け</span><br>

dreamark

<div class="navi">
  <div class="toggle"><a href="#">MENU</a></div>
    <ul class="menu">
      <li><a href="リンク先URL">表示名</a></li>
      <li><a href="リンク先URL">表示名</a></li>
      <li><a href="リンク先URL">表示名</a></li>
      <li><a href="リンク先URL">表示名</a></li>
      <li>
      <div class="navi-search">
        <form class="search-form" role="search" action="ブログのURL/search" method="get">

dreamark

<style type="text/css">
/*コラム枠*/
  .point,.column,.attention{
    position: relative;
    border: 1px dashed #1D3557;
    margin: 32px 16px;
    background-color: #e5e5e5;
    padding: 50px 20px 20px;
    font-size: 90%;
  }