app/template/user_data/guide.twig line 1

Open in your IDE?
  1. {% extends 'default_frame.twig' %}
  3. {% block main %}
  4.   <main class="page_guide">
  5.     <div class="container">
  6.       <h2 class="page-title">
  7.         <span class="_main">ご利用ガイド</span>
  8.         <span class="_sub">USER'S GUIDE</span>
  9.       </h2>
  11.       <ul class="list-anchor">
  12.         <li><a href="#order-flow">ご注文の流れ</a></li>
  13.         <li><a href="#order-contact">各種お問い合わせ</a></li>
  14.         <li><a href="#order-return">返品・交換について</a></li>
  15.         <li><a href="#order-payment">お支払い方法</a></li>
  16.         <li><a href="#order-postage">送料について</a></li>
  17.       </ul>
  18.     </div>
  19.     <section class="order-flow" id="order-flow">
  20.       <div class="container">
  21.         <h3 class="title-secondary">
  22.           <span>ご注文の流れ</span>
  23.         </h3>
  24.         <ol class="order-flow__list">
  25.           <li class="order-flow__item">
  26.             <div class="order-flow__img">
  27.               <img src="{{
  28.                 asset(
  29.                   'assets/img/icon/ico_step_search.png',
  30.                   'user_data'
  31.                 )
  32.                 }}"
  33.                 alt="" />
  34.             </div>
  35.             <div class="order-flow__content">
  36.               <h2 class="order-flow__title">
  37.                 <span class="_step">Step 1</span>
  38.                 <span class="_main">商品の選択</span>
  39.               </h2>
  40.               <p class="order-flow__text">
  41.                 お求めの商品を探しやすいよう、カテゴリ検索やフリーワード検索をご用意しております。
  42.                 ページ上部メニューやフリーワード検索から商品をお探しください。
  43.                 書籍の名前やカテゴリで検索いただくと、サイトに掲載されている商品から目的の商品を一覧表示いたします。
  44.                 お好きな商品がありましたら「カートを入れる」ボタンから商品を追加してください。
  45.               </p>
  46.             </div>
  47.           </li>
  48.           <li class="order-flow__item">
  49.             <div class="order-flow__img">
  50.               <img src="{{
  51.                 asset(
  52.                   'assets/img/icon/ico_step_cart.png',
  53.                   'user_data'
  54.                 )
  55.                 }}"
  56.                 alt="" />
  57.             </div>
  58.             <div class="order-flow__content">
  59.               <h2 class="order-flow__title">
  60.                 <span class="_step">Step 2</span>
  61.                 <span class="_main">購入手続き</span>
  62.               </h2>
  63.               <p class="order-flow__text">
  64.                 ショッピングカート画面で商品・合計金額を確認し、購入手続きへお進みください。
  65.               </p>
  66.             </div>
  67.           </li>
  68.           <li class="order-flow__item">
  69.             <div class="order-flow__img">
  70.               <img src="{{
  71.                 asset(
  72.                   'assets/img/icon/ico_step_pen.png',
  73.                   'user_data'
  74.                 )
  75.                 }}"
  76.                 alt="" />
  77.             </div>
  78.             <div class="order-flow__content">
  79.               <h2 class="order-flow__title">
  80.                 <span class="_step">Step 3</span>
  81.                 <span class="_main">会員情報を入力</span>
  82.               </h2>
  83.               <p class="order-flow__text">
  84.                 新規お申込みの方は、会員登録をクリックして下さい。
  85.                 情報入力画面に移ります。会員登録がお済み方はのメールアドレスとパスワードをご入力ください。
  86.               </p>
  87.             </div>
  88.           </li>
  89.           <li class="order-flow__item">
  90.             <div class="order-flow__img">
  91.               <img src="{{
  92.                 asset(
  93.                   'assets/img/icon/ico_step_card.png',
  94.                   'user_data'
  95.                 )
  96.                 }}"
  97.                 alt="" />
  98.             </div>
  99.             <div class="order-flow__content">
  100.               <h2 class="order-flow__title">
  101.                 <span class="_step">Step 4</span>
  102.                 <span class="_main">お支払い方法の選択</span>
  103.               </h2>
  104.               <p class="order-flow__text">
  105.                 代金引換、お振り込み、クレジットカードの方法でお支払い可能です。
  106.                 ※4,000円以上お買い上げの場合、送料・代引き手数料は無料になります。
  107.               </p>
  108.             </div>
  109.           </li>
  110.           <li class="order-flow__item">
  111.             <div class="order-flow__img">
  112.               <img src="{{
  113.                 asset(
  114.                   'assets/img/icon/ico_step_gift.png',
  115.                   'user_data'
  116.                 )
  117.                 }}"
  118.                 alt="" />
  119.             </div>
  120.             <div class="order-flow__content">
  121.               <h2 class="order-flow__title">
  122.                 <span class="_step">Step 5</span>
  123.                 <span class="_main">注文内容を確認、注文</span>
  124.               </h2>
  125.               <p class="order-flow__text">
  126.                 ご注文内容をご確認の上、「ご注文完了ページへ」をクリックして下さい。
  127.                 ご注文が確定しますと、キャンセルは出来ませんのでご注意下さい。
  128.                 以上の流れでご注文完了です。
  129.                 ご注文から約3日から1週間ほどでお届けいたします。
  130.                 ご注文が完了しますと、ご登録いただきましたアドレスに確認のメールを送信します。
  131.               </p>
  132.             </div>
  133.           </li>
  134.         </ol>
  135.       </div>
  136.     </section>
  137.     <section class="order-contact" id="order-contact">
  138.       <div class="container">
  139.         <h3 class="title-secondary">
  140.           <span>各種お問い合わせ</span>
  141.         </h3>
  142.         <div class="order-contact__content">
  143.           <p class="txt">
  144.             ご不明な点がございましたらお気軽にお問い合わせ下さい。
  145.           </p>
  146.           <p class="txt text-m">
  147.             株式会社コスモ教育出版 〒103-0007 東京都中央区日本橋浜町2丁目42-9<br />
  148.             浜町中央ビル５階<br />
  149.             フリーダイヤル：0120-519-114<br class="sp">（受付時間/9:00～18:00）
  150.           </p>
  151.           <div class="order-contact__btnarea">
  152.             <a class="btn-basic" href="{{ url('contact') }}">お問い合わせ</a>
  153.           </div>
  154.         </div>
  155.       </div>
  156.     </section>
  157.     <section class="order-return" id="order-return">
  158.       <div class="container">
  159.         <h3 class="title-secondary">
  160.           <span>返品・交換について</span>
  161.         </h3>
  162.         <p class="txt">
  163.           書籍がお手元に届きましたら破損がないか、ご注文の商品に相違がないかをご確認下さい。
  164.         </p>
  165.         <p class="txt text-m">
  166.           - 返品条件<br />
  167.           書籍の返品は、書籍到着後の10日以内に下記問い合わせ先までご連絡後、ご返品ください。<br />
  168.           但し、配送途上での破損・乱丁･落丁等で書籍に不良があった場合、注文と異なる書籍が配送された場合は、到着後の日数に係らず返品・交換をお受けいたします。
  169.         </p>
  170.       </div>
  171.     </section>
  172.     <section class="order-payment" id="order-payment">
  173.       <div class="container">
  174.         <h3 class="title-secondary">
  175.           <span>お支払い方法</span>
  176.         </h3>
  177.         <ul class="order-payment__list">
  178.           <li class="order-payment__item _credit">
  179.             <h3 class="order-payment__title">
  180.               <img class="ico" src="{{
  181.                 asset(
  182.                   'assets/img/icon/ico_credit.png',
  183.                   'user_data'
  184.                 )
  185.                 }}"
  186.                 alt="" />
  187.               <span>クレジットカード決済</span>
  188.             </h3>
  189.             <p class="order-payment__text">
  190.               VISA / MASTER / JCB / AMEX / Diners<br />
  191.               各種カードご利用いただけます。
  192.             </p>
  193.           </li>
  194.           <li class="order-payment__item _bank">
  195.             <h3 class="order-payment__title">
  196.               <img class="ico" src="{{
  197.                 asset(
  198.                   'assets/img/icon/ico_cash.png',
  199.                   'user_data'
  200.                 )
  201.                 }}"
  202.                 alt="" />
  203.               <span>銀行振込</span>
  204.             </h3>
  205.             <p class="order-payment__text">
  206.               振込手数料はお客様にご負担いただきます。<br />
  207.               予めご了承ください。
  208.             </p>
  209.           </li>
  210.           <li class="order-payment__item _dai">
  211.             <h3 class="order-payment__title">
  212.               <img class="ico" src="{{
  213.                 asset(
  214.                   'assets/img/icon/ico_bill.png',
  215.                   'user_data'
  216.                 )
  217.                 }}"
  218.                 alt="" />
  219.               <span>代金引換</span>
  220.             </h3>
  221.             <p class="order-payment__text">
  222.               代引手数料：330円<br />
  223.               4,000円以上のご購入で代引き手数料無料!
  224.             </p>
  225.           </li>
  226.         </ul>
  227.       </div>
  228.     </section>
  229.     <section class="order-postage" id="order-postage">
  230.       <div class="container">
  231.         <h3 class="title-secondary">
  232.           <span>送料について</span>
  233.         </h3>
  234.         <p class="txt">
  235.           4,000円以上のご購入で送料・代引き手数料 無料！<br />
  236.           4,000円未満は送料：550円
  237.         </p>
  238.       </div>
  239.     </section>
  240.   </main>
  241. {% endblock %}