稼働環境
[EC-CUBE]　 2.11.4正式版
[レンタルサーバ]　さくらインターネット　スタンダードプラン
[OS]　FreeBSD 7.1-RELEASE-p16 i386
[PHP] 　PHP 5.2.17
[データベース] MySQL 5.5
[WEBサーバ]　Apache/1.3.42 (Unix) mod_ssl/2.8.31 OpenSSL/0.9.8e
[ブラウザ]　iPhone(Safari,Sleipnir)

お世話になります。

スマートフォンの動作確認をしておりましたところ以下の事象を発見いたしました。
過去に修正されていたみたいですが、私の環境だけ？同じような現象が収まりません。

・スマートフォンの商品詳細ページのメイン画像・サブ画像が大きすぎてはみ出してしまう。

うまく説明できないのですが、スマートフォンで商品詳細ページを閲覧した際に、スマートフォンでスワイプさせると画像が左にずれて切り替わったりする部分を大きく下にはみ出して画像が表示されてしまい、切り取られてしまっております。

大きすぎる画像をアップロードした商品に限りこのような事になってしまっているみたいですが、どう修正したらいいのか全く分かりませんので、お分かりになる方がいらっしゃいましたらご教授願います…。

スマートフォンの商品詳細ページの画像の所は下記のようになっております。
<!--★画像★-->

<div id="detailphotoblock" class="mainImageInit">
<ul>
<!--{assign var=key value="main_image"}-->
<li id="mainImage0">

<!--{* 画像の縦横倍率を算出 *}-->
<!--{assign var=detail_image_size value=200}-->
<!--{assign var=main_image_factor value=`$arrFile[$key].width/$detail_image_size`}-->
<!--{if $arrProduct.main_large_image|strlen >= 1}-->
<a rel="external" class="expansion" href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct.main_large_image|h}-->" target="_blank">
<img src="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct.main_image|h}-->" alt="<!--{$arrProduct.name|h}-->" width="<!--{$arrFile.main_image.width/$main_image_factor}-->" height="<!--{$arrFile.main_image.height/$main_image_factor}-->" /></a>
<!--{else}-->
<img src="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct.main_image|h}-->" alt="<!--{$arrProduct.name|h}-->" width="<!--{$arrFile.main_image.width/$main_image_factor}-->" height="<!--{$arrFile.main_image.height/$main_image_factor}-->" />
<!--{/if}-->
</li>
<!--★サブ画像★-->
<!--{section name=cnt loop=$smarty.const.PRODUCTSUB_MAX}-->
<!--{assign var=key value="sub_image`$smarty.section.cnt.index+1`"}-->
<!--{assign var=sub_image_factor value=`$arrFile[$key].width/$detail_image_size`}-->
<!--{assign var=lkey value="sub_large_image`$smarty.section.cnt.index+1`"}-->
<!--{if $arrFile[$key].filepath != ""}-->
<li id="mainImage<!--{$smarty.section.cnt.index+1}-->">
<!--{if $arrProduct[$lkey] != ""}-->
<a rel="external" class="expansion" href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" target="_blank">
<img src="<!--{$arrFile[$key].filepath|h}-->" alt="<!--{$arrProduct.name|h}-->" width="<!--{$arrFile[$key].width/$sub_image_factor}-->" height="<!--{$arrFile[$key].height/$sub_image_factor}-->" /></a>
<!--{else}-->
<img src="<!--{$arrFile[$key].filepath|h}-->" alt="<!--{$arrProduct.name|h}-->" width="<!--{$arrFile[$key].width/$sub_image_factor}-->" height="<!--{$arrFile[$key].height/$sub_image_factor}-->" />
<!--{/if}-->
</li>
<!--{/if}-->
<!--{/section}-->
</ul>
</div>

<section id="detailarea">