レスポンシブデザインにて、iframeで外部サイトを表示した場合

Question

###実現したいこと
レスポンシブデザインのサイトにて、iframeで外部サイトのページを表示する。

###発生している問題
スマートフォンで確認した場合、iframeで表示した部分のみがズームアップされて表示されてしまう。（PCで確認した場合大丈夫です）

###試したこと
viewportなどを設定してみましたが変わらず、iframeのwidth調整も効きません。

どうか何卒よろしくお願いいたします。

＿＿＿

追記

デモサイトを用意しました

<iframe id="site-viewer" src="http://blog.livedoor.jp/dqnplus/" style="position: absolute; top: 0px;width: 100%; height:100%;display: block; border: none;" width="360"></iframe>

↑このような形で外部サイトを表示しています。

<meta name="viewport" content="width=device-width, initial-scale=1">

↑viewportはこのような形です。

何卒よろしくお願いいたします。

Comments

[kei344]

書かれている状況が再現するコード（HTML/CSS/JavaScriptなど）か、再現するURLを提示されたほうが回答を得やすいと思います。

[ntbros]

デモサイトとソースコードを用意しました、、何卒よろしくお願いいたします。