app/template/airconwork/index.twig line 36

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="ja" prefix="og: http://ogp.me/ns#">
  3. <head>
  4.   <meta charset="utf-8" />
  5.   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6.   <meta name="format-detection" content="telephone=no" />
  7.   <meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
  8.   <link rel="shortcut icon" href="{{ asset('assets/img/favicon.ico') }}" />
  9.   <title>業務用エアコン専門店　エアコンワーク</title>
  10.   <meta name="description" content="{{ Page.description }}">
  11.     {# Layout: HEAD #}
  12.     {% if Layout.Head %}
  13.         {{ include('block.twig', {'Blocks': Layout.Head}) }}
  14.     {% endif %}
  15.     {# プラグイン用styleseetやmetatagなど #}
  16.     {% if plugin_assets is defined %}{{ include('@admin/snippet.twig', { snippets: plugin_assets }) }}{% endif %}
  17. </head>
  18. <body id="page_{{ app.request.get('_route') }}" class="{{ body_class|default('other_page') }}">
  19. {# Layout: BODY_AFTER #}
  20. {% if Layout.BodyAfter %}
  21.     {{ include('block.twig', {'Blocks': Layout.BodyAfter}) }}
  22. {% endif %}
  23. {% if isMaintenance %}
  24. <!--
  25.     <div class="ec-maintenanceAlert">
  26.         <div>
  27.             {{ 'メンテナンスモードが有効になっています。'|trans }}
  28.         </div>
  29.     </div>
  30. -->
  31. {% endif %}
  32.   <div class="l-wrapper">
  33.     {# Layout: HEADER #}
  34.     {% if Layout.Header %}
  35.         <header class="l-header">
  36.             {{ include('block.twig', {'Blocks': Layout.Header}) }}
  37.         </header>
  38.     {% endif %}
  39.     <main class="l-main">
  40.       <div class="p-top-hero">
  41.         <div class="p-top-kv">
  42.           <div class="p-top-kv__inner p-top-kv__container">
  43.             <div class="swiper-container slider1 swiper-loading">
  44.               <div class="swiper-wrapper">
  45.                 <div class="swiper-slide">
  46.                   <picture>
  47.                     <source srcset="{{ asset('assets/img/top/img_kv_01_sp.jpg') }}" media="(max-width: 750px)"><!-- SP -->
  48.                     <img src="{{ asset('assets/img/top/img_kv_01.jpg') }}" alt="当社だけの専任担当制-空調のスペシャリストにお任せください-" width="750" height="480">
  49.                   </picture>
  50.                 </div>
  51.                 <div class="swiper-slide">
  52.                   <picture>
  53.                     <source srcset="{{ asset('assets/img/top/img_kv_02_sp.jpg') }}" media="(max-width: 750px)"><!-- SP -->
  54.                     <img src="{{ asset('assets/img/top/img_kv_02.jpg') }}" alt="業務用エアコン設置後のサポートもしっかりサポート専用窓口-安心してご依頼ください-" width="750" height="480">
  55.                   </picture>
  56.                 </div>
  57.                 <div class="swiper-slide">
  58.                   <picture>
  59.                     <source srcset="{{ asset('assets/img/top/img_kv_03_sp.jpg') }}" media="(max-width: 750px)"><!-- SP -->
  60.                     <img src="{{ asset('assets/img/top/img_kv_03.jpg') }}" alt="納得の適正価格-本体処分も、フロン回収処分も、工事保証も全部込み！！-" width="750" height="480">
  61.                   </picture>
  62.                 </div>
  63.               </div>
  64.               <div class="swiper-pagination slider-ranking-pagination"></div>
  65.               <div class="swiper-button-prev"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 27 44" class="swiper-button-prev-a">
  66.                   <path class="swiper-arrow arrow-left" d="M0,22L22,0l2.1,2.1L4.2,22l19.9,19.9L22,44L0,22L0,22L0,22z" />
  67.                 </svg>
  68.               </div>
  69.               <div class="swiper-button-next"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 27 44" class="swiper-button-next-a">
  70.                   <path class="swiper-arrow arrow-right" d="M27,22L27,22L5,44l-2.1-2.1L22.8,22L2.9,2.1L5,0L27,22L27,22z" />
  71.                 </svg>
  72.               </div>
  73.             </div>
  74.             <div class="swiper-loading-makeshift">
  75.               <img src="{{ asset('assets/img/top/img_kv_01.jpg') }}" alt="当社だけの専任担当制-空調のスペシャリストにお任せください-" width="1100" height="380">
  76.             </div>
  77.           </div>
  78.         </div>
  79.       </div>
  80.       <section class="p-top-point c-section pb-0">
  81.         <div class="c-inner">
  82.           <h2 class="c-title-01">
  83.           <span class="s-text">
  84.           当社が選ばれる理由
  85.           </span>
  86.           </h2>
  87.           <ul class="c-grid col5 p-top-point__list">
  88.             <li>
  89.               <div class="c-card-01">
  90.                 <i class="c-card-01__icon"><svg class="s-01">
  91.                     <use xlink:href="{{ asset('assets/img/ico/ico_free.svg#obj') }}"></use>
  92.                   </svg></i>
  93.                 <h3 class="c-card-01__title">無料0円</h3>
  94.                 <p class="c-card-01__text">現場調査</p>
  95.               </div>
  96.             </li>
  97.             <li>
  98.               <div class="c-card-01">
  99.                 <i class="c-card-01__icon"><svg class="s-02">
  100.                     <use xlink:href="{{ asset('assets/img/ico/ico_hosyou.svg#obj') }}"></use>
  101.                   </svg></i>
  102.                 <h3 class="c-card-01__title">10年</h3>
  103.                 <p class="c-card-01__text">ツイン保証</p>
  104.               </div>
  105.             </li>
  106.             <li>
  107.               <div class="c-card-01">
  108.                 <i class="c-card-01__icon"><svg class="s-03">
  109.                     <use xlink:href="{{ asset('assets/img/ico/ico_mitsumori.svg#obj') }}"></use>
  110.                   </svg></i>
  111.                 <h3 class="c-card-01__title">追加請求<br class="no-pc">なし</h3>
  112.                 <p class="c-card-01__text">安心価格</p>
  113.               </div>
  114.             </li>
  115.             <li>
  116.               <div class="c-card-01">
  117.                 <i class="c-card-01__icon"><svg class="s-04">
  118.                     <use xlink:href="{{ asset('assets/img/ico/ico_hand.svg#obj') }}"></use>
  119.                   </svg></i>
  120.                 <h3 class="c-card-01__title">空調の<br class="no-pc">スペシャリスト</h3>
  121.                 <p class="c-card-01__text">専任担当が<br class="only-sp">すべて対応</p>
  122.               </div>
  123.             </li>
  124.             <li>
  125.               <div class="c-card-01">
  126.                 <i class="c-card-01__icon"><svg class="s-05">
  127.                     <use xlink:href="{{ asset('assets/img/ico/ico_card.svg#obj') }}"></use>
  128.                   </svg></i>
  129.                 <h3 class="c-card-01__title">リース･<br class="no-pc">ローンOK</h3>
  130.                 <p class="c-card-01__text">選べるお支払方法</p>
  131.               </div>
  132.             </li>
  133.           </ul>
  135.         </div>
  136.       </section>
  137.       <section class="p-top-products c-section">
  138.         <div class="c-inner">
  139.           <h2 class="c-title-02">
  140.                     <span class="s-text">
  141.                      業務用エアコン 機器カテゴリー</span>
  142.           </h2>
  143.           <ul class="c-grid col5 p-top-products__cat">
  144.             <li>
  145.               <a href="/products/list?category_ids[]=52&category_id=52" class="c-card-02">
  146.                 <div class="c-card-02__thum s-01"><img src="{{ asset('assets/img/common/img_pro_52.png') }}" alt="業務用エアコン　天井カセット4方向" width="335" height="209"></div>
  147.                 <p class="c-card-02__link">
  148.                   <span class="s-text">天井カセット<br class="no-pc">4方向</span>
  149.                   <i class="s-icon">
  150.                     <svg>
  151.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  152.                     </svg>
  153.                   </i>
  154.                 </p>
  155.               </a>
  156.             </li>
  157.             <li>
  158.               <a href="/products/list?category_ids[]=53&category_id=53" class="c-card-02">
  159.                 <div class="c-card-02__thum s-02"><img src="{{ asset('assets/img/common/img_pro_53.png') }}" alt="業務用エアコン　天井カセット2方向" width="915" height="568"></div>
  160.                 <p class="c-card-02__link">
  161.                   <span class="s-text">天井カセット<br class="no-pc">2方向</span>
  162.                   <i class="s-icon">
  163.                     <svg>
  164.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  165.                     </svg>
  166.                   </i>
  167.                 </p>
  168.               </a>
  169.             </li>
  170.             <li>
  171.               <a href="/products/list?category_ids[]=54&category_id=54" class="c-card-02">
  172.                 <div class="c-card-02__thum s-03"><img src="{{ asset('assets/img/common/img_pro_54.png') }}" alt="業務用エアコン　天井カセット1方向" width="783" height="402"></div>
  173.                 <p class="c-card-02__link">
  174.                   <span class="s-text">天井カセット<br class="no-pc">1方向</span>
  175.                   <i class="s-icon">
  176.                     <svg>
  177.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  178.                     </svg>
  179.                   </i>
  180.                 </p>
  181.               </a>
  182.             </li>
  183.             <li>
  184.               <a href="/products/list?category_ids[]=58&category_id=58" class="c-card-02">
  185.                 <div class="c-card-02__thum s-04"><img src="{{ asset('assets/img/common/img_pro_58.png') }}" alt="業務用エアコン　天井吊り形" width="358" height="133"></div>
  186.                 <p class="c-card-02__link">
  187.                   <span class="s-text">天井吊り形</span>
  188.                   <i class="s-icon">
  189.                     <svg>
  190.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  191.                     </svg>
  192.                   </i>
  193.                 </p>
  194.               </a>
  195.             </li>
  196.             <li>
  197.               <a href="/products/list?category_ids[]=59&category_id=59" class="c-card-02">
  198.                 <div class="c-card-02__thum s-05"><img src="{{ asset('assets/img/common/img_pro_59.png') }}" alt="業務用エアコン　壁掛け形" width="480" height="133"></div>
  199.                 <p class="c-card-02__link">
  200.                   <span class="s-text">壁掛け形</span>
  201.                   <i class="s-icon">
  202.                     <svg>
  203.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  204.                     </svg>
  205.                   </i>
  206.                 </p>
  207.               </a>
  208.             </li>
  209.             <li>
  210.               <a href="/products/list?category_ids[]=60&category_id=60" class="c-card-02">
  211.                 <div class="c-card-02__thum s-06"><img src="{{ asset('assets/img/common/img_pro_60.png') }}" alt="業務用エアコン　床置き形" width="936" height="2776"></div>
  212.                 <p class="c-card-02__link">
  213.                   <span class="s-text">床置き形</span>
  214.                   <i class="s-icon">
  215.                     <svg>
  216.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  217.                     </svg>
  218.                   </i>
  219.                 </p>
  220.               </a>
  221.             </li>
  222.             <li>
  223.               <a href="/products/list?category_ids[]=56&category_id=56" class="c-card-02">
  224.                 <div class="c-card-02__thum s-07"><img src="{{ asset('assets/img/common/img_pro_56.png') }}" alt="業務用エアコン　ビルトイン形" width="516" height="147"></div>
  225.                 <p class="c-card-02__link">
  226.                   <span class="s-text">ビルトイン形</span>
  227.                   <i class="s-icon">
  228.                     <svg>
  229.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  230.                     </svg>
  231.                   </i>
  232.                 </p>
  233.               </a>
  234.             </li>
  235.             <li>
  236.               <a href="/products/list?category_ids[]=57&category_id=57" class="c-card-02">
  237.                 <div class="c-card-02__thum s-08"><img src="{{ asset('assets/img/common/img_pro_57.png') }}" alt="業務用エアコン　ダクト形" width="725" height="257"></div>
  238.                 <p class="c-card-02__link">
  239.                   <span class="s-text">ダクト形</span>
  240.                   <i class="s-icon">
  241.                     <svg>
  242.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  243.                     </svg>
  244.                   </i>
  245.                 </p>
  246.               </a>
  247.             </li>
  248.             <li>
  249.               <a href="/products/list?category_ids[]=55&category_id=55" class="c-card-02">
  250.                 <div class="c-card-02__thum s-09"><img src="{{ asset('assets/img/common/img_pro_55.png') }}" alt="業務用エアコン　天井吊り形4方向" width="942" height="477"></div>
  251.                 <p class="c-card-02__link">
  252.                   <span class="s-text">天井吊り形<br class="no-pc">4方向</span>
  253.                   <i class="s-icon">
  254.                     <svg>
  255.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  256.                     </svg>
  257.                   </i>
  258.                 </p>
  259.               </a>
  260.             </li>
  261.             <li>
  262.               <a href="/products/list?category_ids[]=132&category_id=132" class="c-card-02">
  263.                 <div class="c-card-02__thum s-10"><img src="{{ asset('assets/img/common/img_pro_132.png') }}" alt="業務用エアコン　厨房用" width="2085" height="1260"></div>
  264.                 <p class="c-card-02__link">
  265.                   <span class="s-text">厨房用</span>
  266.                   <i class="s-icon">
  267.                     <svg>
  268.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  269.                     </svg>
  270.                   </i>
  271.                 </p>
  272.               </a>
  273.             </li>
  274.           </ul>
  275.           <h3 class="c-title-04">メーカーから選ぶ</h3>
  276.           <ul class="c-grid col5 p-top-products__maker">
  277.             <li>
  278.               <a href="/products/list?category_ids[]=2&category_id=2" class="c-card-03">
  279.                 <div class="c-card-03__thum">
  280.                   <img src="{{ asset('assets/img/common/img_logo_daikin.png') }}" alt="ダイキンロゴ" width="211" height="47">
  281.                 </div>
  282.                 <p class="c-link-02"><i class="s-icon">
  283.                     <svg>
  284.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  285.                     </svg>
  286.                   </i><span class="s-text">ダイキン</span></p>
  287.               </a>
  288.             </li>
  289.             <li>
  290.               <a href="/products/list?category_ids[]=31" class="c-card-03">
  291.                 <div class="c-card-03__thum">
  292.                   <img src="{{ asset('assets/img/common/img_logo_mitsubishi.png') }}" alt="三菱電機ロゴ" width="211" height="47">
  293.                 </div>
  294.                 <p class="c-link-02"><i class="s-icon">
  295.                     <svg>
  296.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  297.                     </svg>
  298.                   </i><span class="s-text">三菱電機</span></p>
  299.               </a>
  300.             </li>
  301.             <li>
  302.               <a href="/products/list?category_ids[]=21" class="c-card-03">
  303.                 <div class="c-card-03__thum">
  304.                   <img src="{{ asset('assets/img/common/img_logo_hitachi.png') }}" alt="日立ロゴ" width="211" height="47">
  305.                 </div>
  306.                 <p class="c-link-02"><i class="s-icon">
  307.                     <svg>
  308.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  309.                     </svg>
  310.                   </i><span class="s-text">日立</span></p>
  311.               </a>
  312.             </li>
  313.             <li>
  314.               <a href="/products/list?category_ids[]=11" class="c-card-03">
  315.                 <div class="c-card-03__thum">
  316.                   <img src="{{ asset('assets/img/common/img_logo_toshiba.png') }}" alt="東芝ロゴ" width="211" height="47">
  317.                 </div>
  318.                 <p class="c-link-02"><i class="s-icon">
  319.                     <svg>
  320.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  321.                     </svg>
  322.                   </i><span class="s-text">東芝</span></p>
  323.               </a>
  324.             </li>
  325.             <li>
  326.               <a href="/products/list?category_ids[]=41" class="c-card-03">
  327.                 <div class="c-card-03__thum">
  328.                   <img src="{{ asset('assets/img/common/img_logo_panasonic.png') }}" alt="パナソニックロゴ" width="211" height="47">
  329.                 </div>
  330.                 <p class="c-link-02"><i class="s-icon">
  331.                     <svg>
  332.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  333.                     </svg>
  334.                   </i><span class="s-text">パナソニック</span></p>
  335.               </a>
  336.             </li>
  337.           </ul>
  338.         </div>
  339.       </section>
  341.       <section class="p-top-voice c-section">
  342.         <div class="c-inner">
  343.           <h2 class="c-title-02">
  344.                     <span class="s-text">業務用エアコン 工事実績</span>
  345.           </h2>
  346.           <ul class="c-grid col5 p-top-voice__menu">
  347.           {{ include('Block/new_voice_top.twig') }}
  348.           </ul>
  349.           <div class="block-center">
  350.             <a href="{{ url('voice') }}" class="c-btn-01"><span class="s-text">工事実績一覧を見る</span>
  351.               <i class="s-icon">
  352.                 <svg>
  353.                   <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  354.                 </svg>
  355.               </i></a>
  356.           </div>
  357.         </div>
  358.       </section>
  360.       <section class="p-top-service c-section">
  361.         <div class="c-inner">
  362.           <h2 class="c-title-02">
  363.                     <span class="s-text">業務用エアコン サービスのご案内</span>
  364.           </h2>
  365.           <ul class="c-grid col5 p-top-service__menu">
  366.             <li class="c-img-zoom">
  367.               <a href="{{ url('investigation') }}" class="c-card-05">
  368.                 <div class="c-card-05__thum">
  369.                   <i class="s-icon">
  370.                     <svg class="s-01">
  371.                       <use xlink:href="{{ asset('assets/img/ico/ico_free.svg#obj') }}"></use>
  372.                     </svg>
  373.                   </i>
  374.                   <figure class="s-img"><img src="{{ asset('assets/img/top/img_service_01.png') }}" alt="業務用エアコン無料現場調査イメージ画" width="750" height="498"></figure>
  375.                 </div>
  376.                 <p class="c-card-05__link">
  377.                   <span class="s-text">無料現場調査</span>
  378.                   <i class="s-icon">
  379.                     <svg>
  380.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  381.                     </svg>
  382.                   </i>
  383.                 </p>
  384.               </a>
  385.             </li>
  386.             <li class="c-img-zoom">
  387.               <a href="{{ url('manager') }}" class="c-card-05">
  388.                 <div class="c-card-05__thum">
  389.                   <i class="s-icon">
  390.                     <svg class="s-02">
  391.                       <use xlink:href="{{ asset('assets/img/ico/ico_hand.svg#obj') }}"></use>
  392.                     </svg>
  393.                   </i>
  394.                   <figure class="s-img"><img src="{{ asset('assets/img/top/img_service_02.png') }}" alt="専任担当制イメージ画" width="750" height="498"></figure>
  395.                 </div>
  396.                 <p class="c-card-05__link">
  397.                   <span class="s-text">専任担当制</span>
  398.                   <i class="s-icon">
  399.                     <svg>
  400.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  401.                     </svg>
  402.                   </i>
  403.                 </p>
  404.               </a>
  405.             </li>
  406.             <li class="c-img-zoom">
  407.               <a href="{{ url('guarantee') }}" class="c-card-05">
  408.                 <div class="c-card-05__thum">
  409.                   <i class="s-icon">
  410.                     <svg class="s-03">
  411.                       <use xlink:href="{{ asset('assets/img/ico/ico_hosyou.svg#obj') }}"></use>
  412.                     </svg>
  413.                   </i>
  414.                   <figure class="s-img"><img src="{{ asset('assets/img/top/img_service_03.png') }}" alt="業務用エアコン10年ツイン保証イメージ画" width="750" height="498"></figure>
  415.                 </div>
  416.                 <p class="c-card-05__link">
  417.                   <span class="s-text">10年ツイン保証</span>
  418.                   <i class="s-icon">
  419.                     <svg>
  420.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  421.                     </svg>
  422.                   </i>
  423.                 </p>
  424.               </a>
  425.             </li>
  426.             <li class="c-img-zoom">
  427.               <a href="{{ url('price') }}" class="c-card-05">
  428.                 <div class="c-card-05__thum">
  429.                   <i class="s-icon">
  430.                     <svg class="s-05">
  431.                       <use xlink:href="{{ asset('assets/img/ico/ico_mitsumori.svg#obj') }}"></use>
  432.                     </svg>
  433.                   </i>
  434.                   <figure class="s-img"><img src="{{ asset('assets/img/top/img_service_04.png') }}" alt="業務用エアコン工事標準価格表イメージ画" width="750" height="498"></figure>
  435.                 </div>
  436.                 <p class="c-card-05__link">
  437.                   <span class="s-text">工事標準価格表</span>
  438.                   <i class="s-icon">
  439.                     <svg>
  440.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  441.                     </svg>
  442.                   </i>
  443.                 </p>
  444.               </a>
  445.             </li>
  446.             <li class="c-img-zoom">
  447.               <a href="{{ url('flow') }}" class="c-card-05">
  448.                 <div class="c-card-05__thum">
  449.                   <i class="s-icon">
  450.                     <svg class="s-01">
  451.                       <use xlink:href="{{ asset('assets/img/ico/ico_pc.svg#obj') }}"></use>
  452.                     </svg>
  453.                   </i>
  454.                   <figure class="s-img"><img src="{{ asset('assets/img/top/img_service_05.png') }}" alt="業務用エアコン設置までの流れイメージ画" width="750" height="498"></figure>
  455.                 </div>
  456.                 <p class="c-card-05__link">
  457.                   <span class="s-text">設置までの流れ</span>
  458.                   <i class="s-icon">
  459.                     <svg>
  460.                       <use xlink:href="{{ asset('assets/img/ico/ico_arrow_forward.svg#obj') }}"></use>
  461.                     </svg>
  462.                   </i>
  463.                 </p>
  464.               </a>
  465.             </li>
  466.           </ul>
  467.         </div>
  468.       </section>
  471.       <div class="p-top-article">
  472.         <div class="c-inner">
  473.           <section class="p-top-useful">
  474.             <h2 class="c-title-03">
  475.                   <i class="s-icon">
  476.                   <svg>
  477.                     <use xlink:href="{{ asset('assets/img/ico/ico_note.svg#obj') }}"></use>
  478.                   </svg>
  479.                 </i><span class="s-text">お役立ち情報</span>
  480.               </h2>
  481.             {{ TabaCMSWidget('list',{type_data_key:'blog'})|raw }}
  482.           </section>
  483.           <section class="p-top-news">
  484.             <h2 class="c-title-03">
  485.             <i class="s-icon">
  486.             <svg>
  487.               <use xlink:href="{{ asset('assets/img/ico/ico_info.svg#obj') }}"></use>
  488.             </svg>
  489.           </i><span class="s-text">お知らせ</span>
  490.         </h2>
  491.           {{ TabaCMSWidget('list',{type_data_key:'news'})|raw }}
  492.           </section>
  493.         </div>
  494.       </div>
  495.     </main>
  496.     {# Layout: CONTENTS_FOOTER #}
  497.     {% if Layout.Footer %}
  498.         <footer class="l-footer">
  499.             {{ include('block.twig', {'Blocks': Layout.Footer}) }}
  500.         </footer>
  501.     {% endif %}
  502.   </div>
  503.   {% if Layout.CloseBodyBefore %}
  504.     {{ include('block.twig', {'Blocks': Layout.CloseBodyBefore}) }}
  505.   {% endif %}
  507.   <script>
  508.     window.addEventListener('load', function () {
  509.       // メインビジュアル
  510.       var slider1 = new Swiper('.slider1', {
  511.         loop: true,
  512.         loopAdditionalSlides: 1,
  513.         centeredSlides: true,
  514.         spaceBetween: 20,
  515.         speed: 1000,
  516.         autoplaydisableOnInteraction: false,
  517.         slidesPerView: 'auto',
  518.         loop: true, // スライドの無限ループ
  519.         autoplay: { // スライドの自動再生
  520.           delay: 4000, // スライド間の遷移の遅延を設定 (ミリ秒設定） 1000ミリ秒=1秒
  521.         },
  522.         navigation: {
  523.           nextEl: '.slider1 .swiper-button-next',
  524.           prevEl: '.slider1 .swiper-button-prev',
  525.         },
  526.         on: {
  527.           imagesReady: function () {
  528.             this.el.classList.remove('swiper-loading');
  529.           }
  530.         }
  531.       });
  532.     }, false);
  533.   </script>
  534. </body>
  535. </html>