.wrapper{
      margin: 0 auto; /* 左右センタリング */
      width:90%;
      min-width:900px; /* 900px 以下には縮小できない */
    }
    .head{
      background:#eee;
      overflow:hidden; /* marginによる空白削除 */
    }
    .columu{ /* 段組み用 */
      display:table;
      width:100%;
    }
    .left {
      display:table-cell;
      background:#bfb;
    }
    .right {
      display: table-cell;
      width:300px; /* 右枠は幅300px固定 */
      background:#bbf;
    }
    .foot{
      background:#eee;
      overflow:hidden; /* marginによる空白削除 */
    }
    /* 幅600px以下の場合は段組み解除 */
    @media screen and (max-width:600px){
      body{
        margin:0px;
      }
      .wrapper{
        width:100%;
        min-width:600px; /* 600px 以下には縮小できない */
      }
      .columu{
        display:block;  /* 段組み解除 */
      }
      .left{
        display:block;  /* 段組み解除 */
        width:100%;
        overflow:hidden; /* marginによる空白削除 */
      }
      .right{
        display:block;  /* 段組み解除 */
        width:100%;
        overflow:hidden; /* marginによる空白削除 */
      }
    }