いつもお世話になっております。
楽天スマホ商品ページのヘッダー部分に
iframeを差し込むと、右にはみ出してしまいます。

https://ec-tsushin.com/rms_original_header/
↑こちらのサイトを参考に、楽天のヘッダーとコンテンツの間に隙間を空ける
「sample.css」を作成しました。

https://www.rakuten.ne.jp/gold/●●●/smart/menu.html
をiframe用ページとして作成し、
楽天rmsのスマホ共通カテゴリ設定に

<link rel="stylesheet" ="" href="https://www.rakuten.ne.jp/gold/●●●/smart/sample.css"><!-- CSSの読み込みタグ -->
<iframe class="sample" frameborder="0" scrolling="no" src="https://www.rakuten.ne.jp/gold/●●●/smart/menu.html" width="100%" height="200px" frameborder="0" =""></iframe ="">


を埋め込んだところ、どうやっても右にはみ出してしまいます。
width:100%は指定しているのですが…
何が原因なのでしょうか。
お忙しいところ恐れ入りますが、ご教授いただきたいです。
宜しくお願いいたします。