app/template/user_data/faq.twig line 1

Open in your IDE?
  1. {% extends '@user_data/layout/default_frame.twig' %}
  2. {% block title %}
  3. よくある質問 | オリジナル缶バッジ/カンバッチ製作【個人小ロットから業務用OEMまで激安印刷】ZEAMI Goods
  4. {% endblock %}
  6. {% block content %}
  7. <!-- ▼▼ MAIN CONTENTS __________________________________________________________________________________________________ ▼▼ -->
  8. <main
  9. id="mainContents">
  12. <!-- // ++ パンクズ ++ //////////////////////////////////////////////////////////// // -->
  13. <div id="bread_crumbBloc" class="fades">
  14. <ul id="breadCrumb" class="fades">
  15. <li class="up">
  16. <a href="/"><img src="{{ asset('assets/img/icon_home.png') }}" alt="ホーム"></a>
  17. </li>
  18. <li class="up">
  19. ご利用ガイド
  20. </li>
  21. <li class="up">よくある質問</li>
  22. </ul>
  23. <!-- ///// #breadCrumb +++++ ///// -->
  24. <!-- ///// +++++ #bread_crumbBloc +++++ ///// -->
  25. </div>
  28. <!-- // == MAIN ================================================================================ // -->
  29. <section
  30. id="Faq" class="section_basic">
  32. <!-- // ++ ページタイトル ++ /////////////////////////////////////////////////////////////// -->
  33. <div id="section_titleBloc" class="fades twolayout_body">
  34. <div id="title_twoLayout">
  35. <h3 class="section_title up">よくある質問</h3>
  36. <p class="title_cap up">お客様よりいただくよくあるご質問をまとめました。</p>
  37. <p class="section_note up">不安なデータ作成やご注文にまつわる様々なことをお答えいたします。<br>
  38. こちらのページにはZEAMI Goodsのサービスにまつわるお客様よりいただきましたよくる質問をまとめています。<br>
  39. 各アイテムのデザイン方法に関するご質問は、各デザイン方法のページにてご確認ください。</p>
  40. </div>
  41. <!-- //// ++++ #title_twoLayout ++++ //// -->
  43. <figure id="titlePic" class="two_layout"><img src="{{ asset('assets/img/faq/faq_title_pic.jpg') }}"></figure>
  44. <!-- ///// #section_titleBloc +++++ ///// -->
  45. </div>
  48. <!-- // ++ TAB NAVI ++ //////////////////////////////////////////////////////////// -->
  49. <aside id="tabnaviBody" class="fadews">
  50. <ul id="tabNavi">
  51. {% for index, type in types %}
  52. <li class="tnavi0{{ index }} up">
  53. <a href="#Period0{{ index }}">{{type.name}}</a>
  54. </li>
  55. {% endfor %}
  56. </ul>
  57. </aside>
  58. <!-- //// #tabnaviBody +++++ ///// -->
  61. <!-- // ++ TAB CONTAINER ++ //////////////////////////////////////////////////////////// -->
  62. <div
  63. id="informationContainer" class="fades">
  64. {% for index, type in types %}
  65. <!-- ■■ 基本的なご質問 ++ ■■ -->
  66. <article id="Period0{{ index }}" class="panel">
  67. <h3 class="section_title up">{{type.name}}</h3>
  68. {% set Faqs = faqs|filter(v => v.type_id == type.id) %}
  69. <dl
  70. class="faq_container">
  71. <!-- /// .faq_answer_box *** /// -->
  72. {% for faq in Faqs %}
  73. <!-- ☆☆ ONE DATA ☆☆ -->
  74. <dt class="accTrigger up">
  75. <p class="faqNum">Q{{index + 1}}-{{loop.index}}</p>
  76. <h4 class="faq_title">{{faq.title}}</h4>
  77. </dt>
  78. <dd class="faq_answer_box up">
  79. <h5 class="anwser_headline">{{faq.note}}</h5>
  80. {{ faq.description|raw }}
  81. </dd>
  82. {% endfor %}
  83. <!-- /// .faq_answer_box *** /// -->
  85. <!-- /// *** .faq_container *** /// -->
  86. </dl>
  87. </article>
  88. <!-- //// #Period01 ++++ //// -->
  89. {% endfor %}
  91. <!-- //// ++++ #informationContainer ++++ //// -->
  92. </div>
  95. <!-- // ++ GUIDE LINK ++ //////////////////////////////////////////////////////////// -->
  96. {% include '@user_data/layout/guide_link.twig' %}
  99. </section>
  100. <!-- ///// +++++ #Faq +++++ ///// -->
  102. <!-- ///// +++++ #mainContents +++++ ///// -->
  103. </main>
  104. {% endblock %}