app/template/default/index.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 = 'front_page' %}
  15. {% block stylesheet %}
  16.     <style>
  17.         .slick-slider {
  18.             margin-bottom: 30px;
  19.         }
  21.         .slick-dots {
  22.             position: absolute;
  23.             bottom: -45px;
  24.             display: block;
  25.             width: 100%;
  26.             padding: 0;
  27.             list-style: none;
  28.             text-align: center;
  29.         }
  31.         .slick-dots li {
  32.             position: relative;
  33.             display: inline-block;
  34.             width: 20px;
  35.             height: 20px;
  36.             margin: 0 5px;
  37.             padding: 0;
  39.             cursor: pointer;
  40.         }
  42.         .slick-dots li button {
  43.             font-size: 0;
  44.             line-height: 0;
  45.             display: block;
  46.             width: 20px;
  47.             height: 20px;
  48.             padding: 5px;
  49.             cursor: pointer;
  50.             color: transparent;
  51.             border: 0;
  52.             outline: none;
  53.             background: transparent;
  54.         }
  56.         .slick-dots li button:hover,
  57.         .slick-dots li button:focus {
  58.             outline: none;
  59.         }
  61.         .slick-dots li button:hover:before,
  62.         .slick-dots li button:focus:before {
  63.             opacity: 1;
  64.         }
  66.         .slick-dots li button:before {
  67.             content: " ";
  68.             line-height: 20px;
  69.             position: absolute;
  70.             top: 0;
  71.             left: 0;
  72.             width: 12px;
  73.             height: 12px;
  74.             text-align: center;
  75.             opacity: .25;
  76.             background-color: black;
  77.             border-radius: 50%;
  79.         }
  81.         .slick-dots li.slick-active button:before {
  82.             opacity: .75;
  83.             background-color: black;
  84.         }
  86.         .slick-dots li button.thumbnail img {
  87.             width: 0;
  88.             height: 0;
  89.         }
  90.         
  91.     </style>
  92. {% endblock %}
  94. {% block javascript %}
  95.     <script>
  96.         $(function() {
  97.             $('.main_visual').slick({
  98.                 dots: true,
  99.                 arrows: false,
  100.                 // autoplay: true,
  101.                 speed: 300
  102.             });
  103.         });
  104.         $(function() {
  105.             $('.ec-reCommended__list').slick({
  106.                 infinite: true,
  107.                 dots: true,
  108.                 arrows: true,
  109.                 slidesToShow: 3,
  110.                 slidesToScroll: 1,
  111.                 speed: 300,
  112.                 responsive: [
  113.                     {
  114.                         breakpoint: 1200,
  115.                         settings: {
  116.                             slidesToShow: 2,
  117.                             slidesToScroll: 1,
  118.                         }
  119.                     },
  120.                     {
  121.                         breakpoint: 768,
  122.                         settings: {
  123.                             slidesToShow: 1,
  124.                         }
  125.                     }
  126.                 ]
  127.             });
  128.         });
  129.         $(function() {
  130.             $('.ec-conStruction__list').slick({
  131.                 infinite: true,
  132.                 dots: true,
  133.                 arrows: true,
  134.                 slidesToShow: 3,
  135.                 slidesToScroll: 1,
  136.                 speed: 300,
  137.                 responsive: [
  138.                     {
  139.                         breakpoint: 1200,
  140.                         settings: {
  141.                             slidesToShow: 2,
  142.                             slidesToScroll: 1,
  143.                         }
  144.                     },
  145.                     {
  146.                         breakpoint: 768,
  147.                         settings: {
  148.                             slidesToShow: 1,
  149.                         }
  150.                     }
  151.                 ]
  152.             });
  153.         });
  154.     </script>
  156.     <script>
  157.         $(document).ready(function() {
  158.             var checks = $(".show-on-change .group");
  159.             checks.on('click', function (e) {
  160.                 if (e.target.tagName.toUpperCase() == 'IMG' || e.target.tagName.toUpperCase() == 'P') {
  161.                     var input = $(this).find("input");
  162.                     if (input.prop("checked") == false) {
  163.                         input.prop("checked", true);
  164.                     } else {
  165.                         input.prop("checked", false);
  166.                     }
  167.                 }
  168.             });
  169.         });
  170.     </script>
  172.     <script>
  173.         $(document).ready(function(){
  174.             $("ul#tabs li").click(function(e){
  175.                 $("ul#tabs li").removeClass('active');
  176.                 $(this).addClass('active');
  178.                 if ($(this).index() == 1) {
  179.                     $('.show-on-change').addClass('show');
  180.                 }
  181.                 else{
  182.                     $('.show-on-change').removeClass('show');
  183.                 }
  184.             });
  185.         });
  186.     </script>
  187. {% endblock javascript %}
  188.     
  189. {% block main %}
  190.     <!-- slider -->
  191.     <section class="ec-sliderRole">
  192.         <div class="main_visual pc">
  193.             <div class="item slick-slide v2">
  194.                 <img src="{{ asset('assets/img/top/mv-01.jpg') }}">
  195.             </div>
  196.             {# <div class="item slick-slide hbtn pc">
  197.                 <img src="{{ asset('assets/img/top/MV_2.jpg') }}">
  198.                 <div class="btn-slider">
  199.                     <div>
  200.                         <a href="{{ url('user_data',  {'route': 'strengths'}) }}"><span>エアコンがおトクな</span>
  201.                             <span>4つの秘密</span>
  202.                             <span>はこちら</span>
  203.                             <span>Click！</span>
  204.                         </a>
  205.                     </div>
  206.                 </div>
  207.             </div> #}
  208.         </div>
  209.         <div class="main_visual sp">
  210.             <div class="item slick-slide v2">
  211.                 <a href="{{ url('product_recommend') }}"><img src="{{ asset('assets/img/top/mv-01-sp.jpg') }}"></a>
  212.             </div>
  213.         </div>
  214.     </section>
  216.     <section class="top-recommended">
  217.         <div class="top-recommended__inner ec-reCommended__inner">
  218.             <h2 class="top-recommended__title"><span>買うなら今<i>！</i>繁忙期前の今が安い<i>！</i></span><span>エアココのイチオシ<i>！</i></span></h2>
  219.             <ul class="top-recommended__items">
  220.                 <li class="top-recommended__item">
  221.                     <a href="{{ url('product_recommend') }}#group_32">
  222.                         <div class="top-recommended__item__img">
  223.                             <img src="{{ asset('assets/img/top/recommended-product-01.jpg') }}">
  224.                         </div>
  225.                         <div class="top-recommended__item__txt">
  226.                             <p class="top-recommended__item__name">
  227.                                 <img src="{{ asset('assets/img/product/trademark-nobd-32.png') }}">
  228.                                 <span>白くまくん</span>
  229.                             </p>
  230.                             <p class="top-recommended__item__price">
  231.                                 <span>6畳用</span>
  232.                                 <span>60,500<small>円～</small></span>
  233.                             </p>
  234.                         </div>
  235.                     </a>
  236.                 </li>
  237.                 <li class="top-recommended__item">
  238.                     <a href="{{ url('product_recommend') }}#group_30">
  239.                         <div class="top-recommended__item__img">
  240.                             <img src="{{ asset('assets/img/top/recommended-product-02.jpg') }}">
  241.                         </div>
  242.                         <div class="top-recommended__item__txt">
  243.                             <p class="top-recommended__item__name">
  244.                                 <img src="{{ asset('assets/img/product/trademark-nobd-30.png') }}">
  245.                                 <span>ダイキンRX</span>
  246.                             </p>
  247.                             <p class="top-recommended__item__price">
  248.                                 <span>6畳用</span>
  249.                                 <span>184,900<small>円～</small></span>
  250.                             </p>
  251.                         </div>
  252.                     </a>
  253.                 </li>
  254.                 <li class="top-recommended__item">
  255.                     <a href="{{ url('product_recommend') }}#group_30-2">
  256.                         <div class="top-recommended__item__img">
  257.                             <img src="{{ asset('assets/img/top/recommended-product-03.jpg') }}">
  258.                         </div>
  259.                         <div class="top-recommended__item__txt">
  260.                             <p class="top-recommended__item__name">
  261.                                 <img src="{{ asset('assets/img/product/trademark-nobd-30.png') }}">
  262.                                 <span>ダイキンMX</span>
  263.                             </p>
  264.                             <p class="top-recommended__item__price">
  265.                                 <span>6畳用</span>
  266.                                 <span>145,900<small>円～</small></span>
  267.                             </p>
  268.                         </div>
  269.                     </a>
  270.                 </li>
  271.             </ul>
  272.             <a href="{{ url('product_recommend') }}" class="btn btn-sd">おすすめ商品一覧へ</a>
  273.         </div>
  274.     </section>
  276.     <section class="top-service">
  277.         <div class="top-service__inner ec-reCommended__inner">            
  278.             <ul class="top-service__items">
  279.                 <li class="top-service__item top-service__item--blue">
  280.                     <a href="{{ url('loan') }}" class="btn btn-sd">
  281.                         <span>審査に不安がある方も安心！</span>
  282.                         <span>自社ローン対象商品</span>
  283.                     </a>
  284.                 </li>
  285.                 <li class="top-service__item top-service__item--white">
  286.                     <a href="{{ url('tel_service_product') }}" class="btn btn-sd">
  287.                         <span>電話完結型サービス</span>
  288.                         <span>対象商品</span>
  289.                     </a>
  290.                 </li>
  291.             </ul>
  292.             <div class="top-service__desc">
  293.                 <p>本体と工事費込でお得なエアコンを取り揃えています。ルームエアコンの購入、新規取り付け、買い替えはここからお選びください。空気清浄機能、内部クリーニング機能など、便利な機能のモデルも多数あります。販売から設置工事も行っているためトータルでお任せください。</p>
  294.             </div>
  295.         </div>
  296.     </section>
  298.     <section class="top-search">
  299.         <div class="top-search__inner ec-reCommended__inner">
  300.             <ul class="top-service__items">
  301.                 <li class="top-service__item top-service__item--blue vip">
  302.                     <a href="https://gogo002.xbiz.jp/rintec/products/list?category_id=8" class="btn btn-sd">
  303.                         <span>通常のネット購入はこちら</span>
  304.                         <span>※工事費用事前決済</span>
  305.                     </a>
  306.                 </li>
  307.             </ul>
  308.             <div class="top-search__item">
  309.                 <h3>機能から選ぶ</h3>
  310.                 <ul>
  311.                     {% for category in categories %}
  312.                         {% if category.getParent() %}
  313.                             {% if category.getParent().id == "21" %}
  314.                                 <li>
  315.                                     <a class="btn btn-sm" href="{{ url('product_list') }}?category_id={{ category.id }}&active_idx=0&feature%5B%5D={{ category.id }}">
  316.                                         {{ category.name | trans }}
  317.                                     </a>
  318.                                 </li>
  319.                             {% endif %}
  320.                         {% endif %}
  321.                     {% endfor %}
  322.                 </ul>
  323.             </div>
  324.             <div class="top-search__item">
  325.                 <h3>お部屋の広さから選ぶ</h3>
  326.                 <ul>
  327.                     {% for category in categories %}
  328.                         {% if category.getParent() %}
  329.                             {% if category.getParent().id == "19" %}
  330.                                 <li>
  331.                                     <a class="btn btn-sm" href="{{ url('product_list') }}?category_id={{ category.id }}&active_idx=1&room%5B%5D={{ category.id }}">
  332.                                         {{ category.name | trans }}
  333.                                     </a>
  334.                                 </li>
  335.                             {% endif %}
  336.                         {% endif %}
  337.                     {% endfor %}
  338.                 </ul>
  339.             </div>
  340.             <div class="top-search__item">
  341.                 <h3>メーカーから選ぶ</h3>
  342.                 <ul>
  343.                     {% for category in categories %}
  344.                         {% if category.getParent() %}
  345.                             {% if category.getParent().id == "20" %}
  346.                                 <li>
  347.                                     <a class="btn btn-sm" href="{{ url('product_list') }}?category_id={{ category.id }}&active_idx=2&maker%5B%5D={{ category.id }}">
  348.                                         {{ category.name | trans }}
  349.                                     </a>
  350.                                 </li>
  351.                             {% endif %}
  352.                         {% endif %}
  353.                     {% endfor %}
  354.                 </ul>
  355.             </div>
  356.         </div>
  357.     </section>
  359.     <section class="top-construction" id="construction">
  360.         <div class="top-construction__inner ec-reCommended__inner">
  361.             <h2 class="top-construction__title">工事のみのご依頼</h2>
  362.             <p class="top-construction__desc">エアココでは、エアコン本体を購入せずに交換工事、新設工事、電気工事の工事のみも全国対応します。空調工事・電気工事会社からできたエアココならではのサービスですので、ぜひご活用ください。</p>
  363.             <ul class="top-construction__items">
  364.                 <li class="top-construction__item">
  365.                     <img class="top-construction__item__img" src="{{ asset('assets/img/top/construction-1.jpg') }}">
  366.                     <div class="top-construction__item__txt">
  367.                         <div>
  368.                             <p class="top-construction__item__cnt">01</p>
  369.                             <h3 class="top-construction__item__ttl">新設工事</h3>
  370.                             <p class="top-construction__item__desc">今設置されていない部屋、新居先や転居先で新設する工事を依頼したい方</p>
  371.                         </div>
  372.                         <a class="btn btn-sd" href="{{ url('new-replace') }}?tab=new">もっと見る</a>
  373.                     </div>
  374.                 </li>
  375.                 <li class="top-construction__item">
  376.                     <img class="top-construction__item__img" src="{{ asset('assets/img/top/construction-2.jpg') }}">
  377.                     <div class="top-construction__item__txt">
  378.                         <div>
  379.                             <p class="top-construction__item__cnt">02</p>
  380.                             <h3 class="top-construction__item__ttl">交換工事</h3>
  381.                             <p class="top-construction__item__desc">今、使っているエアコンを交換する工事を依頼したい方</p>
  382.                         </div>
  383.                         <a class="btn btn-sd" href="{{ url('new-replace') }}?tab=replace">もっと見る</a>
  384.                     </div>
  385.                 </li>
  386.                 <li class="top-construction__item">
  387.                     <img class="top-construction__item__img" src="{{ asset('assets/img/top/construction-3.jpg') }}">
  388.                     <div class="top-construction__item__txt">
  389.                         <div>
  390.                             <p class="top-construction__item__cnt">03</p>
  391.                             <h3 class="top-construction__item__ttl">移設工事</h3>
  392.                             <p class="top-construction__item__desc">転居等に伴い今使っているエアコンを別の場所に移設する工事を依頼したい方</p>
  393.                         </div>
  394.                         <a class="btn btn-sd" href="{{ url('new-replace') }}?tab=newplace">もっと見る</a>
  395.                     </div>
  396.                 </li>
  397.                 <li class="top-construction__item">
  398.                     <img class="top-construction__item__img" src="{{ asset('assets/img/top/construction-4.jpg') }}">
  399.                     <div class="top-construction__item__txt">
  400.                         <div>
  401.                             <p class="top-construction__item__cnt">04</p>
  402.                             <h3 class="top-construction__item__ttl">電気工事</h3>
  403.                             <p class="top-construction__item__desc">コンセントの新設や増設、ブレーカーの電圧変更等の電気工事を依頼したい方</p>
  404.                         </div>
  405.                         <a class="btn btn-sd" href="{{ url('electrical') }}">もっと見る</a>
  406.                     </div>
  407.                 </li>
  408.             </ul>
  409.         </div>
  410.     </section>
  412.     {% set recommendeds = CustomizeTopColumn(1, 5) %}
  413.     {% if recommendeds|length > 0 %}
  414.         <div class="ec-reCommended">
  415.             <div class="ec-reCommended__inner">
  416.                 <div class="group-border">
  417.                     <div class="ec-reCommended__title">
  418.                         <p>おすすめのコンテンツ</p>
  419.                     </div>
  420.                     <div class="lists">
  421.                         <div class="combo-mess">
  422.                             <div class="mess">
  423.                                 <span>エアコンのお役立ち情報を紹介してるよ！</span>
  424.                             </div> 
  425.                             <img class="sp" src="{{ asset('assets/img/common/panda-healthcare_staff.png') }}" alt="">
  426.                         </div>
  427.                         <div class="ec-reCommended__list">
  428.                             {% for blog in recommendeds %}
  429.                                 <a href="{{ url('cm_blog_pro_page_detail', {'id': blog.slug ? blog.slug : blog.id}) }}" class="item slick-slide ec-reCommended__item">
  430.                                     {% if blog.getMainListImage %}
  431.                                         <img src="{{ asset(blog.getMainListImage|no_image_product, 'save_image') }}">
  432.                                     {% else %}
  433.                                         <img src="{{ asset(''|no_image_product, 'save_image') }}" class='item_blog_image'>
  434.                                     {% endif %}
  435.                                     <div class="title">
  436.                                         <p>{{ blog.getTitle|length > 45 ? blog.getTitle|striptags|replace({('&nbsp;'):' '})|slice(0, 45)|raw ~ '...' : blog.getTitle|raw }}</p>
  437.                                     </div>
  438.                                     {# <div class="text">
  439.                                         <p>{{ blog.body|length > 50 ? blog.body|striptags|replace({('&nbsp;'):' '})|slice(0, 50)|raw ~ '...' : blog.body|raw }}</p>
  440.                                     </div> #}
  441.                                 </a>  
  442.                             {% endfor %}          
  443.                         </div>
  444.                     </div>
  445.                     <div class="ec-reCommended__btn">
  446.                         <a href="{{ url('columns') }}" class="btn btn-sd">
  447.                             <span>もっと見る</span>
  448.                         </a>
  449.                     </div>
  450.                 </div>
  451.                 {# <div class="message">
  452.                     <div class="group">
  453.                         <img src="{{ asset('assets/img/common/panda-m.png') }}" alt="">
  454.                     </div>
  455.                     <div class="mess">
  456.                         <p>
  457.                             私たちはエアコンシェルジュのリンちゃんとテックくん。エアコンってどれがいいのか迷っちゃう…。<br class="pc">クリーニングっていつするべき？そんなお悩みも全部エアココにおまかせ！エアコン選びも設置工事も私たちがお手伝いするね！
  458.                         </p>
  459.                     </div>
  460.                 </div>
  461.                 <div class="message r">
  462.                     <div class="mess">
  463.                         <p>
  464.                             10年以上の実績のある電気工事会社が見積するから、安心、安全
  465.                         </p>
  466.                     </div>
  467.                     <div class="group">
  468.                         <img src="{{ asset('assets/img/common/panda-fm.png') }}" alt="">
  469.                     </div>
  470.                 </div> #}
  471.             </div>
  472.         </div>
  473.     {% endif %}
  475.     {# <div class="ec-conDitinoer" id="inroom">
  476.         <div class="ec-conDitinoer__inner">
  477.             <div class="inner">
  478.                 <div class="ec-conDitinoer__title">
  479.                     <div class="group-image">
  480.                         <img src="{{ asset('assets/img/common/ic-air_conditioner-w.png') }}" alt="">
  481.                         <p>個人でご購入のお客様はこちら</p>
  482.                     </div>
  483.                     <p>ルームエアコン</p>
  484.                 </div>
  485.                 <div class="ec-conDitinoer__text">
  486.                     <p>本体と工事費込でお得なエアコンを取り揃えています。ルームエアコンの購入、新規取り付け、買い替えはここからお選びください。空気清浄機能、内部クリーニング機能など、便利な機能のモデルも多数あります。販売から設置工事も行っているためトータルでお任せください。</p>
  487.                 </div>
  488.                 <div class="select_product">
  489.                     <div class="title">
  490.                         <p>商品を選ぶ</p>
  491.                     </div>
  492.                     <div class="list">
  493.                         <a href="{{ url('product_recommend') }}" class="item">
  494.                             <img src="{{ asset('assets/img/top/select-p-1.jpg') }}" alt="">
  495.                             <span class="v2">エアココサイト<br />開設キャンペーン<br />
  496.                                 <div class="panda">
  497.                                     <img src="{{ asset('assets/img/common/panda-m.png') }}" alt="">
  498.                                     <img src="{{ asset('assets/img/common/panda-fm.png') }}" alt="">
  499.                                 </div>
  500.                             </span>
  501.                             <span class="v2"></span>
  502.                             <span class="v2"></span>
  503.                             <span class="arr v2"></span>
  504.                         </a>
  505.                         <a href="{{ url('product_list') }}?category_id=8" class="item">
  506.                             <img src="{{ asset('assets/img/top/select-p-2.jpg') }}" alt="">
  507.                             <span>機能から選ぶ</span>
  508.                             <span></span>
  509.                             <span></span>
  510.                             <span class="arr"></span>
  511.                         </a>
  512.                         <a href="{{ url('product_list') }}?category_id=8&active_idx=1" class="item">
  513.                             <img src="{{ asset('assets/img/top/select-p-3.jpg') }}" alt="">
  514.                             <span>お部屋の<br />広さから選ぶ</span>
  515.                             <span></span>
  516.                             <span></span>
  517.                             <span class="arr"></span>
  518.                         </a>
  519.                         <a href="{{ url('product_list') }}?category_id=8&active_idx=2" class="item">
  520.                             <img src="{{ asset('assets/img/top/select-p-4.jpg') }}" alt="">
  521.                             <span>メーカーから選ぶ</span>
  522.                             <span></span>
  523.                             <span></span>
  524.                             <span class="arr"></span>
  525.                         </a>
  526.                     </div>
  527.                 </div>
  529.                 <div class="construction">
  530.                     <div class="anchor">
  531.                         <div class="anchor__inner" id="construction"></div>
  532.                     </div>
  533.                     <div class="title">
  534.                         <p>工事について</p>
  535.                     </div>
  536.                     <div class="list-cate">
  537.                         <a href="{{ url('new-replace') }}#replace" class="cate">
  538.                             <span>交換工事</span>
  539.                         </a>
  540.                         <a href="{{ url('new-replace') }}#new" class="cate">
  541.                             <span>新設工事</span>
  542.                         </a>
  543.                         <a href="{{ url('electrical') }}" class="cate">
  544.                             <span>電気工事</span> 
  545.                         </a>
  546.                     </div>
  548.                     <div class="list-service">
  549.                         <div class="service">
  550.                             <div class="group">
  551.                                 <div class="title">
  552.                                     <p>ルーム用 エアコンクリーニング</p>
  553.                                 </div>
  554.                                 <img class="sp" src="{{ asset('assets/img/common/kuma-children.png') }}" alt="">
  555.                                 <div class="text">
  556.                                     <p>近日公開予定</p>
  557.                                 </div>
  558.                                 <a href="{{ url('user_data', {'route': 'cleaning-room'}) }}" class="btn hidden">
  559.                                     <span>詳細はこちら</span>
  560.                                 </a>
  561.                             </div>
  562.                             <img class="pc" src="{{ asset('assets/img/common/kuma-children.png') }}" alt="">
  563.                         </div>
  564.                         <span></span>
  565.                         <div class="service">
  566.                             <div class="group">
  567.                                 <div class="title">
  568.                                     <p>ルーム用 エアコン工事</p>
  569.                                 </div>
  570.                                 <img class="sp" src="{{ asset('assets/img/common/panda-healthcare_staff.png') }}" alt="">
  571.                                 <div class="text">
  572.                                     <p>エアコンの取り付けや、交換工事、新設工事、電気工事はこちらからお申し込みください。手順やオプションもご紹介しています。</p>
  573.                                 </div>
  574.                                 <a href="{{ url('user_data', {'route': 'construction-room'}) }}" class="btn">
  575.                                     <span>詳細はこちら</span>
  576.                                 </a>
  577.                             </div>
  578.                             <img class="pc" src="{{ asset('assets/img/common/panda-healthcare_staff.png') }}" alt="">
  579.                         </div>
  580.                     </div>
  581.                 </div>
  583.             </div>
  584.         </div>
  585.     </div> #}
  587.     {# <div class="ec-comMercial">
  588.         <div class="ec-comMercial__inner">
  589.             <div class="ec-comMercial__title">
  590.                 <div class="group-image">
  591.                     <img src="{{ asset('assets/img/common/ic-double-wrench.png') }}" alt="">
  592.                     <p>店舗や企業でご購入のお客様はこちら</p>
  593.                 </div>
  594.                 <p>業務用エアコン</p>
  595.             </div>
  596.             <div class="ec-comMercial__text">
  597.                 <p>フロン排出抑制法によって3か月ごとの簡易点検と、定期点検の義務があります。今設置している業務用エアコンの交換が必要になるケースもあります。業務用エアコンの新規取付、交換、定期点検もお任せください。</p>
  598.             </div>
  599.             <div class="ec-comMercial__list">
  600.                 <a href="http://gyoumu.aircoco.shop/index.html" target="_blank" class="item">
  601.                     <p>フロン排出抑制法に伴う<br>責任義務と定期点検</p>
  602.                 </a>
  603.                 <a href="https://env-hozen.jp/" target="_blank" class="item">
  604.                     <img src="{{ asset('assets/img/top/logo_env.png') }}" alt="">
  605.                 </a>
  606.             </div>
  608.             <div class="list-btn">
  609.                 <a href="{{ url('contact') }}?type=6" class="btn">
  610.                     <span>フロン排出抑制法についての<br />
  611.                         お問い合わせはこちら</span>
  612.                 </a>
  613.             </div>
  615.             <div class="title" id="outroom">
  616.                 <p>商品を選ぶ</p>
  617.             </div>
  618.             <form name="form1" id="form1" method="get" action="{{ url('product_list') }}">
  619.             
  620.                 <input type="hidden" name="category_id" value="7">
  622.                 <div class="ec-comMercial__tabs">
  623.                     <ul id="tabs">
  624.                         <li class="active">新規</li>
  625.                         <li>交換</li>
  626.                     </ul>
  627.                     <div id="tab">
  628.                         <div class="item active">
  629.                             <div class="title">
  630.                                 <p>業種を選ぶ</p>
  631.                             </div>
  632.                             <div class="group-checkbox">
  633.                                 {% for category in categories %}
  634.                                     {% if category.getParent() %}
  635.                                         {% if category.getParent().id == "50" %}
  636.                                             <div class="group">
  637.                                                 <input type="checkbox" id="kind_{{ category.id }}" name="kind[]" value="{{ category.id }}">
  638.                                                 <label for="kind_{{ category.id }}">{{ category.name | trans }}</label>
  639.                                             </div>
  640.                                         {% endif %}
  641.                                     {% endif %}
  642.                                 {% endfor %}
  643.                             </div>
  645.                             <div class="show-on-change">
  646.                                 <div class="title">
  647.                                     <p>形を選ぶ</p>
  648.                                 </div>
  649.                                 <div class="group-checkbox v2">
  650.                                     {% for category in categories %}
  651.                                         {% if category.getParent() %}
  652.                                             {% if category.getParent().id == "51" %}
  653.                                                  <div class="group">
  654.                                                     <input type="checkbox" name="shape[]" value="{{ category.id }}">
  655.                                                     <img src="{{ asset('assets/img/top') }}/img-check-{{category.id}}.jpg" alt="">
  656.                                                     <p>{{ category.name | trans }}</p>
  657.                                                 </div>
  658.                                             {% endif %}
  659.                                         {% endif %}
  660.                                     {% endfor %}
  661.                                 </div>
  662.                             </div>
  664.                             <div class="button">
  665.                                 <button type="submit" class="btn">
  666.                                     <span>エアコンを探す</span>
  667.                                 </button>
  668.                             </div>
  669.                         </div>
  670.                     </div>
  671.                 </div>
  672.             </form>
  674.             <div class="message">
  675.                 <div class="mess">
  676.                     <p>業務用エアコンの点検をしないと罰則の対象になることもあるよ。エアココなら取り付けや交換だけじゃなくて、業務用エアコンの点検もおまかせ！</p>
  677.                 </div>
  678.                 <img src="{{ asset('assets/img/common/panda-read_book.png') }}" alt="">
  679.             </div>
  680.         </div>
  681.     </div> #}
  683.     {# {% set constructions = CustomizeTopColumn(null, 5) %}
  684.     {% if constructions|length > 0 %}
  685.         <div class="ec-conStruction">
  686.             <div class="ec-conStruction__inner">
  687.                 <div class="ec-conStruction__title">
  688.                     <p>工事実績</p>
  689.                 </div>
  690.                 <div class="ec-conStruction__list">
  691.                     {% for blog in constructions %}
  692.                         <a href="{{ url('cm_blog_pro_page_detail', {'id': blog.slug ? blog.slug : blog.id}) }}" class="item slick-slide ec-conStruction__item">
  693.                             {% if blog.getMainListImage %}
  694.                                 <img src="{{ asset(blog.getMainListImage|no_image_product, 'save_image') }}">
  695.                             {% else %}
  696.                                 <img src="{{ asset(''|no_image_product, 'save_image') }}" class='item_blog_image'>
  697.                             {% endif %}
  698.                             <div class="title">
  699.                                 <p>{{ blog.getTitle|length > 45 ? blog.getTitle|striptags|replace({('&nbsp;'):' '})|slice(0, 45)|raw ~ '...' : blog.getTitle|raw }}</p>
  700.                             </div>
  701.                             <div class="group">
  702.                                 <div class="date"><span>{{blog.release_date|date('Y.m.d')}}</span></div>
  703.                                 <div class="user">
  704.                                     {% for category in blog.getBlogCategories %}
  705.                                         <span>{{ category.getCategory.getName|raw }}</span>
  706.                                     {% endfor %}
  707.                                 </div>
  708.                             </div>
  709.                         </a>
  710.                     {% endfor %}
  711.                 </div>
  713.                 <div class="ec-conStruction__btn">
  714.                     <a href="{{ url('results') }}" class="btn"><span>工事実績をもっと見る</span></a>
  715.                     <a href="{{ url('user_data', {'route': 'workplace'}) }}" class="btn"><span>工事の詳細を見る</span></a>
  716.                 </div>
  718.                 <div class="list-service">
  719.                     <div class="service">
  720.                         <div class="group">
  721.                             <div class="title">
  722.                                 <p>業務用 エアコンクリーニング</p>
  723.                             </div>
  724.                             <img class="sp" src="{{ asset('assets/img/common/kuma-student.png') }}" alt="">
  725.                             <div class="text">
  726.                                 <p>近日公開予定</p>
  727.                             </div>
  728.                             <a href="{{ url('user_data', {'route': 'cleaning-workplace'}) }}" class="btn hidden">
  729.                                 <span>詳細はこちら</span>
  730.                             </a>
  731.                         </div>
  732.                         <img class="pc" src="{{ asset('assets/img/common/kuma-student.png') }}" alt="">
  733.                     </div>
  734.                     <span></span>
  735.                     <div class="service">
  736.                         <div class="group">
  737.                             <div class="title">
  738.                                 <p>業務用 エアコン工事</p>
  739.                             </div>
  740.                             <img class="sp" src="{{ asset('assets/img/common/panda-healthcare_staff.png') }}" alt="">
  741.                             <div class="text">
  742.                                 <p>エアコン設置の穴あけ、拡張工事はアスベスト含有の事前調査が必要になりました。調査や取り付け、交換も電気工事のプロが責任を持って対応します。</p>
  743.                             </div>
  744.                             <a href="{{ url('user_data', {'route': 'construction-workplace'}) }}" class="btn">
  745.                                 <span>詳細はこちら</span>
  746.                             </a>
  747.                         </div>
  748.                         <img class="pc" src="{{ asset('assets/img/common/panda-healthcare_staff.png') }}" alt="">
  749.                     </div>
  750.                 </div>
  751.             </div>
  752.         </div>
  753.     {% endif %} #}
  755. {% endblock %}
  756.