app/template/default/Guide/flow.twig line 1

Open in your IDE?
  1. {#
  2.     This file is part of EC-CUBE
  3.     
  4.     Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
  5.     
  6.     http://www.ec-cube.co.jp/
  7.     
  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' %}
  12.     
  13.     {% block stylesheet %}
  14.         <link rel="stylesheet" href="{{ asset('assets/css/guide.css') }}">
  15.     {% endblock %}
  16.     
  17.     {% block main %}
  18.         {% set iconCustomer = '<svg width="48" height="65" viewBox="0 0 48 65" fill="none" xmlns="http://www.w3.org/2000/svg">
  19.                                     <rect y="0.23999" width="48" height="64" rx="4" fill="#C5A600"/>
  20.                                     <path d="M24.2497 23.74C25.6341 23.74 26.9875 23.3294 28.1387 22.5603C29.2898 21.7911 30.187 20.6979 30.7168 19.4188C31.2466 18.1397 31.3853 16.7322 31.1152 15.3744C30.8451 14.0165 30.1784 12.7692 29.1994 11.7902C28.2204 10.8113 26.9732 10.1446 25.6153 9.8745C24.2574 9.6044 22.85 9.74302 21.5709 10.2728C20.2918 10.8026 19.1985 11.6999 18.4294 12.851C17.6602 14.0021 17.2497 15.3555 17.2497 16.74C17.2495 17.6593 17.4304 18.5696 17.7821 19.419C18.1339 20.2683 18.6495 21.0401 19.2995 21.6901C19.9496 22.3402 20.7213 22.8558 21.5707 23.2075C22.42 23.5592 23.3304 23.7402 24.2497 23.74ZM29.1495 25.4903H28.2362C26.9863 26.0668 25.6262 26.3653 24.2497 26.3653C22.8732 26.3653 21.513 26.0668 20.2631 25.4903H19.3498C17.4005 25.4903 15.5311 26.2647 14.1527 27.643C12.7744 29.0214 12 30.8908 12 32.8401L12 35.1145C12 35.8108 12.2766 36.4786 12.769 36.971C13.2614 37.4634 13.9292 37.74 14.6255 37.74H33.8738C34.5701 37.74 35.2379 37.4634 35.7303 36.971C36.2227 36.4786 36.4993 35.8108 36.4993 35.1145V32.8388C36.4993 30.8895 35.725 29.02 34.3466 27.6417C32.9683 26.2633 31.0988 25.4903 29.1495 25.4903Z" fill="white"/>
  21.                                     <path d="M11.232 45.996C11.184 46.224 11.136 46.74 11.124 47.04C11.064 47.988 11.028 49.284 11.028 50.4C11.028 51.708 11.1 53.784 11.1 54.48C11.1 55.956 10.572 56.364 9.78 56.364C8.616 56.364 6.96 55.356 6.96 54.084C6.96 52.92 8.46 51.696 10.128 51.108C11.196 50.724 12.408 50.532 13.32 50.532C15.168 50.532 16.632 51.492 16.632 53.148C16.632 54.576 15.888 55.644 13.98 56.112C13.428 56.232 12.888 56.268 12.396 56.316L11.856 54.756C12.384 54.756 12.912 54.756 13.32 54.672C14.292 54.504 15.072 54.012 15.072 53.148C15.072 52.32 14.352 51.852 13.308 51.852C12.288 51.852 11.232 52.068 10.296 52.44C9.216 52.848 8.448 53.496 8.448 54.012C8.448 54.396 9.012 54.72 9.324 54.72C9.54 54.72 9.696 54.624 9.696 54.204C9.696 53.58 9.636 51.912 9.636 50.46C9.636 49.092 9.648 47.604 9.648 47.052C9.648 46.812 9.612 46.212 9.576 45.996H11.232ZM14.652 47.304C15.564 47.748 16.956 48.528 17.604 48.984L16.872 50.208C16.296 49.728 14.736 48.828 13.992 48.468L14.652 47.304ZM7.284 47.964C7.992 48.048 8.508 48.048 8.94 48.048C10.188 48.048 12.06 47.82 13.296 47.46L13.332 48.948C11.976 49.26 10.044 49.476 8.988 49.476C8.196 49.476 7.728 49.464 7.32 49.416L7.284 47.964ZM22.464 47.808L24 48.108C23.088 49.404 21.864 50.484 20.016 51.336C19.824 51 19.38 50.496 19.068 50.268C20.76 49.62 21.864 48.708 22.464 47.808ZM22.8 48.612H26.388V49.692H21.816L22.8 48.612ZM25.956 48.612H26.232L26.472 48.552L27.444 49.128C25.86 51.78 22.464 53.22 19.008 53.892C18.876 53.52 18.576 52.932 18.324 52.62C21.54 52.128 24.756 50.832 25.956 48.816V48.612ZM22.224 49.428C23.616 50.988 26.412 51.948 29.652 52.26C29.328 52.596 28.932 53.244 28.728 53.652C25.428 53.196 22.692 52.02 20.976 49.98L22.224 49.428ZM20.604 53.064H27.504V56.796H26.028V54.24H22.008V56.82H20.604V53.064ZM21.312 55.272H26.748V56.448H21.312V55.272ZM23.22 45.564H24.708V47.268H23.22V45.564ZM18.828 46.536H29.172V49.188H27.696V47.832H20.232V49.188H18.828V46.536ZM34.764 46.884H41.352V48.024H34.764V46.884ZM35.088 48.492H41.1V49.572H35.088V48.492ZM34.536 50.088H41.568V51.264H34.536V50.088ZM39.384 45.528L40.812 45.876C40.488 46.416 40.164 46.944 39.924 47.292L38.796 46.968C39.012 46.548 39.264 45.948 39.384 45.528ZM35.532 45.948L36.66 45.576C36.936 45.984 37.236 46.536 37.344 46.908L36.144 47.34C36.048 46.968 35.784 46.38 35.532 45.948ZM40.428 51.492L41.508 52.26C40.98 52.812 40.344 53.4 39.864 53.784L38.94 53.076C39.408 52.68 40.056 51.996 40.428 51.492ZM34.764 52.176L35.748 51.528C36.18 51.972 36.708 52.584 36.948 53.004L35.916 53.724C35.7 53.292 35.196 52.644 34.764 52.176ZM34.068 54.888C34.788 54.564 35.844 54.024 36.876 53.496L37.248 54.66C36.408 55.152 35.46 55.68 34.692 56.1L34.068 54.888ZM37.368 47.652H38.748V55.392C38.748 56.04 38.64 56.388 38.256 56.604C37.86 56.82 37.284 56.844 36.528 56.844C36.492 56.472 36.324 55.908 36.156 55.572C36.564 55.584 37.032 55.584 37.176 55.584C37.32 55.584 37.368 55.524 37.368 55.392V47.652ZM38.676 51.492C39.204 53.1 40.26 54.48 41.796 55.104C41.508 55.368 41.088 55.896 40.884 56.268C39.324 55.404 38.304 53.724 37.74 51.708L38.676 51.492ZM30.528 48.036H34.5V49.368H30.528V48.036ZM31.992 45.552H33.3V56.82H31.992V45.552ZM31.968 48.948L32.772 49.224C32.424 51.12 31.74 53.436 30.888 54.672C30.768 54.288 30.456 53.736 30.252 53.4C31.02 52.356 31.692 50.472 31.968 48.948ZM33.24 49.824C33.504 50.148 34.488 51.66 34.692 51.996L33.948 53.028C33.684 52.332 32.964 50.964 32.64 50.4L33.24 49.824Z" fill="white"/>
  22.                                 </svg>' %}
  23.         {% set iconStore = '<svg width="48" height="65" viewBox="0 0 48 65" fill="none" xmlns="http://www.w3.org/2000/svg">
  24.                                 <rect x="1" y="1.23999" width="46" height="62" rx="3" fill="white"/>
  25.                                 <rect x="1" y="1.23999" width="46" height="62" rx="3" stroke="#C5A600" stroke-width="2"/>
  26.                                 <path d="M40.2504 18.0345L38.0004 11.0349C37.9222 10.7934 37.7698 10.5851 37.5667 10.4419C37.3635 10.2987 37.1208 10.2283 36.8754 10.2416H12.1254C11.8801 10.2283 11.6373 10.2987 11.4342 10.4419C11.2311 10.5851 11.0787 10.7934 11.0004 11.0349L8.75044 18.0345C8.73423 18.1583 8.73423 18.2839 8.75044 18.4078V25.4074C8.75044 25.7168 8.86896 26.0135 9.07994 26.2323C9.29092 26.4511 9.57707 26.574 9.87544 26.574H11.0004V38.24H13.2504V26.574H20.0004V38.24H38.0004V26.574H39.1254C39.4238 26.574 39.71 26.4511 39.9209 26.2323C40.1319 26.0135 40.2504 25.7168 40.2504 25.4074V18.4078C40.2666 18.2839 40.2666 18.1583 40.2504 18.0345ZM35.7504 35.9068H22.2504V26.574H35.7504V35.9068ZM38.0004 24.2408H33.5004V19.5744H31.2504V24.2408H25.6254V19.5744H23.3754V24.2408H17.7504V19.5744H15.5004V24.2408H11.0004V18.5944L12.9354 12.5748H36.0654L38.0004 18.5944V24.2408Z" fill="#C5A600"/>
  27.                                 <path d="M15.696 45.552H17.292V50.472H15.696V45.552ZM11.76 46.536L13.08 46.02C13.704 46.86 14.304 47.976 14.556 48.732L13.164 49.332C12.948 48.552 12.348 47.388 11.76 46.536ZM19.728 45.912L21.336 46.38C20.82 47.46 20.184 48.612 19.68 49.368L18.396 48.924C18.876 48.108 19.44 46.86 19.728 45.912ZM12.048 49.716H21.132V56.82H19.596V51.156H12.048V49.716ZM12.456 52.26H20.148V53.652H12.456V52.26ZM11.772 54.888H20.4V56.328H11.772V54.888ZM32.2806 49.632H36.8166V50.904H32.2806V49.632ZM29.7126 55.116H35.3526V56.388H29.7126V55.116ZM31.5966 48.504H33.0606V52.956H31.5966V48.504ZM28.9566 52.212H36.1206V56.808H34.6446V53.484H30.3606V56.82H28.9566V52.212ZM31.1046 45.552H32.6046V47.736H31.1046V45.552ZM27.5046 46.956H36.9846V48.324H27.5046V46.956ZM26.7966 46.956H28.2366V49.992C28.2366 51.936 28.0566 54.912 26.9646 56.796C26.7006 56.556 26.0646 56.136 25.7166 55.992C26.7246 54.264 26.7966 51.732 26.7966 49.992V46.956Z" fill="#C5A600"/>
  28.                             </svg>' %}
  29.         <div class="ec-role">
  30.             <div class="ec-pageHeader">
  31.                 <h1>{{ 'ご注文の流れ'|trans }}</h1>
  32.             </div>
  33.             <div class="ec-pageBody">
  34.                 <div class="ec-section">
  35.                                             <div class="attention">
  36.                         会員登録していただきますと注文履歴が保存され便利です。ご登録後、ログインしてお申し込みください。<br>
  37.                         （※ログインせずにステッカーフォームからお申し込みいただいた分は、マイページの履歴として残りませんのでご了承ください。）
  38.                         </div>
  39.                     <h2 class="ec-section--title mt-5">【新規デザイン】お客さまによるデータ入稿</h2>
  40.                     <div class="st-Role">
  41.                         <div class="st-Flow">
  42.                             {% set flow2Items = [
  43.                             ['STEP1', 'お申し込み', iconCustomer , ''],
  44.                             ['STEP2', 'お見積り', iconStore ,''],
  45.                             ['STEP3', 'ご注文', iconCustomer ,''],
  46.                             ['STEP4', '製作', iconStore ,''],
  47.                             ['STEP5', 'お届け', iconCustomer ,''],
  48.                             ] %}
  49.                             {% for item in flow2Items %}
  50.                                     <div class="st-Flow__item">
  51.                                         <div class="st-Flow__item--title">
  52.                                             <h3><span class="flow-number">{{ item[0] }}</span><br>{{ item[1] | raw }}</h3>
  53.                                             <div class="st-Flow__item--image">{{ item[2] | raw }}</div>
  54.                                         </div>
  55.                                         {# <p class="st-Flow__item--text">{{ item[3] }}</p> #}
  56.                                     </div>
  57.                             {% endfor %}
  58.                         </div>
  59.                             <p>簡単な加工、軽微な修正などの理由で、データ作成費用が掛からないケースを含みます。</p>
  60.                     </div>
  61.                 </div>
  62.                 <div class="ec-section">
  63.                     <h2 class="ec-section--title">【新規デザイン】当店でデータ作成が必要になる場合</h2>
  64.                     <div class="st-Role">
  65.                         <div class="st-Flow">
  66.                             {% set flow2Items = [
  67.                             ['STEP1', 'お申し込み', iconCustomer , ''],
  68.                             ['STEP2', 'お見積り', iconStore ,''],
  69.                             ['STEP3', 'ご注文', iconCustomer ,''],
  70.                             ['STEP4', 'データ作成', iconStore ,''],
  71.                             ['STEP5', 'デザイン確認', iconCustomer ,''],
  72.                             ['STEP6', '製作', iconStore ,''],
  73.                             ['STEP7', 'お届け', iconCustomer ,''],
  74.                             ] %}
  75.                             {% for item in flow2Items %}
  76.                                     <div class="st-Flow__item">
  77.                                         <div class="st-Flow__item--title">
  78.                                             <h3><span class="flow-number">{{ item[0] }}</span><br>{{ item[1] | raw }}</h3>
  79.                                             <div class="st-Flow__item--image">{{ item[2] | raw }}</div>
  80.                                         </div>
  81.                                         {# <p class="st-Flow__item--text">{{ item[3] }}</p> #}
  82.                                     </div>
  83.                             {% endfor %}
  84.                         </div>
  85.                         <p>出力用データのご用意が難しい場合は、当店が代行してデータを起こします。<br>
  86.                         クレジットカード決済、銀行振込のお支払い方法がご利用いただけます。<br>
  87.                         データ作成は有償対応となりますが、内容確認の必要性や進行状況により、作業を先行して行う場合があります。</p>
  88.                     </div>
  89.                 </div>
  90.                 <div class="ec-section">
  91.                     <h2 class="ec-section--title">【再注文】同デザインのリピートオーダー</h2>
  92.                     <div class="st-Role">
  93.                         <div class="st-Flow">
  94.                             {% set flow1Items = [
  95.                                 ['STEP1', 'お申し込み', iconCustomer , ''],
  96.                                 ['STEP2', 'お見積り', iconStore ,''],
  97.                                 ['STEP3', 'ご注文', iconCustomer ,''],
  98.                                 ['STEP4', '製作', iconStore ,''],
  99.                                 ['STEP5', 'お届け', iconCustomer ,''],
  100.                             ] %}
  101.                             {% for item in flow1Items %}
  102.                                     <div class="st-Flow__item">
  103.                                         <div class="st-Flow__item--title">
  104.                                             <h3><span class="flow-number">{{ item[0] }}</span><br>{{ item[1] | raw }}</h3>
  105.                                             <div class="st-Flow__item--image">{{ item[2] | raw }}</div>
  106.                                         </div>
  107.                                         {# <p class="st-Flow__item--text">{{ item[3] }}</p> #}
  108.                                     </div>
  109.                             {% endfor %}
  110.                         </div>
  112.                         <div class ="mt-5 mb-3">
  113.                         <h2 class="ec-section--title">【再注文のご依頼方法】</h2>
  114.                         </div>
  115.                         <p>過去にご注文いただいた際の出力データやご注文内容は、当店で別途保管しております。<br>
  116.                         リピートご注文をご希望の場合は、下記いずれかの方法でご連絡くださいますと幸いです。</p>
  117.                         <p class="mt-3 mb-1"><strong>【お問い合わせフォームのご利用】</strong></p>
  118.                         お問い合わせ内容欄に分かる範囲の内容を記入して、お知らせいただけますと幸いです。<br>
  119.                         お問合せ目的の項目は「再注文」もしくは「再注文 | 2025年3月以前（サイトリニューアル前）のご注文について」をご選択ください。<br>
  120.                         <p class="mt-3 mb-1"><strong>【各お申込みフォームのご利用】</strong></p>
  121.                         カッティングステッカー、プリントステッカーのフォームよりご希望の内容を入力ください。
  122.                         その際、備考欄にリピートオーダーであることをご記入いただければ幸いです。
  123.                         デザインの画像やデータ等がお手元にない場合は、ご注文当時のスクリーンショットなどの資料を添付いただけますと幸いです。
  124.                         <p class="mt-3 mb-1"><strong>【会員登録（ご希望される方のみ）】</strong></p>
  125.                         事前に会員登録を行なっていただきますと、今後のご注文内容が会員用マイページに反映されます。<br>
  126.                         （反映には、ログイン状態でお申し込みいただくか、お客様による会員ご登録後に、当店側での見積り設定が必要です。）<br>
  127.                         リニューアル現在、ご注文履歴・お気に入り登録・お届け先登録が可能です。<br>
  128.                         会員登録後にお問い合わせフォームからお申し込みいただいた場合は、当店側で会員情報と紐づけた設定を行います。
  129.                     </div>
  130.                 </div>
  131.                 <div class="ec-section">
  132.                         <div class="st-Role">
  133.                             <div class="st-Flow">
  134.                                 <a class="page-transition" href="{{ is_new_reception_stopped() ? url('info') : url('contact') }}">お問い合わせフォーム</a>
  135.                                 <a class="page-transition" href="{{ is_new_reception_stopped() ? url('info') : '/products/estimate/cutting_sticker/' }}">カッティングステッカーお申込みフォーム</a>
  136.                                 <a class="page-transition" href="{{ is_new_reception_stopped() ? url('info') : '/products/estimate/print_sticker/' }}">プリントステッカーお申込みフォーム</a>
  137.                                 <a class="page-transition" href="/entry/">新規会員登録</a>
  138.                             </div>
  139.                         </div>
  140.                 </div>
  141.             </div>
  142.         </div>
  143.     {% endblock %}