（1）商品一覧の商品にカーソルを乗せると、「カートに入れる」がボタンとして表示されるように変更。

対象：IBN4001（ver.4.0.51）、IBN4002（ver4.0.52）、IBN4003（ver4.0.51）共通

■style.css
「カートボタン」のコードの下に追加。

[php]
/* カートボタン */
.ec-shelfGrid .ec-blockBtn–action {
height:46px;
line-height:46px;
font-size: 14px;
}
[/php]

↓【追加】

[php]
/* カートボタン */
.ec-shelfGrid .ec-blockBtn–action {
height:46px;
line-height:46px;
font-size: 14px;
}
@media only screen and (min-width: 768px){
.ec-shelfGrid .ec-blockBtn–action {
background:none;
color:#999;
}
li.ec-shelfGrid__item:hover .ec-blockBtn–action {
border:1px solid #999;
}
li.ec-shelfGrid__item:hover .ec-blockBtn–action:hover {
background:#DE5D50;
border:1px solid #DE5D50;
color:#FFF;
}
}
[/php]

（2）スマホ閲覧時、商品詳細ページのメイン画像（slick.js）をピンチアウトできるようにする。（オリジナルEC-CUBEにも適用できます）

対象：IBN4001（ver.4.0.51）、IBN4002（ver4.0.52）、IBN4003（ver4.0.51）共通

■style.css
最後に追加

[php]
/* =================================
slick.jsのスライドショーで、スマホによるピンチイン・アウトを可能にする
================================= */
.slick-slider {
-ms-touch-action:auto;
touch-action:auto;
}
[/php]

（３）商品が多数購入された時、ヘッダー部のカートブロックにスクロールバーを表示する。

対象：IBN4001（ver.4.0.51）

①　■style.css
9298行目付近、overflow:auto;　追加

[php]
/* 展開 */
@media only screen and (min-width: 768px){
.ec-cartNaviIsset {
margin-top: 12px;
min-width: 400px;
max-width: 400px;
right:-20px;
border:1px solid #999;
background: #fff;
}

↓【追加】

[php]
/* 展開 */
@media only screen and (min-width: 768px){
.ec-cartNaviIsset {
margin-top: 12px;
min-width: 400px;
max-width: 400px;
right:-20px;
border:1px solid #999;
background: #fff;
overflow:auto;
}
[/php]

②　■default_frame.twig
最後の方に追加

[php]
{# ▼ブラウザの高さとカート #}
<script>
if (window.matchMedia(‘(min-width:768px)’).matches) {
$(‘.ec-modal’).click(function() {
var h = $(window).height();
$(‘.ec-cartNaviIsset’).css(‘max-height’, (h-40) + ‘px’);
});
$(window).on(‘load’,function(){
var h = $(window).height();
$(‘.ec-cartNaviIsset’).css(‘max-height’, (h-40) + ‘px’);
});
$(window).on(‘resize’,function(){
var h = $(window).height();
$(‘.ec-cartNaviIsset’).css(‘max-height’, (h-40) + ‘px’);
});
}
</script>
[/php]