{#
This file is part of EC-CUBE
Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
http://www.ec-cube.co.jp/
For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.
2022/11/17 class 変更
#}
{% extends 'default_frame.twig' %}
{% set body_class = 'iteme_page_sphone' %}
{% block main %}
{% endblock %}
{% block stylesheet %}
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="stylesheet" type="text/css" href="/stylesheets/base_stylesheet2.min.css" />
<link rel="stylesheet" type="text/css" href="/stylesheets/sp/others/detail.min.css?20171208_01" />
<style>
body {
font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "MS Pゴシック", sans-serif !important;
}
.chokusoubtn img {
margin-bottom: 21px;
}
#item-detail #shopping-cart #shopping-cart-title{
background: #e3dbcd;
color: #000;
}
#shared-contents *,
.adjust-contents-to-sp * {
max-width: 100%;
}
.top_sashikomi_wrapper{
margin-bottom: 15px;
}
.item-price-other-size-price {
font-size: 3.44vw;
margin-bottom: 5px;
}
.item-price-other-size-price:last-of-type {
margin-bottom: 0;
}
</style>
<link rel="stylesheet" type="text/css" href="/stylesheets/sp/others/detail.min.css?20211016_001" />
<style>
.sf-minitoolbar {
display: none !important;
}
</style>
<style>
.ytlazy {
position: relative;
cursor: pointer;
}
.movie_frame .ytlazy {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.ytlazy > .ytlazy-btn {
position: absolute;
top: calc(100% / 2 - 2em);
left: calc(100% / 2 - 3em);
/**/
padding: 1em 2em;
border-radius: 20%;
/**/
background: rgba(25, 25, 25, .75);
color: white;
}
.ytlazy:hover .ytlazy-btn {
/**/
background: red;
color: white;
}
.ytlazy > .ytlazy-btn:after {
content: '▶';
font-size: 1.75em;
}
.ytlazy > img {
object-fit: cover;
}
</style>
{% endblock %}
{% block javascript %}
<script>
$( function(){
// PC版ページで詳細を確認
$('#to-pc-detail-page').on('click', function(e){
e.preventDefault();
var $this = $(this);
$.ajax({
url: '/ajax/switch-display/?to=pc',
dataType: 'json'
});
location.href = $this.attr('href');
});
});
</script>
<script>
/**
* SP版商品縮小画像が取得出来なかった際、PC版を表示
*/
function replaceImg(image) {
window.addEventListener('load', function () {
//pictureタグのsourceオプションを削除するだけでは、一部端末では画像切替が行われない為、
//新しい画像で置き換え
$img = $(image);
imgsrc = $img.attr('src') || $img.data('src'); // Lazy Load 対策
$picture = $img.parents('picture');
$picture.empty().append('<img class="replaced_img" style="max-width:100%" src="' + imgsrc + '" />');
});
}
</script>
<script>
window.dataLayer = window.dataLayer || [];
// SP - 電話CV
function phoneCall () {
dataLayer.push({
'event': 'Phone Call'
});
}
// SP - FAX
function cvFAX () {
dataLayer.push({
'event': 'SP - FAX'
});
}
// SP -メール問合せ
function cvInquiry () {
dataLayer.push({
'event': 'SP - Inquiry'
});
}
//
$(function () {
// SP - 電話CV
$('a[href^="tel:"]').on('click', function (event) {
phoneCall();
});
/**
* FAXは対象PDFのリンククリックでCV発火とする
* ▼FAX注文用紙
* ・/fax/fax_base.pdf
* ・/files/company/fax_base.pdf
* ▼図柄を記入するFAX用紙
* ・/files/company/fax_zugara.pdf
*/
$('a[href$="fax_base.pdf"],a[href$="fax_zugara.pdf"]').on('click', function (event) {
cvFAX();
});
});
</script>
<script>
$(function () {
// YouTube.Lazy - 元々手動再生の場合、手動遅延読込みで自動再生
const $ytLazy = $('.ytlazy').on('click', function (e) {
const $img = $(this).children('img');
const $iframe = $('<iframe />');
//
$img.each(function (i) {
$iframe.attr(this.dataset);
})
//
$(this).replaceWith($iframe);
});
// YouTube.Lazy - 元々自動再生の場合、自動遅延読込みで自動再生
$(window).on('load', function (e) {
setTimeout(function () {
$ytLazy.has('[data-auto-play="1"]').click()
}, 100);
});
});
</script>
{% endblock %}