app/template/airconwork/Product/detail.twig line 1

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
  6. http://www.ec-cube.co.jp/
  8. For the full copyright and license information, please view the LICENSE
  9. file that was distributed with this source code.
  10. #}
  11. {% extends 'default_frame.twig' %}
  13. {% set body_class = 'product_page' %}
  15. {% block stylesheet %}
  16. {% endblock %}
  18. {% block javascript %}
  19. <!--
  20.     <script>
  21.         eccube.classCategories = {{ class_categories_as_json(Product)|raw }};
  23.         // 規格2に選択肢を割り当てる。
  24.         function fnSetClassCategories(form, classcat_id2_selected) {
  25.             var $form = $(form);
  26.             var product_id = $form.find('input[name=product_id]').val();
  27.             var $sele1 = $form.find('select[name=classcategory_id1]');
  28.             var $sele2 = $form.find('select[name=classcategory_id2]');
  29.             eccube.setClassCategories($form, product_id, $sele1, $sele2, classcat_id2_selected);
  30.         }
  32.         {% if form.classcategory_id2 is defined %}
  33.         fnSetClassCategories(
  34.             $('#form1'), {{ form.classcategory_id2.vars.value|json_encode|raw }}
  35.         );
  36.         {% elseif form.classcategory_id1 is defined %}
  37.         eccube.checkStock($('#form1'), {{ Product.id }}, {{ form.classcategory_id1.vars.value|json_encode|raw }}, null);
  38.         {% endif %}
  39.     </script>
  40. -->
  41.     <script>
  42.         $(function() {
  43.             // bfcache無効化
  44.             $(window).bind('pageshow', function(event) {
  45.                 if (event.originalEvent.persisted) {
  46.                     location.reload(true);
  47.                 }
  48.             });
  50.             // Core Web Vital の Cumulative Layout Shift(CLS)対策のため
  51.             // img タグに width, height が付与されている.
  52.             // 630px 未満の画面サイズでは縦横比が壊れるための対策
  53.             // see https://github.com/EC-CUBE/ec-cube/pull/5023
  54.             $('.ec-grid2__cell').hide();
  55.             var removeSize = function () {
  56.                 $('.slide-item').height('');
  57.                 $('.slide-item img')
  58.                     .removeAttr('width')
  59.                     .removeAttr('height')
  60.                     .removeAttr('style');
  61.             };
  62.             var slickInitial = function(slick) {
  63.                 $('.ec-grid2__cell').fadeIn(1500);
  64.                 var baseHeight = $(slick.target).height();
  65.                 var baseWidth = $(slick.target).width();
  66.                 var rate = baseWidth / baseHeight;
  68.                 $('.slide-item').height(baseHeight * rate); // 余白を削除する
  69.                 // transform を使用することでCLSの影響を受けないようにする
  70.                 $('.slide-item img')
  71.                     .css(
  72.                         {
  73.                             'transform-origin': 'top left',
  74.                             'transform': 'scaleY(' + rate + ')',
  75.                             'transition': 'transform .1s'
  76.                         }
  77.                     );
  78.                 // 正しいサイズに近くなったら属性を解除する
  79.                 setTimeout(removeSize, 500);
  80.             };
  81.             $('.item_visual').on('init', slickInitial);
  82.             // リサイズ時は CLS の影響を受けないため属性を解除する
  83.             $(window).resize(removeSize);
  84.             $('.item_visual').slick({
  85.                 dots: false,
  86.                 arrows: false,
  87.                 responsive: [{
  88.                     breakpoint: 768,
  89.                     settings: {
  90.                         dots: true
  91.                     }
  92.                 }]
  93.             });
  95.             $('.slideThumb').on('click', function() {
  96.                 var index = $(this).attr('data-index');
  97.                 $('.item_visual').slick('slickGoTo', index, false);
  98.             })
  99.         });
  100.     </script>
  101.     <script>
  102.         $(function() {
  103.             $('.add-cart').on('click', function(event) {
  104.                 {% if form.classcategory_id1 is defined %}
  105.                 // 規格1フォームの必須チェック
  106.                 if ($('#classcategory_id1').val() == '__unselected' || $('#classcategory_id1').val() == '') {
  107.                     $('#classcategory_id1')[0].setCustomValidity('{{ '項目が選択されていません'|trans }}');
  108.                     return true;
  109.                 } else {
  110.                     $('#classcategory_id1')[0].setCustomValidity('');
  111.                 }
  112.                 {% endif %}
  114.                 {% if form.classcategory_id2 is defined %}
  115.                 // 規格2フォームの必須チェック
  116.                 if ($('#classcategory_id2').val() == '__unselected' || $('#classcategory_id2').val() == '') {
  117.                     $('#classcategory_id2')[0].setCustomValidity('{{ '項目が選択されていません'|trans }}');
  118.                     return true;
  119.                 } else {
  120.                     $('#classcategory_id2')[0].setCustomValidity('');
  121.                 }
  122.                 {% endif %}
  124.                 // 個数フォームのチェック
  125.                 if ($('#quantity').val() < 1) {
  126.                     $('#quantity')[0].setCustomValidity('{{ '1以上で入力してください。'|trans }}');
  127.                     return true;
  128.                 } else {
  129.                     $('#quantity')[0].setCustomValidity('');
  130.                 }
  132.                 event.preventDefault();
  133.                 $form = $('#form1');
  134.                 $.ajax({
  135.                     url: $form.attr('action'),
  136.                     type: $form.attr('method'),
  137.                     data: $form.serialize(),
  138.                     dataType: 'json',
  139.                     beforeSend: function(xhr, settings) {
  140.                         // Buttonを無効にする
  141.                         $('.add-cart').prop('disabled', true);
  142.                     }
  143.                 }).done(function(data) {
  144.                     // レスポンス内のメッセージをalertで表示
  145.                     $.each(data.messages, function() {
  146.                         $('#ec-modal-header').text(this);
  147.                     });
  149.                     $('.ec-modal').show()
  151.                     // カートブロックを更新する
  152.                     $.ajax({
  153.                         url: "{{ url('block_cart') }}",
  154.                         type: 'GET',
  155.                         dataType: 'html'
  156.                     }).done(function(html) {
  157.                         $('.ec-headerRole__cart').html(html);
  158.                     });
  159.                 }).fail(function(data) {
  160.                     alert('{{ 'カートへの追加に失敗しました。'|trans }}');
  161.                 }).always(function(data) {
  162.                     // Buttonを有効にする
  163.                     $('.add-cart').prop('disabled', false);
  164.                 });
  165.             });
  166.         });
  168.         $('.ec-modal-wrap').on('click', function(e) {
  169.             // モーダル内の処理は外側にバブリングさせない
  170.             e.stopPropagation();
  171.         });
  172.         $('.ec-modal-overlay, .ec-modal, .ec-modal-close, .ec-inlineBtn--cancel').on('click', function() {
  173.             $('.ec-modal').hide()
  174.         });
  175.     </script>
  176.     <script type="application/ld+json">
  177.     {
  178.         "@context": "https://schema.org/",
  179.         "@type": "Product",
  180.         "name": "{{ Product.name }}",
  181.         "image": [
  182.             {% for img in Product.ProductImage %}
  183.                 "{{ app.request.schemeAndHttpHost }}{{ asset(img, 'save_image') }}"{% if not loop.last %},{% endif %}
  185.             {% else %}
  186.                 "{{ app.request.schemeAndHttpHost }}{{ asset(''|no_image_product, 'save_image') }}"
  187.             {% endfor %}
  188.         ],
  189.         "description": "{{ Product.description_list | default(Product.description_detail) | replace({'\n': '', '\r': ''}) | slice(0,300) }}",
  190.         {% if Product.code_min %}
  191.         "sku": "{{ Product.code_min }}",
  192.         {% endif %}
  193.         "offers": {
  194.             "@type": "Offer",
  195.             "url": "{{ url('product_detail', {'id': Product.id}) }}",
  196.             "priceCurrency": "{{ eccube_config.currency }}",
  197.             "price": {{ Product.getPrice02IncTaxMin ? Product.getPrice02IncTaxMin : 0}},
  198.             "availability": "{{ Product.stock_find ? "InStock" : "OutOfStock" }}"
  199.         }
  200.     }
  201.     </script>
  202.       <script>
  203.     var swiper = new Swiper(".swiper-thumbs-slider__sub", {
  204.       spaceBetween: 10,
  205.       slidesPerView: 3,
  206.       freeMode: true,
  207.       watchSlidesProgress: true,
  208.     });
  209.     var swiper2 = new Swiper(".swiper-thumbs-slider__main", {
  210.       spaceBetween: 10,
  211.       navigation: {
  212.         nextEl: ".swiper-button-next",
  213.         prevEl: ".swiper-button-prev",
  214.       },
  215.       thumbs: {
  216.         swiper: swiper,
  217.       },
  218.     });
  219.   </script>
  220.   <script>
  221.     $(document).ready(function() {
  222.     $('#btn-cv').click(function() {
  223.       $('form input[type="hidden"]').each(function() {
  224.       var name = $(this).attr('name');
  225.       var value = $(this).val();
  226.       localStorage.setItem(name, value);
  227.       });
  228.       $('form').submit();
  229.     });
  230.     });
  231. </script>
  232. {% endblock %}
  235. {% set CatId = '' %}
  236. {% set CatMaker = '' %}{# メーカー #}
  237. {% set CatSeries = '' %}{# シリーズ #}
  238. {% set CatSeriesId = '' %}{# シリーズID #}
  239. {% set CatShape = '' %}{# 形状ID #}
  240. {% set CatShapeId = '' %}{# 形状ID #}
  241. {% set CatPower = '' %}{# 馬力 #}
  242. {% set CatPowerId = '' %}{# 馬力ID #}
  243. {% set CatExtent = '' %}{# 広さ #}
  244. {% set CatExtentId = '' %}{# 広さID #}
  245. {% set CatSystem = '' %}{# マルチエアコン #}
  246. {% set CatSystemId = '' %}{# マルチエアコンID #}
  247. {% set TagPower1 = '' %}{# 電源1 #}
  248. {% set TagPower2 = '' %}{# 電源2 #}
  249. {% set TagRC1 = '' %}{# リモコン1 #}
  250. {% set TagRC2 = '' %}{# リモコン2 #}
  251. {% set ProductCode = '' %}{# 型番 #}
  252. {# カテゴリ #}
  253. {% if Product.ProductCategories is not empty %}
  254.   {% for ProductCategory in Product.ProductCategories %}
  255.     {% if ProductCategory.Category.getParent is not null %}
  256.       {% if ProductCategory.Category.getParent.id == 1 %}
  257.         {% set CatMaker = ProductCategory.Category.name %}{# メーカー #}
  258.         {% set CatId = ProductCategory.Category.id %}
  259.       {% endif %}
  260.       {% if ProductCategory.Category.getParent.id == 51 %}
  261.         {% set CatShape = ProductCategory.Category.name %}{# 形状 #}
  262.         {% set CatShapeId = ProductCategory.Category.id %}{# 形状ID #}
  263.       {% endif %}
  264.       {% if ProductCategory.Category.getParent.id == 61 %}
  265.         {% set CatPower = ProductCategory.Category.name %}{# 馬力 #}
  266.         {% set CatPowerId = ProductCategory.Category.id %}{# 馬力ID #}
  267.       {% endif %}
  268.       {% if ProductCategory.Category.getParent.id == 111 %}
  269.         {% set CatExtent = ProductCategory.Category.name %}{# 広さ #}
  270.         {% set CatExtentId = ProductCategory.Category.id %}{# 広さID #}
  271.       {% endif %}
  272.       {% if ProductCategory.Category.getParent.id == 81 %}
  273.         {% set CatSystem = ProductCategory.Category.name %}{# マルチエアコン #}
  274.         {% set CatSystemId = ProductCategory.Category.id %}{# マルチエアコンID #}
  275.       {% endif %}
  276.     {% endif %}
  277.     {% if CatId is not empty %}
  278.      {% if ProductCategory.Category.getParent is not null %}
  279.       {% if ProductCategory.Category.getParent.id == CatId %}
  280.         {% set CatSeries = ProductCategory.Category.name %}{# シリーズ #}
  281.         {% set CatSeriesId = ProductCategory.Category.id %}{# シリーズID #}
  282.       {% endif %}
  283.       {% endif %}
  284.     {% endif %}
  285.   {% endfor %}
  286. {% endif %}
  287. {# タグ:電源 #}
  288. {% if Product.hasTag(1) %}
  289. {% set PageTag = repository('Eccube\\Entity\\Tag').find('1') %}
  290. {% set TagPower1 = PageTag.name %}{# 電源1 #}
  291. {% endif %}
  292. {% if Product.hasTag(2) %}
  293. {% set PageTag = repository('Eccube\\Entity\\Tag').find('2') %}
  294. {% set TagPower2 = PageTag.name %}{# 電源2 #}
  295. {% endif %}
  296. {# タグ:リモコン #}
  297. {% if Product.hasTag(5) %}
  298.   {% set PageTag = repository('Eccube\\Entity\\Tag').find('5') %}
  299.   {% set TagRC1 = PageTag.name %}{# リモコン1 #}
  300. {% endif %}
  301. {% if Product.hasTag(6) %}
  302.   {% set PageTag = repository('Eccube\\Entity\\Tag').find('6') %}
  303.   {% set TagRC2 = PageTag.name %}{# リモコン2 #}
  304. {% endif %}
  305. {# 型番 #}
  306. {% if Product.code_min is not empty %}
  307. {% set ProductCode = Product.code_min %}{# 型番 #}
  308. {% endif %}
  310. {# セット内容 数設定 #}
  311. {# シングル #}
  312. {% set sysNum1 = '1' %}
  313. {% if CatSystemId == 83 %}{# ツイン #}
  314.   {% set sysNum1 = '2' %}
  315. {% elseif CatSystemId == 84 %}{# トリプル #}
  316.   {% set sysNum1 = '3' %}
  317. {% elseif CatSystemId == 85 %}{# ダブルツイン #}
  318.   {% set sysNum1 = '4' %}
  319. {% endif %}
  321. {#  // {% set title = CatMaker ~ ' ' ~ Product.name ~ ' ' ~ TagPower1 ~ ' ' ~ TagPower2 ~ ' ' ~ TagRC1 ~ ' ' ~ TagRC2 ~ ' ' ~ ProductCode %}　#}
  322. {#  //　電源が被ってしまう為、「TagPower1 」を削除　2024-09-25　工藤　#}
  323. {% set title = CatMaker ~ ' ' ~ Product.name ~ ' ' ~ TagPower2 ~ ' ' ~ TagRC1 ~ ' ' ~ TagRC2 ~ ' ' ~ ProductCode %}
  325. {% block metatitle %}
  326. {{ title }}
  327. {% endblock %}
  329. {% block breadcrumb %}
  330. <li><a href="/products/list"><span>商品一覧</span></a> »</li>
  331. <li><span itemprop="name">{{ title }}</span></li>
  332. {% endblock %}
  334. {% block title %}
  335. <h1 class="c-title-06">
  336. <span class="s-text">
  337. {{ title }}
  338. </span>
  339. </h1>
  340. {% endblock %}
  342. {% block main %}
  344. {% if Product.old_flag != 1 %}
  345.   <div class="c-section">
  346.     <div class="p-products-dtl-main">
  347.       <div class="s-content-left">
  348.         <div class="swiper-thumbs-slider p-products-dtl-slider">
  349.           <div class="swiper swiper-thumbs-slider__main">
  350.             <div class="swiper-wrapper">
  351.             {% for ProductImage in Product.ProductImage %}
  352.               <div class="swiper-slide">
  353.               <img src="{{ asset(ProductImage, 'save_image') }}" alt="{{ loop.first ? Product.name : '' }}" width="360" height="360"{% if loop.index > 1 %} loading="lazy"{% endif %}>
  354.               </div>
  355.               {% else %}
  356.               <div class="swiper-slide">
  357.                 <img src="{{ asset(''|no_image_product, 'save_image') }}" alt="{{ loop.first ? Product.name : '' }}" width="360" height="360">
  358.               </div>
  359.               {% endfor %}
  360.             </div>
  361.             <div class="swiper-button-next"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 27 44" class="swiper-button-next-a">
  362.                 <path class="swiper-arrow arrow-right" d="M27,22L27,22L5,44l-2.1-2.1L22.8,22L2.9,2.1L5,0L27,22L27,22z" />
  363.               </svg></div>
  364.             <div class="swiper-button-prev"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 27 44" class="swiper-button-prev-a">
  365.                 <path class="swiper-arrow arrow-left" d="M0,22L22,0l2.1,2.1L4.2,22l19.9,19.9L22,44L0,22L0,22L0,22z" />
  366.               </svg></div>
  367.           </div>
  368.           <div class="swiper swiper-thumbs-slider__sub">
  369.             <div class="swiper-wrapper">
  370.               {% for ProductImage in Product.ProductImage %}
  371.               <div class="swiper-slide">
  372.                 <div class="swiper-slide__in">
  373.                   <img src="{{ asset(ProductImage, 'save_image') }}" alt="{{ loop.first ? Product.name : '' }}" width="113" height="113"{% if loop.index > 1 %} loading="lazy"{% endif %}>
  374.                 </div>
  375.               </div>
  376.               {% else %}
  377.               <div class="swiper-slide">
  378.                 <div class="swiper-slide__in">
  379.                   <img src="{{ asset(''|no_image_product, 'save_image') }}" alt="{{ loop.first ? Product.name : '' }}" width="113" height="113">
  380.                 </div>
  381.               </div>
  382.               {% endfor %}
  383.             </div>
  384.           </div>
  385.         </div>
  386.         <table class="c-table-04">
  387.           <tr>
  388.             <th>セット内容</th>
  389.           </tr>
  390.           <tr>
  391.             <td>
  392.               {% if Product.set_indoor is not null %}
  393.                   {% set indoor_price = (Product.set_indoor_price * sysNum1) * 1.1 %}
  394.                   室内機: {{ Product.set_indoor }} ×{{ sysNum1 }} {#  // [{{ indoor_price|number_format }}円]　#}<br>
  395.               {% endif %}
  396.               {% if Product.set_outdoor is not null %}
  397.                   {% set outdoor_price = Product.set_outdoor_price * 1.1 %}
  398.                   室外機: {{ Product.set_outdoor }} {#  // [{{ outdoor_price|number_format }}円]　#}<br>
  399.               {% endif %}
  400.               {% if CatShapeId in [52, 53, 54, 56, 143] %}{# 化粧パネルが存在するのは天カセ4方向・天カセ2方向・天カセ1方向・ビルトインのみ #}
  401.                   {% if Product.set_panel is not null %}
  402.                       化粧パネル: {{ Product.set_panel }} ×{{ sysNum1 }}<br>
  403.                   {% endif %}
  404.               {% endif %}
  405.               {% if CatSystemId not in [82] %}{# 分岐管1はシングル以外、型番が入ります。 #}
  406.                   {% if Product.set_pipe is not null %}
  407.                       {% if CatMaker == 'ダイキン' or CatMaker == 'パナソニック' %}
  408.                         分岐管: 別売り<br>
  409.                     {% else %}
  410.                         {% set set_pipe_price = Product.set_pipe_price * 1.1 %}
  411.                         分岐管1: {{ Product.set_pipe }} {#  // [{{ set_pipe_price|number_format }}円]　#}<br>
  412.                     {% endif %}
  413.                   {% endif %}
  414.               {% endif %}
  415.               {% if CatSystemId not in [82] %}{# 分岐管2はシングル以外、型番が入ります。 #}
  416.                   {% if Product.set_pipe2 is not null %}
  417.                       {% if CatMaker != 'ダイキン' and CatMaker != 'パナソニック' %}
  418.                       {% set set_pipe2_price = Product.set_pipe2_price * 1.1 %}
  419.                       分岐管2: {{ Product.set_pipe2 }} {#  // [{{ set_pipe2_price|number_format }}円]　#}<br>
  420.                       {% endif %}
  421.                   {% endif %}
  422.               {% endif %}
  423.               {% if Product.set_controller is not null %}
  424.                   リモコン: {{ Product.set_controller }}
  425.                   {% if Product.hasTag(5) %}（ワイヤード）{% endif %}
  426.                   {% if Product.hasTag(6) %}（ワイヤレス）{% endif %}
  427.                   {% if CatShapeId == 60 %}（内蔵）{% endif %}
  428.                   {% set set_controller_price = Product.set_controller_price * 1.1 %}
  429.                    {#  // [{{ set_controller_price|number_format }}円]　#}<br>
  430.               {% endif %}
  431.                 {# 非表示項目 #}
  432.                 <input type="hidden" name="set_indoor_size" value="{{ Product.set_indoor_size }}" >
  433.                 <input type="hidden" name="set_indoor_weight" value="{{ Product.set_indoor_weight }}" >
  434.                 <input type="hidden" name="set_indoor_price" value="{{ Product.set_indoor_price }}" >
  435.                 <input type="hidden" name="set_outdoor_size" value="{{ Product.set_outdoor_size }}" >
  436.                 <input type="hidden" name="set_outdoor_weight" value="{{ Product.set_outdoor_weight }}" >
  437.                 <input type="hidden" name="set_outdoor_price" value="{{ Product.set_outdoor_price }}" >
  438.                 <input type="hidden" name="set_panel_size" value="{{ Product.set_panel_size }}" >
  439.                 <input type="hidden" name="set_panel_weight" value="{{ Product.set_panel_weight }}" >
  440.                 <input type="hidden" name="set_panel_price" value="{{ Product.set_panel_price }}" >
  441.                 <input type="hidden" name="set_pipe_price" value="{{ Product.set_pipe_price }}" >
  442.                 <input type="hidden" name="set_pipe2_price" value="{{ Product.set_pipe2_price }}" >
  443.                 <input type="hidden" name="set_controller_size" value="{{ Product.set_controller_size }}" >
  444.                 <input type="hidden" name="set_controller_weight" value="{{ Product.set_controller_weight }}" >
  445.                 <input type="hidden" name="set_controller_price" value="{{ Product.set_controller_price }}" >
  446.                 <input type="hidden" name="set_apf" value="{{ Product.set_apf }}" >
  447.               </td>
  448.           </tr>
  449.         </table>
  450.       </div>
  451.       <div class="s-content-right">
  452.         <table class="c-table-04">
  453.           <tr>
  454.             <th>メーカー</th>
  455.             <td>{{ CatMaker }}</td>
  456.           </tr>
  457.           <tr>
  458.             <th>シリーズ</th>
  459.             <td>{{ CatSeries }}</td>
  460.           </tr>
  461.           <tr>
  462.             <th>形状</th>
  463.             <td>{{ CatShape }}</td>
  464.           </tr>
  465.           <tr>
  466.             <th>馬力</th>
  467.             <td>{{ CatPower }}</td>
  468.           </tr>
  470.           <tr>
  471.             <th>システム</th>
  472.             <td>{{ CatSystem }}</td>
  473.           </tr>
  474.           <tr>
  475.             <th>その他</th>
  476.             <td>
  477.             {% if Product.ProductCategories is not empty %}
  478.               {% for ProductCategory in Product.ProductCategories %}
  479.                 {% if ProductCategory.Category.getParent is not empty %}
  480.                   {% if ProductCategory.Category.getParent.id == 131 %}
  481.                     {{ ProductCategory.Category.name }}
  482.                   {% endif %}
  483.                 {% endif %}
  484.               {% endfor %}
  485.             {% endif %}
  486.             </td>
  487.           </tr>
  488.           <tr>
  489.             <th>電源</th>
  490.             <td>{{ TagPower1 }}{{ TagPower2 }}</td>
  491.           </tr>
  492.           <tr>
  493.             <th>型番</th>
  494.             <td>{{ ProductCode }}</td>
  495.           </tr>
  496.           <tr>
  497.             <th>運転方式</th>
  498.             <td>
  499.             {% if Product.hasTag(3) %}
  500.               {% set PageTag = repository('Eccube\\Entity\\Tag').find('3') %}
  501.               {% if PageTag %}{{ PageTag.name }}{% endif %}
  502.             {% endif %}
  503.             {% if Product.hasTag(4) %}
  504.               {% set PageTag = repository('Eccube\\Entity\\Tag').find('4') %}
  505.               {% if PageTag %}{{ PageTag.name }}{% endif %}
  506.             {% endif %}
  507.             </td>
  508.           </tr>
  509.           <tr>
  510.             <th>省エネ性</th>
  511.             <td>
  512.             {% if Product.ProductCategories is not empty %}
  513.               {% for ProductCategory in Product.ProductCategories %}
  514.                 {% if ProductCategory.Category.getParent is not empty %}
  515.                   {% if ProductCategory.Category.getParent.id == 91 %}
  516.                     {{ ProductCategory.Category.name }}
  517.                   {% endif %}
  518.                 {% endif %}
  519.               {% endfor %}
  520.             {% endif %}
  521.             </td>
  522.           </tr>
  523.           <tr>
  524.             <th>広さ</th>
  525.             <td>{{ CatExtent }}</td>
  526.           </tr>
  527.           <tr>
  528.             <th>リモコン</th>
  529.             <td>{{ TagRC1 }}{{ TagRC2 }}</td>
  530.           </tr>
  531.         </table>
  532.         <div class="p-products-dtl-price">
  533.           <p class="p-products-dtl-price__maker">
  534.           メーカー価格：<br>
  535.           <span class="s-price"><span class="s-num font-en">
  536.           {# 通常価格 #}
  537.           {{ Product.getPrice01IncTaxMin|number_format }}
  538.           </span>円</span>(税込)
  539.           </p>
  540.           <div class="p-products-dtl-price__off">
  541.             {% set price01 = Product.getPrice01IncTaxMin %}
  542.             {% set price02 = Product.getPrice02IncTaxMin %}
  543.             {% if price01 != '' %}
  544.             <div class="p-products-batch">
  545.               <p class="s-text"><span class="font-en">
  546.               <span class="s-main">
  547.               {% set price03 = (1-(price02 / price01))*100|round(1, 'ceil') %}
  548.               {{ price03|number_format(1, '.', ',') }}
  549.               </span>%</span><br>割引</p>
  550.             </div>
  551.             {% endif %}
  552.             <div class="p-products-special-price">
  553.               <p class="s-text-01">特別販売価格</p>
  554.               <p class="s-text-02"><span class="s-main font-en">
  555.               {# 販売価格 #}
  556.               {{ Product.getPrice02IncTaxMin|number_format }}
  557.               </span>円(税込)
  558.               </p>
  559.             </div>
  560.           </div>
  561.         </div>
  562.         <div class="c-cv-group s-estimate-01">
  563.           <p class="s-title">お見積りはこちらから</p>
  564.           <ul class="s-list">
  565.             <li><a href="tel:0120-173-119" class="c-cv-tel">
  566.                 <p class="s-tel-title">お電話からお見積り</p>
  567.                 <p class="s-text-01">
  568.                   <i class="s-icon">
  569.                     <svg>
  570.                       <use xlink:href="{{ asset('assets/img/ico/ico_tel.svg#obj') }}"></use>
  571.                     </svg>
  572.                   </i>
  573.                   <span class="s-tel">0120-173-119</span>
  574.                 </p>
  575.                 <p class="s-text-02 font-en">受付：9:00～19:00(土日祝除く)
  576.                 </p>
  577.               </a></li>
  578.             <li>
  579.             <div class="c-cv-link-block">
  580.               <form method="get" action="https://www.airconwork.co.jp/rp/contact.php">
  581.                 <input type="hidden" name="products_id" value="{{ Product.id }}" >
  582.                 <input type="hidden" name="products_make" value="{{ CatMaker }}" />
  583.                 <input type="hidden" name="products_name" value="{{ Product.name }}" />
  584.                 <input type="hidden" name="product_code" value="{{ ProductCode }}" />
  585.                 <input type="hidden" name="products_price1" value="{{Product.getPrice01IncTaxMin}}" />
  586.                 <input type="hidden" name="products_price2" value="{{Product.getPrice02IncTaxMin}}" />
  587.                 <input type="hidden" name="page" value="main" />
  588.                 <input type="hidden" name="carrier" value="products/detail/{{ Product.id }}" />
  589.                 <button id="btn-cv" class="c-cv-link">
  590.                   <i class="s-icon">
  591.                     <img src="{{ asset('assets/img/ico/ico_web.png') }}" alt="">
  592.                   </i>
  593.                   <p class="s-text">WEB<span class="no-sp">からお</span>見積り</p>
  594.                   <i class="s-arrow">
  595.                     <svg>
  596.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  597.                     </svg>
  598.                   </i>
  599.                 </button>
  600.               </form>
  601.               </div>
  602.               <a href="https://lin.ee/VlB4HoK" target="_blank" class="c-cv-link">
  603.                 <i class="s-icon">
  604.                   <img src="{{ asset('assets/img/ico/ico_line.png') }}" alt="">
  605.                 </i>
  606.                 <p class="s-text">LINE<span class="no-sp">からお</span>見積り</p>
  607.                 <i class="s-arrow">
  608.                   <svg>
  609.                     <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  610.                   </svg>
  611.                 </i>
  612.               </a>
  613.             </li>
  614.           </ul>
  615.         </div>
  616.       </div>
  617.     </div>
  618.   </div>
  620.   <div class="c-section">
  621.     <h2 class="c-title-07"><span class="s-text">{{ title }} について</span></h2>
  622.     {{ include('Module/category_description.twig', {cid: CatId}) }}
  623.     {{ include('Module/category_description.twig', {cid: CatSeriesId}) }}
  624.     {{ include('Module/category_description.twig', {cid: CatShapeId}) }}
  625.     {{ include('Module/category_description.twig', {cid: CatPowerId}) }}
  626.     {{ include('Module/category_description.twig', {cid: CatExtentId}) }}
  627.     {{ include('Module/category_description.twig', {cid: CatSystemId}) }}
  628.   </div>
  630.   {% if Product.description_detail is not null %}
  631.   <div class="c-section">
  632.   {% if Product.description_title is not null %}
  633.     <h2 class="c-title-07"><span class="s-text">{{ Product.description_title }}</span></h2>
  634.   {% endif %}
  635.     <div class="c-text">
  636.       <div class="s-content">
  637.       {{ Product.description_detail }}
  638.       </div>
  639.     </div>
  640.   </div>
  641.   {% endif %}
  643.   <div class="c-section">
  644.     <h2 class="c-title-07"><span class="s-text">{{ title }} と比較される商品</span></h2>
  645.     <div class="p-products-dtl-comparison">
  647.       <table class="c-table-04">
  648.         <tbody>
  649.           <tr>
  650.             <th class="s-col1">メーカー</th>
  651.             <th class="s-col2">エアコン商品型番</th>
  652.           </tr>
  653.           <tr>
  654.             <td><b>ダイキン</b></td>
  655.             <td class="align-left">
  656.               {{ include('Module/comparison.twig', {cid: '2'}) }}
  657.             </td>
  658.           </tr>
  659.           <tr>
  660.             <td><b>三菱電機</b></td>
  661.             <td class="align-left">
  662.             {{ include('Module/comparison.twig', {cid: '31'}) }}
  663.             </td>
  664.           </tr>
  665.           <tr>
  666.             <td><b>日立</b></td>
  667.             <td class="align-left">
  668.               {{ include('Module/comparison.twig', {cid: '21'}) }}
  669.             </td>
  670.           </tr>
  671.           <tr>
  672.             <td><b>東芝</b></td>
  673.             <td class="align-left">
  674.               {{ include('Module/comparison.twig', {cid: '11'}) }}
  675.             </td>
  676.           </tr>
  677.           <tr>
  678.             <td><b>パナソニック</b></td>
  679.             <td class="align-left">
  680.               {{ include('Module/comparison.twig', {cid: '41'}) }}
  681.             </td>
  682.           </tr>
  683.         </tbody>
  684.       </table>
  685.     </div>
  686.   </div>
  687.   <div class="c-section">
  688.     <h2 class="c-title-07"><span class="s-text">入れ替え工事には「フロン処理」も「機器廃棄」も含んだ下記項目が含まれています</span></h2>
  689.     <div class="p-products-dtl-point">
  690.       <ul class="c-grid col6">
  691.         <li>
  692.           <div class="c-card-06">
  693.             <h3 class="c-card-06__title">取付機器本体価格</h3>
  694.             <div class="c-card-06__thum"><img src="{{ asset('assets/img/products-dtl/img_01.jpg') }}" alt=""></div>
  695.           </div>
  696.         </li>
  697.         <li>
  698.           <div class="c-card-06">
  699.             <h3 class="c-card-06__title">機器撤去・取付費</h3>
  700.             <div class="c-card-06__thum"><img src="{{ asset('assets/img/products-dtl/img_02.jpg') }}" alt=""></div>
  701.           </div>
  702.         </li>
  703.         <li>
  704.           <div class="c-card-06">
  705.             <h3 class="c-card-06__title">本体処分・諸経費</h3>
  706.             <div class="c-card-06__thum"><img src="{{ asset('assets/img/products-dtl/img_03.jpg') }}" alt=""></div>
  707.           </div>
  708.         </li>
  709.         <li>
  710.           <div class="c-card-06">
  711.             <h3 class="c-card-06__title">フロン回収処分費</h3>
  712.             <div class="c-card-06__thum"><img src="{{ asset('assets/img/products-dtl/img_04.jpg') }}" alt=""></div>
  713.           </div>
  714.         </li>
  715.         <li>
  716.           <div class="c-card-06">
  717.             <h3 class="c-card-06__title">フロン書類発行費</h3>
  718.             <div class="c-card-06__thum"><img src="{{ asset('assets/img/products-dtl/img_05.jpg') }}" alt=""></div>
  719.           </div>
  720.         </li>
  721.         <li>
  722.           <div class="c-card-06">
  723.             <h3 class="c-card-06__title">当社工事保証１年</h3>
  724.             <div class="c-card-06__thum"><img src="{{ asset('assets/img/products-dtl/img_06.jpg') }}" alt=""></div>
  725.           </div>
  726.         </li>
  727.       </ul>
  728.     </div>
  729.   </div>
  730.   <div class="c-section">
  731.     <h2 class="c-title-07"><span class="s-text">エアコンワークが選ばれる理由</span></h2>
  732.     <div class="p-products-dtl-reason">
  733.       <ul class="c-grid col5 p-top-point__list">
  734.         <li>
  735.           <div class="c-card-01">
  736.             <i class="c-card-01__icon"><svg class="s-01">
  737.                 <use xlink:href="{{ asset('assets/img/ico/ico_free.svg#obj') }}"></use>
  738.               </svg></i>
  739.             <h3 class="c-card-01__title">無料0円</h3>
  740.             <p class="c-card-01__text">現場調査</p>
  741.           </div>
  742.         </li>
  743.         <li>
  744.           <div class="c-card-01">
  745.             <i class="c-card-01__icon"><svg class="s-02">
  746.                 <use xlink:href="{{ asset('assets/img/ico/ico_hosyou.svg#obj') }}"></use>
  747.               </svg></i>
  748.             <h3 class="c-card-01__title">10年</h3>
  749.             <p class="c-card-01__text">ツイン保証</p>
  750.           </div>
  751.         </li>
  752.         <li>
  753.           <div class="c-card-01">
  754.             <i class="c-card-01__icon"><svg class="s-03">
  755.                 <use xlink:href="{{ asset('assets/img/ico/ico_mitsumori.svg#obj') }}"></use>
  756.               </svg></i>
  757.             <h3 class="c-card-01__title">追加請求<br class="no-pc">なし</h3>
  758.             <p class="c-card-01__text">安心価格</p>
  759.           </div>
  760.         </li>
  761.         <li>
  762.           <div class="c-card-01">
  763.             <i class="c-card-01__icon"><svg class="s-04">
  764.                 <use xlink:href="{{ asset('assets/img/ico/ico_hand.svg#obj') }}"></use>
  765.               </svg></i>
  766.             <h3 class="c-card-01__title">空調の<br class="no-pc">スペシャリスト</h3>
  767.             <p class="c-card-01__text">専任担当が<br class="only-sp">すべて対応</p>
  768.           </div>
  769.         </li>
  770.         <li>
  771.           <div class="c-card-01">
  772.             <i class="c-card-01__icon"><svg class="s-05">
  773.                 <use xlink:href="{{ asset('assets/img/ico/ico_card.svg#obj') }}"></use>
  774.               </svg></i>
  775.             <h3 class="c-card-01__title">リース･<br class="no-pc">ローンOK</h3>
  776.             <p class="c-card-01__text">選べるお支払方法</p>
  777.           </div>
  778.         </li>
  779.       </ul>
  780.     </div>
  781.   </div>
  782.   <div class="c-section">
  783.     <h2 class="c-title-07"><span class="s-text">お見積り依頼から工事完了までのフロー</span></h2>
  784.     <div class="p-products-dtl-flow">
  785.       <ol class="c-grid col6 c-list-num">
  786.         <li>
  787.           <div class="c-card-07">
  788.             <h3 class="c-card-07__title">お問い合わせ</h3>
  789.             <div class="c-card-07__thum"><img src="{{ asset('assets/img/products-dtl/img_07.jpg') }}" alt=""></div>
  790.           </div>
  791.         </li>
  792.         <li>
  793.           <div class="c-card-07">
  794.             <h3 class="c-card-07__title">無料現場調査</h3>
  795.             <div class="c-card-07__thum"><img src="{{ asset('assets/img/products-dtl/img_08.jpg') }}" alt=""></div>
  796.           </div>
  797.         </li>
  798.         <li>
  799.           <div class="c-card-07">
  800.             <h3 class="c-card-07__title">正式見積もりの提出</h3>
  801.             <div class="c-card-07__thum"><img src="{{ asset('assets/img/products-dtl/img_09.jpg') }}" alt=""></div>
  802.           </div>
  803.         </li>
  804.         <li>
  805.           <div class="c-card-07">
  806.             <h3 class="c-card-07__title">ご契約</h3>
  807.             <div class="c-card-07__thum"><img src="{{ asset('assets/img/products-dtl/img_10.jpg') }}" alt=""></div>
  808.           </div>
  809.         </li>
  810.         <li>
  811.           <div class="c-card-07">
  812.             <h3 class="c-card-07__title">設置工事</h3>
  813.             <div class="c-card-07__thum"><img src="{{ asset('assets/img/products-dtl/img_11.jpg') }}" alt=""></div>
  814.           </div>
  815.         </li>
  816.         <li>
  817.           <div class="c-card-07">
  818.             <h3 class="c-card-07__title">アフターフォロー</h3>
  819.             <div class="c-card-07__thum"><img src="{{ asset('assets/img/products-dtl/img_12.jpg') }}" alt=""></div>
  820.           </div>
  821.         </li>
  822.       </ol>
  823.     </div>
  824.   </div>
  826. {% else %}
  827.   <div class="c-section">
  828.     旧型番商品につき販売は終了しております。最新機器はお問合せください
  829.   </div>
  830. {% endif %}
  831. {% endblock %}