app/template/user_data/sticker-design.twig line 1

Open in your IDE?
  1. {% extends '@user_data/layout/default_frame.twig' %}
  2. {% block title %}
  3.     ステッカー製作 - デザイン方法 | こだわり品質【小ロット1個から】ZEAMI Goods
  4. {% endblock %}
  5. {% block content %}
  6.     <!-- ▼▼ MAIN CONTENTS __________________________________________________________________________________________________ ▼▼ -->
  7.     <main
  8.         id="mainContents">
  9.         <!-- // ++ パンクズ ++ //////////////////////////////////////////////////////////// // -->
  10.         <div id="bread_crumbBloc" class="fades">
  11.             <ul id="breadCrumb" class="fades">
  12.                 <li class="up">
  13.                     <a href="/"><img src="{{ asset('assets/img/icon_home.png') }}" alt="ホーム"></a>
  14.                 </li>
  15.                 <li class="up">
  16.                     <a href="/category/{{ category.id ?? '' }}">{{category.name ?? ''}}</a>
  17.                 </li>
  18.                 <li class="up">デザイン方法</li>
  19.             </ul>
  20.             <!-- ///// #breadCrumb +++++ ///// -->
  21.             <!-- ///// +++++ #bread_crumbBloc +++++ ///// -->
  22.         </div>
  23.         <!-- // == MAIN ================================================================================ // -->
  24.         <section
  25.             id="Design" class="section_basic">
  26.             <!-- // ++ ページタイトル ++ /////////////////////////////////////////////////////////////// -->
  27.             <div id="section_titleBloc" class="fades twolayout_body">
  28.                 <div id="title_twoLayout">
  29.                     <h3 class="section_title up">デザイン方法</h3>
  30.                     <p class="title_cap up">プロからアマチュア、初めての方もご安心ください。</p>
  31.                     <p class="section_note up">当店は一般の方からプロの絵描き様、企業様まで幅広くご利用いただいております。<br>
  32.                         Adobe IllustratorやPhotoshopの完全データでのご入稿はもちろん、スマホやPCで簡単にご使用いただけるデザインシミュレーターでのデザインも可能です。</p>
  33.                 </div>
  34.                 <!-- //// ++++ #title_twoLayout ++++ //// -->
  35.                 <figure id="titlePic" class="two_layout"><img src="{{ asset('/html/user_data/assets/image/design_title_pic.jpg') }}"></figure>
  36.                 <!-- ///// #section_titleBloc +++++ ///// -->
  37.             </div>
  38.             <!-- // ++ TAB NAVI ++ //////////////////////////////////////////////////////////// -->
  39.             <aside id="tabnaviBody" class="fades">
  40.                 <ul id="tabNavi">
  41.                     <li class="tnavi01 up">
  42.                         <a href="#Period01">Illustrator</a>
  43.                     </li>
  44.                     <li class="tnavi02 up">
  45.                         <a href="#Period02">Photoshop</a>
  46.                     </li>
  47.                     <li class="tnavi03 up">
  48.                         <a href="#Period03">Clip Studio</a>
  49.                     </li>
  50.                     <li class="tnavi04 up">
  51.                         <a href="#Period04">その他</a>
  52.                     </li>
  53.                     <li class="tnavi05 up">
  54.                         <a href="#Period05">シミュレーター</a>
  55.                     </li>
  56.                 </ul>
  57.             </aside>
  58.             <!-- //// #tabnaviBody +++++ ///// -->
  59.             <!-- // ++ TAB CONTAINER ++ //////////////////////////////////////////////////////////// -->
  60.             <div
  61.                 id="informationContainer" class="fades">
  62.                 <!-- ■■ Illustrator ++ ■■ -->
  63.                 <article
  64.                     id="Period01" class="panel">
  65.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  66.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  67.                         <div id="title_twoLayout">
  68.                             <p class="title_cap up">入稿可能なデータ形式</p>
  69.                             <p class="indent section_note up">◯ Adobe Illustrator ai形式(全バージョン対応)</p>
  70.                             <p class="indent section_note up">◯ カラーモード:CMYK</p>
  71.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  72.                             <p class="indent section_note up">◯ 画像はリンク配置を行い、必ず全リンク画像データを添えたフォルダを圧縮してご入稿ください</p>
  73.                         </div>
  74.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  75.                         <figure id="titlePic" class="two_layout download">
  76.                             <a href="/html/user_data/assets/template/Sticker_ai.zip" target="_blank">
  77.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  78.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  79.                             </a>
  80.                         </figure>
  81.                         <!-- //// ++++ #titlePic ++++ //// -->
  82.                         <!-- ///// #section_titleBloc +++++ ///// -->
  83.                     </div>
  84.                     <h3 class="section_title up">データの作成方法</h3>
  85.                     <dl
  86.                         class="design_container">
  87.                         <!-- ☆☆ ONE DATA ☆☆ -->
  88.                         <dt class="up">
  89.                             <p class="design_num up">1</p>
  90.                             <h4 class="design_title up">「ダイカットステッカー」と「ダイカット+ハーフカットステッカー」の違い</h4>
  91.                         </dt>
  92.                         <dd class="design_note_box">
  93.                             <div class="one_box fades">
  94.                                 <p class="up">それぞれデザイン内に指定できるカットラインの種類が違います。</p>
  95.                                 <!-- // ** .one_box ** // -->
  96.                             </div>
  97.                             <div class="one_box fades">
  98.                                 <h5 class="design_headline up">【ダイカットステッカー】</h5>
  99.                                 <p class="up">「ダイカット」とはステッカー面と剥離紙を一緒に切り抜くカット方法です。<br>
  100.                                     カットラインはデザインに対してダイカット用ライン1つのみ制作となります。</p>
  101.                                 <!-- // ** .one_box ** // -->
  102.                             </div>
  103.                             <div class="one_box fades">
  104.                                 <h5 class="design_headline up">【ダイカット+ハーフカットステッカー】</h5>
  105.                                 <p class="up">デザインに対して「ダイカット」と「ハーフカット」、2種類のカットラインを使用してステッカーを製作します 。<br>
  106.                                     ステッカー面と剥離紙を一緒に裁ち落とす「ダイカット」に対し、「ハーフカット」は、剥離紙を残してステッカー面のみを切り抜くカット方法です。<br>
  107.                                     またカットラインはデザインに対して、1つのダイカット用ラインと、複数のハーフカット用ラインを制作する事が可能です。<br>
  108.                                     ハーフカットの外側にも背景としてデザインを行っていただけます。<br>
  109.                                     <!-- // ** .one_box ** // -->
  110.                                 </p>
  111.                             </div>
  112.                             <div class="one_box fades">
  113.                                 <ul class="design_piclist style01 fades">
  114.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker01.png') }}" class="up"></li>
  115.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker02.png') }}" class="up"></li>
  116.                                 </ul>
  117.                                 <!-- // ** one_boxdesign_piclist ** // -->
  118.                                 <!-- // ** .one_box ** // -->
  119.                             </div>
  120.                             <aside class="one_box caution_box fades">
  121.                                 <div class="caution_inner">
  122.                                     <h5 class="caution_title up">ダイカット+ハーフカット配置上の注意!</h5>
  123.                                     <p class="up">ハーフカットデザインを配置する際、隣り合うデザイン、または仕上がりの断ち切り位置から十分な余裕をもって配置してください。</p>
  124.                                     <figure class="caution_pic f_blur">
  125.                                         <img src="{{ asset('/html/user_data/assets/image/design_sticker03.png') }}">
  126.                                     </figure>
  127.                                     <!-- // .caution_pic ** // -->
  128.                                     <!-- // ** .caution_box ** // -->
  129.                                 </div>
  130.                             </aside>
  131.                         </dd>
  132.                         <!-- /// .design_note_box *** /// -->
  133.                         <!-- ☆☆ ONE DATA ☆☆ -->
  134.                         <dt class="up">
  135.                             <p class="design_num up">2</p>
  136.                             <h4 class="design_title up">デザインサイズ</h4>
  137.                         </dt>
  138.                         <dd class="design_note_box fades">
  139.                             <div class="one_box fades">
  140.                                 <ul class="design_piclist fades ">
  141.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker04.png') }}" class="up"></li>
  142.                                 </ul>
  143.                                 <!-- // ** one_boxdesign_piclist ** // -->
  144.                                 <!-- // ** .one_box ** // -->
  145.                             </div>
  146.                             <div class="one_box fades">
  147.                                 <ul class="design_piclist fades ">
  148.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker05.png') }}" class="up"></li>
  149.                                 </ul>
  150.                                 <!-- // ** one_boxdesign_piclist ** // -->
  151.                                 <!-- // ** .one_box ** // -->
  152.                             </div>
  153.                             
  154.                             <div class="one_box fades">
  155.                                 <p class="indent up">◯ 各ステッカーサイズ、範囲内で自由に制作してください。</p>
  156.                                 <p class="indent up">◯ データは必ず実寸大で制作してください。</p>
  157.                                 <p class="indent up">◯ テンプレートは縦横自由にご使用いただけます。</p>
  158.                                 <p class="indent up">◯ データ内にカットラインをご指定いただけますが、弊社にて製作に問題ないカットラインに調整させていただきますので、あくまでも目安程度にお考えください。</p>
  159.                                 <p class="indent up">◯ 最小カットラインサイズは縦横1cmまで基本的に可能です。形状が複雑すぎるデータは破れや折れの原因となるため、対応致しかねる場合もございます。</p>
  160.                                 <!-- // ** .one_box ** // -->
  161.                             </div>
  162.                         </dd>
  163.                         <!-- /// .design_note_box *** /// -->
  164.                         <!-- ☆☆ ONE DATA ☆☆ -->
  165.                         <dt class="up">
  166.                             <p class="design_num up">3</p>
  167.                             <h4 class="design_title up">塗り足しの注意!</h4>
  168.                         </dt>
  169.                         <dd class="design_note_box fades">
  170.                             <div class="one_box fades">
  171.                                 <p class="up">色ふちのあるデザインは必ず下図のように塗り足しを作成してください。</p>
  172.                                 <!-- // ** .one_box ** // -->
  173.                             </div>
  174.                             <div class="one_box fades">
  175.                                 <ul class="design_piclist fades ">
  176.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker06.png') }}" class="up"></li>
  177.                                 </ul>
  178.                                 <!-- // ** one_boxdesign_piclist ** // -->
  179.                                 <!-- // ** .one_box ** // -->
  180.                             </div>
  181.                         </dd>
  182.                         <!-- /// .design_note_box *** /// -->
  183.                         <!-- ☆☆ ONE DATA ☆☆ -->
  184.                         <dt class="up">
  185.                             <p class="design_num up">4</p>
  186.                             <h4 class="design_title up">カラーモードについて</h4>
  187.                         </dt>
  188.                         <dd class="design_note_box fades">
  189.                             <div class="one_box fades">
  190.                                 <ul class="design_piclist fades">
  191.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker07.png') }}" class="up"></li>
  192.                                 </ul>
  193.                                 <!-- // ** one_boxdesign_piclist ** // -->
  194.                                 <!-- // ** .one_box ** // -->
  195.                             </div>
  196.                             <div class="one_box fades">
  197.                                 <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  198.                                 <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>
  199.                                     ※特色対応不可</p>
  200.                                 <!-- // ** .one_box ** // -->
  201.                             </div>
  202.                         </dd>
  203.                         <!-- /// .design_note_box *** /// -->
  204.                         <!-- ☆☆ ONE DATA ☆☆ -->
  205.                         <dt class="up">
  206.                             <p class="design_num up">5</p>
  207.                             <h4 class="design_title up">リッチブラック推奨</h4>
  208.                         </dt>
  209.                             <div class="one_box fades">
  210.                                 <ul class="design_piclist style01 fades">
  211.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker08.png') }}" class="up"></li>
  212.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker09.png') }}" class="up"></li>
  213.                                 </ul>
  214.                                 <!-- // ** one_boxdesign_piclist ** // -->
  215.                                 <!-- // ** .one_box ** // -->
  216.                             </div>
  217.                         <dd class="design_note_box fades">
  218.                             <div class="one_box fades">
  219.                                 <p class="list_cap">デザイン中の黒色箇所はリッチブラックをご使用ください。</p>
  220.                                 <ul class="design_piclist style03 fades">
  221.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker10.png') }}" class="up">
  222.                                         <p>リッチブラック(推奨:C50% M50% Y50% K100%):スミベタより深い黒で印刷されます。【 オススメ 】</p>
  223.                                     </li>
  224.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker11.png') }}" class="up">
  225.                                         <p>スミベタ(K100%):ブラックのみで黒を印刷。全体的に薄い色乗りになります。</p>
  226.                                     </li>
  227.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker12.png') }}" class="up">
  228.                                         <p>4色ベタ(C100% M100% Y100% K100%):使用量が多すぎにじみやかすれなどが発生する為、使用不可です。</p>
  229.                                     </li>
  230.                                 </ul>
  231.                                 <!-- // ** one_boxdesign_piclist ** // -->
  232.                                 <!-- // ** .one_box ** // -->
  233.                             </div>
  234.                         </dd>
  235.                         <!-- /// .design_note_box *** /// -->
  236.                         <!-- ☆☆ ONE DATA ☆☆ -->
  237.                         <dt class="up">
  238.                             <p class="design_num up">6</p>
  239.                             <h4 class="design_title up">「シルバーステッカー」、「クリアーステッカー」、「ハーフクリアーステッカー」について</h4>
  240.                         </dt>
  241.                         <dd class="design_note_box fades">
  242.                             <div class="one_box fades">
  243.                                 <ul class="design_piclist fades ">
  244.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker13.png') }}" class="up"></li>
  245.                                 </ul>
  246.                                 <!-- // ** one_boxdesign_piclist ** // -->
  247.                                 <!-- // ** .one_box ** // -->
  248.                             </div>
  249.                             <div class="one_box fades">
  250.                                 <p class="indent up">◯ データ内、白色で指定されている箇所は すべてステッカーの下地の色で表現されます。色使いには十分ご注意ください。</p>
  251.                                 <p class="indent up">◯ CMYKカラーでの印刷となりますので、 シルバーステッカーやクリアーステッカーはデータ上で白で表現されている箇所は各紙種の下地の色で仕上がります。
  252.                                 </p>
  253.                                 <p class="indent up">◯ 他のステッカーとは異なり、ステッカーの素材の風合いを活かしたステッカーを製作いただけます。</p>
  254.                                 <p class="indent up">◯ またパステルカラーなど、濃度の薄い色味につきましては下地の色が強く出てしまう場合がございます。</p>
  255.                                 <p class="indent up">◯ 仕上がりの色味が気になる場合は、事前に少量で確認用にご依頼いただくことを推奨させていただきます。</p>
  256.                                 <!-- // ** .one_box ** // -->
  257.                             </div>
  258.                         </dd>
  259.                         <!-- /// .design_note_box *** /// -->
  260.                         <!-- ☆☆ ONE DATA ☆☆ -->
  261.                         <dt class="up">
  262.                             <p class="design_num up">7</p>
  263.                             <h4 class="design_title up">白色印刷</h4>
  264.                         </dt>
  265.                         <dd class="design_note_box fades">
  266.                             <div class="one_box fades">
  267.                                 <ul class="design_piclist fades ">
  268.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker14.png') }}" class="up"></li>
  269.                                 </ul>
  270.                                 <!-- // ** one_boxdesign_piclist ** // -->
  271.                                 <!-- // ** .one_box ** // -->
  272.                             </div>
  273.                             <div class="one_box fades">
  274.                                 <ul class="design_piclist fades ">
  275.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker15.png') }}" class="up"></li>
  276.                                 </ul>
  277.                                 <!-- // ** one_boxdesign_piclist ** // -->
  278.                                 <!-- // ** .one_box ** // -->
  279.                             </div>
  280.                             <div class="one_box fades">
  281.                                 <p class="indent up">◯ 「ハーフクリアステッカー」「クリアステッカー」と「シルバーステッカー」のデザイン上透けさせたくない箇所に白色印刷を行うことができます。</p>
  282.                                 <p class="indent up">◯ Illustratorのパスデータで作成してください。パスデータ以外は白色印刷いたしかねます。</p>
  283.                                 <!-- // ** .one_box ** // -->
  284.                             </div>
  285.                             <div class="one_box fades">
  286.                                 <h5 class="up sub_headline">実際の仕上がりイメージ(透明ステッカーの場合)</h5>
  287.                                 <ul class="design_piclist fades style02">
  288.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker16.png') }}" class="up">
  289.                                         <p class="up">
  290.                                             <span class="pic_headline">白色印刷を行わない場合</span>全体的に透けた仕上がりとなります</p>
  291.                                     </li>
  292.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker17.png') }}" class="up">
  293.                                         <p class="up">
  294.                                             <span class="pic_headline">白色印刷を行う場合</span>白版の上から印刷を行うため、透け感はほとんどなくなります。<br>
  295.                                             ※完全に透けなくなるわけではありませんののでご注意ください。</p>
  296.                                     </li>
  297.                                 </ul>
  298.                                 <!-- // ** one_boxdesign_piclist ** // -->
  299.                                 <aside class="one_box caution_box fades">
  300.                                     <div class="caution_inner">
  301.                                         <h5 class="caution_title up">データ作成上のご注意</h5>
  302.                                         <p class="up indent">◯ 2回の印刷工程のためデザイン版とホワイト版に最大1.5mmのズレが生じます。<br>
  303.                                             ズレを目立たせないように、白版レイヤーを一回り小さくデザインする等の配慮を推奨いたします。</p>
  304.                                         <!-- // ** .caution_box ** // -->
  305.                                     </div>
  306.                                 </aside>
  307.                                 <!-- // ** .one_box ** // -->
  308.                             </div>
  309.                         </dd>
  310.                         <!-- /// .design_note_box *** /// -->
  311.                         <!-- ☆☆ ONE DATA ☆☆ -->
  312.                         <dt class="up">
  313.                             <p class="design_num up">8</p>
  314.                             <h4 class="design_title up">裏面モノクロ印刷</h4>
  315.                         </dt>
  316.                         <dd class="design_note_box fades">
  317.                             <div class="one_box fades">
  318.                                 <p class="list_cap">裏面印刷を行うことでこんなことができます</p>
  319.                                 <ul class="design_piclist fades style03">
  320.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker18.png') }}" class="up">
  321.                                         <p class="up">企業情報を載せて名刺がわりに使ったり</p>
  322.                                     </li>
  323.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker19.png') }}" class="up">
  324.                                         <p class="up">キャラクターのプロフィールを載せたり</p>
  325.                                     </li>
  326.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker20.png') }}" class="up">
  327.                                         <p class="up">イベントのクーポン券として使用したり</p>
  328.                                     </li>
  329.                                 </ul>
  330.                                 <!-- // ** one_boxdesign_piclist ** // -->
  331.                                 <!-- // ** .one_box ** // -->
  332.                             </div>
  333.                             <div class="one_box fades">
  334.                                 <h5 class="up sub_headline">デザイン方法</h5>
  335.                                 <p class="indent up">◯ 表面デザインデータご入稿後、当店にてカットラインを作成させていただきます。</p>
  336.                                 <p class="indent up">◯ 当店にて作成いたしましたカットラインデータを利用し、裏面デザインを作成ください。</p>
  337.                                 <aside class="caution_box fades" style="margin-top:1em;">
  338.                                     <div class="caution_inner">
  339.                                         <h5 class="caution_title up">ご注意</h5>
  340.                                         <p class="up indent">◯ ※通常より確認事項が増えますため、納期に余裕を持ってご入稿ください。</p>
  341.                                         <!-- // ** .caution_box ** // -->
  342.                                     </div>
  343.                                 </aside>
  344.                                 <!-- // ** .one_box ** // -->
  345.                             </div>
  346.                             <div class="one_box fades">
  347.                                 <h5 class="up sub_headline">データ入稿の流れ</h5>
  348.                                 <ul class="design_piclist fades">
  349.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker21.png') }}" class="up"></li>
  350.                                 </ul>
  351.                                 <ul class="design_piclist fades">
  352.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker22.png') }}" class="up"></li>
  353.                                 </ul>
  354.                                 <!-- // ** one_boxdesign_piclist ** // -->
  355.                                 <aside class="one_box caution_box fades">
  356.                                     <div class="caution_inner">
  357.                                         <h5 class="caution_title up">裏面データ作成上のご注意</h5>
  358.                                         <p class="up indent">◯ 色はK=100%の1Cにてデザインを行ってください。</p>
  359.                                         <p class="up indent">◯ カットラインより3mmほど内側にデザインを作成してください。</p>
  360.                                         <p class="up indent">◯ 裏面印刷は正確に同じ位置に合わせることが非常に難しいため、表面のデザインと裏面のデザインの印刷位置にズレが生じます。</p>
  361.                                         <p class="up indent">◯ デザインが3mmほどズレても問題のないデータ作成をお願いいたします。</p>
  362.                                         <p class="up indent">◯ なお、ズレに対する刷り直しは致しかねますのでご了承ください。</p>
  363.                                         <!-- // ** .caution_box ** // -->
  364.                                     </div>
  365.                                 </aside>
  366.                                 <!-- // ** .one_box ** // -->
  367.                             </div>
  368.                             <div class="one_box fades">
  369.                                 <h5 class="up sub_headline">剥離紙(裏紙)の色について</h5>
  370.                                 <ul class="design_piclist fades">
  371.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker23.png') }}" class="up"></li>
  372.                                 </ul>
  373.                                 <p class="list_cap">◯ デザイン上、白色の部分は、剥離紙の地色である「薄い黄色」または「白色」になります。</p>
  374.                                 <!-- // ** one_boxdesign_piclist ** // -->
  375.                                 <!-- // ** .one_box ** // -->
  376.                             </div>
  377.                         </dd>
  378.                         <!-- /// .design_note_box *** /// -->
  379.                         <!-- ☆☆ ONE DATA ☆☆ -->
  380.                         <dt class="up">
  381.                             <p class="design_num up">9</p>
  382.                             <h4 class="design_title up">屋外使用に適したステッカーについて</h4>
  383.                         </dt>
  384.                         <dd class="design_note_box fades">
  385.                             <div class="one_box fades">
  386.                                 <p class="indent up">◯ 弊社ではPET素材(ホワイトステッカー・弱粘着ステッカー・シルバーステッカー・クリアステッカー)に+ラミネート加工を施したステッカーをお勧めしております。</p>
  387.                                 <p class="indent up">◯ 上記4種類のステッカーはZEAMI Goodsの中でも耐久性・耐水性に優れたステッカーとなります。</p>
  388.                                 <p class="indent up">◯ また+ラミネート加工を施すことにより、さらに耐久性・耐水性をあげる事が可能です。</p>
  389.                                 <p class="indent up">◯ ただし、使用環境によってステッカーの劣化スピードは大幅に変わって参ります。</p>
  390.                                 <p class="indent up">◯ 実際の使用環境での耐久性・耐水性が気になる場合は、弊社にて各ステッカーのサンプルをご用意してしておりますので、事前にお試し頂けましたら幸いです。</p>
  391.                                 <!-- // ** .one_box ** // -->
  392.                             </div>
  393.                         </dd>
  394.                         <!-- /// .design_note_box *** /// -->
  395.                     </dl>
  396.                     <!-- //// .design_container **** //// -->
  397.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  398.                     <div class="bottom_notes_bloc fades">
  399.                         <aside class="one_box caution_box fades">
  400.                             <div class="caution_inner">
  401.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  402.                                 <p class="up indent">1. 文字は必ずアウトライン化してください。</p>
  403.                                 <p class="up indent">2. デザインが複数ある場合、同一アートボードに全て並べて配置し、1ファイルにまとめてご入稿ください。</p>
  404.                                 <p class="up indent">3. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  405.                                 <p class="up indent">4. デザインの周囲2mmほど外側にカットラインが来ますので、その余白ぶんを見越してデータを作成してください。</p>
  406.                                 <p class="up indent">5. 必要な場合は天地左右2㎜以上の塗り足しをつけてください。</p>
  407.                                 <p class="up indent">6. 塗り足しがある場合、塗り足しを含めたデザインを規格サイズ内に収めてください。</p>
  408.                                 <p class="up indent">7. 配置画像データの解像度は350dpi以上を推奨させていただいています。</p>
  409.                                 <p class="up indent">8. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意下さい。</p>
  410.                                 <p class="up indent">9. お客様自身でカット位置を指定する場合はデザインデータ内にレイヤーを分けるか切り抜き線と分かるように指示を入れるようにしてください。指示を元に弊社にて、カットラインを製作致します。その場合デザインギリギリに設定するとズレなどで仕上がりにステッカーの下地が出手しまう場合もございます。</p>
  411.                                 <p class="up indent">10.保存の際にICCプロファイルを埋め込まないでください。</p>
  412.                                 <p class="up indent">11.スタイライズ(ドロップシャドウやぼかしなど)をご使用の場合は、粗く印刷される場合がございます。Photoshop等にて画像化したものをご入稿いただくことを推奨とさせていただきます。</p>
  413.                                 <!-- // ** .caution_box ** // -->
  414.                             </div>
  415.                         </aside>
  416.                         <!-- //// .bottom_notes_bloc **** //// -->
  417.                     </div>
  418.                 </article>
  419.                 <!-- //// #Period01 ++++ //// -->
  420.                 <!-- ■■ Photoshop ++ ■■ -->
  421.                 <article
  422.                     id="Period02" class="panel">
  423.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  424.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  425.                         <div id="title_twoLayout">
  426.                             <p class="title_cap up">入稿可能なデータ形式</p>
  427.                             <p class="indent section_note up">◯ Adobe Photoshop psd形式(全バージョン対応)</p>
  428.                             <p class="indent section_note up">◯ 推奨解像度:350dpi</p>
  429.                             <p class="indent section_note up">◯ カラーモード:CMYK</p>
  430.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  431.                         </div>
  432.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  433.                         <figure id="titlePic" class="two_layout download">
  434.                             <a href="/html/user_data/assets/template/Sticker_psd.zip" target="_blank">
  435.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  436.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  437.                             </a>
  438.                         </figure>
  439.                         <!-- //// ++++ #titlePic ++++ //// -->
  440.                         <!-- ///// #section_titleBloc +++++ ///// -->
  441.                     </div>
  442.                     <h3 class="section_title up">データの作成方法</h3>
  443.                     <dl
  444.                         class="design_container">
  445.                         <!-- ☆☆ ONE DATA ☆☆ -->
  446.                         <dt class="up">
  447.                             <p class="design_num up">1</p>
  448.                             <h4 class="design_title up">「ダイカットステッカー」と「ダイカット+ハーフカットステッカー」の違い</h4>
  449.                         </dt>
  450.                         <dd class="design_note_box">
  451.                             <div class="one_box fades">
  452.                                 <p class="up">それぞれデザイン内に指定できるカットラインの種類が違います。</p>
  453.                                 <!-- // ** .one_box ** // -->
  454.                             </div>
  455.                             <div class="one_box fades">
  456.                                 <h5 class="design_headline up">【ダイカットステッカー】</h5>
  457.                                 <p class="up">「「ダイカット」とはステッカー面と剥離紙を一緒に切り抜くカット方法です。<br>
  458.                                     カットラインはデザインに対してダイカット用ライン1つのみ制作となります。</p>
  459.                                 <!-- // ** .one_box ** // -->
  460.                             </div>
  461.                             <div class="one_box fades">
  462.                                 <h5 class="design_headline up">【ダイカット+ハーフカットステッカー】</h5>
  463.                                 <p class="up">デザインに対して「ダイカット」と「ハーフカット」、2種類のカットラインを使用してステッカーを製作します 。<br>
  464.                                     ステッカー面と剥離紙を一緒に裁ち落とす「ダイカット」に対し、「ハーフカット」は、剥離紙を残してステッカー面のみを切り抜くカット方法です。<br>
  465.                                     またカットラインはデザインに対して、1つのダイカット用ラインと、複数のハーフカット用ラインを制作する事が可能です。<br>
  466.                                     ハーフカットの外側にも背景としてデザインを行っていただけます。<br>
  467.                                     <!-- // ** .one_box ** // -->
  468.                                 </p>
  469.                             </div>
  470.                             <div class="one_box fades">
  471.                                 <ul class="design_piclist style01 fades">
  472.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker01.png') }}" class="up"></li>
  473.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker02.png') }}" class="up"></li>
  474.                                 </ul>
  475.                                 <!-- // ** one_boxdesign_piclist ** // -->
  476.                                 <!-- // ** .one_box ** // -->
  477.                             </div>
  478.                             <aside class="one_box caution_box fades">
  479.                                 <div class="caution_inner">
  480.                                     <h5 class="caution_title up">ダイカット+ハーフカット配置上の注意!</h5>
  481.                                     <p class="up">ハーフカットデザインを配置する際、隣り合うデザイン、または仕上がりの断ち切り位置から十分な余裕をもって配置してください。</p>
  482.                                     <figure class="caution_pic f_blur">
  483.                                         <img src="{{ asset('/html/user_data/assets/image/design_sticker03.png') }}">
  484.                                     </figure>
  485.                                     <!-- // .caution_pic ** // -->
  486.                                     <!-- // ** .caution_box ** // -->
  487.                                 </div>
  488.                             </aside>
  489.                         </dd>
  490.                         <!-- /// .design_note_box *** /// -->
  491.                         <!-- ☆☆ ONE DATA ☆☆ -->
  492.                         <dt class="up">
  493.                             <p class="design_num up">2</p>
  494.                             <h4 class="design_title up">デザインサイズ</h4>
  495.                         </dt>
  496.                         <dd class="design_note_box fades">
  497.                             <div class="one_box fades">
  498.                                 <ul class="design_piclist style02 fades">
  499.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker04.png') }}" class="up"></li>
  500.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker05.png') }}" class="up"></li>
  501.                                 </ul>
  502.                                 <!-- // ** one_boxdesign_piclist ** // -->
  503.                                 <!-- // ** .one_box ** // -->
  504.                             </div>
  505.                             <div class="one_box fades">
  506.                                 <p class="indent up">◯ 各ステッカーサイズ、範囲内で自由に制作してください。</p>
  507.                                 <p class="indent up">◯ データは必ず実寸大で制作してください。</p>
  508.                                 <p class="indent up">◯ テンプレートは縦横自由にご使用いただけます。</p>
  509.                                 <p class="indent up">◯ データ内にカットラインをご指定いただけますが、弊社にて製作に問題ないカットラインに調整させていただきますので、あくまでも目安程度にお考えください。</p>
  510.                                 <p class="indent up">◯ 最小カットラインサイズは縦横1cmまで基本的に可能です。形状が複雑すぎるデータは破れや折れの原因となるため、対応致しかねる場合もございます。</p>
  511.                                 <!-- // ** .one_box ** // -->
  512.                             </div>
  513.                         </dd>
  514.                         <!-- /// .design_note_box *** /// -->
  515.                         <!-- ☆☆ ONE DATA ☆☆ -->
  516.                         <dt class="up">
  517.                             <p class="design_num up">3</p>
  518.                             <h4 class="design_title up">塗り足しの注意!</h4>
  519.                         </dt>
  520.                         <dd class="design_note_box fades">
  521.                             <div class="one_box fades">
  522.                                 <p class="up">色ふちのあるデザインは必ず下図のように塗り足しを作成してください。</p>
  523.                                 <!-- // ** .one_box ** // -->
  524.                             </div>
  525.                             <div class="one_box fades">
  526.                                 <ul class="design_piclist fades ">
  527.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker06.png') }}" class="up"></li>
  528.                                 </ul>
  529.                                 <!-- // ** one_boxdesign_piclist ** // -->
  530.                                 <!-- // ** .one_box ** // -->
  531.                             </div>
  532.                         </dd>
  533.                         <!-- /// .design_note_box *** /// -->
  534.                         <!-- ☆☆ ONE DATA ☆☆ -->
  535.                         <dt class="up">
  536.                             <p class="design_num up">4</p>
  537.                             <h4 class="design_title up">カラーモードについて</h4>
  538.                         </dt>
  539.                         <dd class="design_note_box fades">
  540.                             <div class="one_box fades">
  541.                                 <ul class="design_piclist fades">
  542.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker07.png') }}" class="up"></li>
  543.                                 </ul>
  544.                                 <!-- // ** one_boxdesign_piclist ** // -->
  545.                                 <!-- // ** .one_box ** // -->
  546.                             </div>
  547.                             <div class="one_box fades">
  548.                                 <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  549.                                 <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>
  550.                                     ※特色対応不可</p>
  551.                                 <!-- // ** .one_box ** // -->
  552.                             </div>
  553.                         </dd>
  554.                         <!-- /// .design_note_box *** /// -->
  555.                         <!-- ☆☆ ONE DATA ☆☆ -->
  556.                         <dt class="up">
  557.                             <p class="design_num up">5</p>
  558.                             <h4 class="design_title up">リッチブラック推奨</h4>
  559.                         </dt>
  560.                             <div class="one_box fades">
  561.                                 <ul class="design_piclist style01 fades">
  562.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker08.png') }}" class="up"></li>
  563.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker09.png') }}" class="up"></li>
  564.                                 </ul>
  565.                                 <!-- // ** one_boxdesign_piclist ** // -->
  566.                                 <!-- // ** .one_box ** // -->
  567.                             </div>
  568.                             
  569.                         <dd class="design_note_box fades">
  570.                             <div class="one_box fades">
  571.                                 <p class="list_cap">デザイン中の黒色箇所はリッチブラックをご使用ください。</p>
  572.                                 <ul class="design_piclist style03 fades">
  573.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker10.png') }}" class="up">
  574.                                         <p>リッチブラック(推奨:C50% M50% Y50% K100%):スミベタより深い黒で印刷されます。【 オススメ 】</p>
  575.                                     </li>
  576.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker11.png') }}" class="up">
  577.                                         <p>スミベタ(K100%):ブラックのみで黒を印刷。全体的に薄い色乗りになります。</p>
  578.                                     </li>
  579.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker12.png') }}" class="up">
  580.                                         <p>4色ベタ(C100% M100% Y100% K100%):使用量が多すぎにじみやかすれなどが発生する為、使用不可です。</p>
  581.                                     </li>
  582.                                 </ul>
  583.                                 <!-- // ** one_boxdesign_piclist ** // -->
  584.                                 <!-- // ** .one_box ** // -->
  585.                             </div>
  586.                         </dd>
  587.                         <!-- /// .design_note_box *** /// -->
  588.                         <!-- ☆☆ ONE DATA ☆☆ -->
  589.                         <dt class="up">
  590.                             <p class="design_num up">6</p>
  591.                             <h4 class="design_title up">「シルバーステッカー」、「クリアーステッカー」、「ハーフクリアーステッカー」について</h4>
  592.                         </dt>
  593.                         <dd class="design_note_box fades">
  594.                             <div class="one_box fades">
  595.                                 <ul class="design_piclist fades ">
  596.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker13.png') }}" class="up"></li>
  597.                                 </ul>
  598.                                 <!-- // ** one_boxdesign_piclist ** // -->
  599.                                 <!-- // ** .one_box ** // -->
  600.                             </div>
  601.                             <div class="one_box fades">
  602.                                 <p class="indent up">◯ データ内、白色で指定されている箇所は すべてステッカーの下地の色で表現されます。色使いには十分ご注意ください。</p>
  603.                                 <p class="indent up">◯ CMYKカラーでの印刷となりますので、 シルバーステッカーやクリアーステッカーはデータ上で白で表現されている箇所は各紙種の下地の色で仕上がります。
  604.                                 </p>
  605.                                 <p class="indent up">◯ 他のステッカーとは異なり、ステッカーの素材の風合いを活かしたステッカーを製作いただけます。</p>
  606.                                 <p class="indent up">◯ またパステルカラーなど、濃度の薄い色味につきましては下地の色が強く出てしまう場合がございます。</p>
  607.                                 <p class="indent up">◯ 仕上がりの色味が気になる場合は、事前に少量で確認用にご依頼いただくことを推奨させていただきます。</p>
  608.                                 <!-- // ** .one_box ** // -->
  609.                             </div>
  610.                         </dd>
  611.                         <!-- /// .design_note_box *** /// -->
  612.                         <!-- ☆☆ ONE DATA ☆☆ -->
  613.                         <dt class="up">
  614.                             <p class="design_num up">7</p>
  615.                             <h4 class="design_title up">裏面モノクロ印刷</h4>
  616.                         </dt>
  617.                         <dd class="design_note_box fades">
  618.                             <div class="one_box fades">
  619.                                 <p class="list_cap">裏面印刷を行うことでこんなことができます</p>
  620.                                 <ul class="design_piclist fades style03">
  621.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker18.png') }}" class="up">
  622.                                         <p class="up">企業情報を載せて名刺がわりに使ったり</p>
  623.                                     </li>
  624.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker19.png') }}" class="up">
  625.                                         <p class="up">キャラクターのプロフィールを載せたり</p>
  626.                                     </li>
  627.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker20.png') }}" class="up">
  628.                                         <p class="up">イベントのクーポン券として使用したり</p>
  629.                                     </li>
  630.                                 </ul>
  631.                                 <!-- // ** one_boxdesign_piclist ** // -->
  632.                                 <!-- // ** .one_box ** // -->
  633.                             </div>
  634.                             <div class="one_box fades">
  635.                                 <h5 class="up sub_headline">デザイン方法</h5>
  636.                                 <p class="indent up">◯ 表面デザインデータご入稿後、当店にてカットラインを作成させていただきます。</p>
  637.                                 <p class="indent up">◯ 当店にて作成いたしましたカットラインデータを利用し、裏面デザインを作成ください。</p>
  638.                                 <aside class="caution_box fades" style="margin-top:1em;">
  639.                                     <div class="caution_inner">
  640.                                         <h5 class="caution_title up">ご注意</h5>
  641.                                         <p class="up indent">◯ ※通常より確認事項が増えますため、納期に余裕を持ってご入稿ください。</p>
  642.                                         <!-- // ** .caution_box ** // -->
  643.                                     </div>
  644.                                 </aside>
  645.                                 <!-- // ** .one_box ** // -->
  646.                             </div>
  647.                             <div class="one_box fades">
  648.                                 <h5 class="up sub_headline">データ入稿の流れ</h5>
  649.                                 <ul class="design_piclist fades">
  650.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker21.png') }}" class="up"></li>
  651.                                 </ul>
  652.                                 <ul class="design_piclist fades">
  653.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker22.png') }}" class="up"></li>
  654.                                 </ul>
  655.                                 <!-- // ** one_boxdesign_piclist ** // -->
  656.                                 <aside class="one_box caution_box fades">
  657.                                     <div class="caution_inner">
  658.                                         <h5 class="caution_title up">裏面データ作成上のご注意</h5>
  659.                                         <p class="up indent">◯ 色はK=100%の1Cにてデザインを行ってください。</p>
  660.                                         <p class="up indent">◯ カットラインより3mmほど内側にデザインを作成してください。</p>
  661.                                         <p class="up indent">◯ 裏面印刷は正確に同じ位置に合わせることが非常に難しいため、表面のデザインと裏面のデザインの印刷位置にズレが生じます。</p>
  662.                                         <p class="up indent">◯ デザインが3mmほどズレても問題のないデータ作成をお願いいたします。</p>
  663.                                         <p class="up indent">◯ なお、ズレに対する刷り直しは致しかねますのでご了承ください。</p>
  664.                                         <!-- // ** .caution_box ** // -->
  665.                                     </div>
  666.                                 </aside>
  667.                                 <!-- // ** .one_box ** // -->
  668.                             </div>
  669.                             <div class="one_box fades">
  670.                                 <h5 class="up sub_headline">剥離紙(裏紙)の色について</h5>
  671.                                 <ul class="design_piclist fades">
  672.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker23.png') }}" class="up"></li>
  673.                                 </ul>
  674.                                 <p class="list_cap">◯ デザイン上、白色の部分は、剥離紙の地色である「薄い黄色」または「白色」になります。</p>
  675.                                 <!-- // ** one_boxdesign_piclist ** // -->
  676.                                 <!-- // ** .one_box ** // -->
  677.                             </div>
  678.                         </dd>
  679.                         <!-- /// .design_note_box *** /// -->
  680.                         <!-- ☆☆ ONE DATA ☆☆ -->
  681.                         <dt class="up">
  682.                             <p class="design_num up">8</p>
  683.                             <h4 class="design_title up">屋外使用に適したステッカーについて</h4>
  684.                         </dt>
  685.                         <dd class="design_note_box fades">
  686.                             <div class="one_box fades">
  687.                                 <p class="indent up">◯ 弊社ではPET素材(ホワイトステッカー・弱粘着ステッカー・シルバーステッカー・クリアステッカー)に+ラミネート加工を施したステッカーをお勧めしております。</p>
  688.                                 <p class="indent up">◯ 上記4種類のステッカーはZEAMI Goodsの中でも耐久性・耐水性に優れたステッカーとなります。</p>
  689.                                 <p class="indent up">◯ また+ラミネート加工を施すことにより、さらに耐久性・耐水性をあげる事が可能です。</p>
  690.                                 <p class="indent up">◯ ただし、使用環境によってステッカーの劣化スピードは大幅に変わって参ります。</p>
  691.                                 <p class="indent up">◯ 実際の使用環境での耐久性・耐水性が気になる場合は、弊社にて各ステッカーのサンプルをご用意してしておりますので、事前にお試し頂けましたら幸いです。</p>
  692.                                 <!-- // ** .one_box ** // -->
  693.                             </div>
  694.                         </dd>
  695.                         <!-- /// .design_note_box *** /// -->
  696.                     </dl>
  697.                     <!-- //// .design_container **** //// -->
  698.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  699.                     <div class="bottom_notes_bloc fades">
  700.                         <aside class="one_box caution_box fades">
  701.                             <div class="caution_inner">
  702.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  703.                                 <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  704.                                 <p class="up indent">2. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  705.                                 <p class="up indent">3. デザインの周囲2mmほど外側にカットラインが来ますので、その余白ぶんを見越してデータを作成してください。</p>
  706.                                 <p class="up indent">4. 必要な場合は天地左右2㎜以上の塗り足しをつけてください。</p>
  707.                                 <p class="up indent">5. 塗り足しがある場合、塗り足しを含めたデザインを規格サイズ内に収めてください。</p>
  708.                                 <p class="up indent">6. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意下さい。</p>
  709.                                 <p class="up indent">7. お客様自身でカット位置を指定する場合はデザインデータ内にレイヤーを分けるか切り抜き線と分かるように指示を入れるようにしてください。指示を元に弊社にて、カットラインを製作致します。その場合デザインギリギリに設定するとズレなどで仕上がりにステッカーの下地が出手しまう場合もございます。</p>
  710.                                 <!-- // ** .caution_box ** // -->
  711.                             </div>
  712.                         </aside>
  713.                         <!-- //// .bottom_notes_bloc **** //// -->
  714.                     </div>
  715.                 </article>
  716.                 <!-- //// #Period02 ++++ //// -->
  717.                 <!-- ■■ Clip Studio ++ ■■ -->
  718.                 <article
  719.                     id="Period03" class="panel">
  720.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  721.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  722.                         <div id="title_twoLayout">
  723.                             <p class="title_cap up">入稿可能なデータ形式</p>
  724.                             <p class="indent section_note up">◯ psd形式</p>
  725.                             <p class="indent section_note up">◯ 推奨解像度:350dpi</p>
  726.                             <p class="indent section_note up">◯ カラーモード:CMYK</p>
  727.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  728.                         </div>
  729.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  730.                         <figure id="titlePic" class="two_layout download">
  731.                             <a href="/html/user_data/assets/template/Sticker_psd.zip" target="_blank">
  732.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  733.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  734.                             </a>
  735.                         </figure>
  736.                         <!-- //// ++++ #titlePic ++++ //// -->
  737.                         <!-- ///// #section_titleBloc +++++ ///// -->
  738.                     </div>
  739.                     <h3 class="section_title up">データの作成方法</h3>
  740.                     <dl
  741.                         class="design_container">
  742.                         <!-- ☆☆ ONE DATA ☆☆ -->
  743.                         <dt class="up">
  744.                             <p class="design_num up">1</p>
  745.                             <h4 class="design_title up">「ダイカットステッカー」と「ダイカット+ハーフカットステッカー」の違い</h4>
  746.                         </dt>
  747.                         <dd class="design_note_box">
  748.                             <div class="one_box fades">
  749.                                 <p class="up">それぞれデザイン内に指定できるカットラインの種類が違います。</p>
  750.                                 <!-- // ** .one_box ** // -->
  751.                             </div>
  752.                             <div class="one_box fades">
  753.                                 <h5 class="design_headline up">【ダイカットステッカー】</h5>
  754.                                 <p class="up">「「ダイカット」とはステッカー面と剥離紙を一緒に切り抜くカット方法です。<br>
  755.                                     カットラインはデザインに対してダイカット用ライン1つのみ制作となります。</p>
  756.                                 <!-- // ** .one_box ** // -->
  757.                             </div>
  758.                             <div class="one_box fades">
  759.                                 <h5 class="design_headline up">【ダイカット+ハーフカットステッカー】</h5>
  760.                                 <p class="up">デザインに対して「ダイカット」と「ハーフカット」、2種類のカットラインを使用してステッカーを製作します 。<br>
  761.                                     ステッカー面と剥離紙を一緒に裁ち落とす「ダイカット」に対し、「ハーフカット」は、剥離紙を残してステッカー面のみを切り抜くカット方法です。<br>
  762.                                     またカットラインはデザインに対して、1つのダイカット用ラインと、複数のハーフカット用ラインを制作する事が可能です。<br>
  763.                                     ハーフカットの外側にも背景としてデザインを行っていただけます。<br>
  764.                                     <!-- // ** .one_box ** // -->
  765.                                 </p>
  766.                             </div>
  767.                             <div class="one_box fades">
  768.                                 <ul class="design_piclist style01 fades">
  769.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker01.png') }}" class="up"></li>
  770.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker02.png') }}" class="up"></li>
  771.                                 </ul>
  772.                                 <!-- // ** one_boxdesign_piclist ** // -->
  773.                                 <!-- // ** .one_box ** // -->
  774.                             </div>
  775.                             <aside class="one_box caution_box fades">
  776.                                 <div class="caution_inner">
  777.                                     <h5 class="caution_title up">ダイカット+ハーフカット配置上の注意!</h5>
  778.                                     <p class="up">ハーフカットデザインを配置する際、隣り合うデザイン、または仕上がりの断ち切り位置から十分な余裕をもって配置してください。</p>
  779.                                     <figure class="caution_pic f_blur">
  780.                                         <img src="{{ asset('/html/user_data/assets/image/design_sticker03.png') }}">
  781.                                     </figure>
  782.                                     <!-- // .caution_pic ** // -->
  783.                                     <!-- // ** .caution_box ** // -->
  784.                                 </div>
  785.                             </aside>
  786.                         </dd>
  787.                         <!-- /// .design_note_box *** /// -->
  788.                         <!-- ☆☆ ONE DATA ☆☆ -->
  789.                         <dt class="up">
  790.                             <p class="design_num up">2</p>
  791.                             <h4 class="design_title up">デザインサイズ</h4>
  792.                         </dt>
  793.                         <dd class="design_note_box fades">
  794.                             <div class="one_box fades">
  795.                                 <ul class="design_piclist style02 fades">
  796.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker04.png') }}" class="up"></li>
  797.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker05.png') }}" class="up"></li>
  798.                                 </ul>
  799.                                 <!-- // ** one_boxdesign_piclist ** // -->
  800.                                 <!-- // ** .one_box ** // -->
  801.                             </div>
  802.                             <div class="one_box fades">
  803.                                 <p class="indent up">◯ 各ステッカーサイズ、範囲内で自由に制作してください。</p>
  804.                                 <p class="indent up">◯ データは必ず実寸大で制作してください。</p>
  805.                                 <p class="indent up">◯ テンプレートは縦横自由にご使用いただけます。</p>
  806.                                 <p class="indent up">◯ データ内にカットラインをご指定いただけますが、弊社にて製作に問題ないカットラインに調整させていただきますので、あくまでも目安程度にお考えください。</p>
  807.                                 <p class="indent up">◯ 最小カットラインサイズは縦横1cmまで基本的に可能です。形状が複雑すぎるデータは破れや折れの原因となるため、対応致しかねる場合もございます。</p>
  808.                                 <!-- // ** .one_box ** // -->
  809.                             </div>
  810.                         </dd>
  811.                         <!-- /// .design_note_box *** /// -->
  812.                         <!-- ☆☆ ONE DATA ☆☆ -->
  813.                         <dt class="up">
  814.                             <p class="design_num up">3</p>
  815.                             <h4 class="design_title up">塗り足しの注意!</h4>
  816.                         </dt>
  817.                         <dd class="design_note_box fades">
  818.                             <div class="one_box fades">
  819.                                 <p class="up">色ふちのあるデザインは必ず下図のように塗り足しを作成してください。</p>
  820.                                 <!-- // ** .one_box ** // -->
  821.                             </div>
  822.                             <div class="one_box fades">
  823.                                 <ul class="design_piclist fades ">
  824.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker06.png') }}" class="up"></li>
  825.                                 </ul>
  826.                                 <!-- // ** one_boxdesign_piclist ** // -->
  827.                                 <!-- // ** .one_box ** // -->
  828.                             </div>
  829.                         </dd>
  830.                         <!-- /// .design_note_box *** /// -->
  831.                         <!-- ☆☆ ONE DATA ☆☆ -->
  832.                         <dt class="up">
  833.                             <p class="design_num up">4</p>
  834.                             <h4 class="design_title up">カラーモードについて</h4>
  835.                         </dt>
  836.                         <dd class="design_note_box fades">
  837.                             <div class="one_box fades">
  838.                                 <ul class="design_piclist fades">
  839.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker07.png') }}" class="up"></li>
  840.                                 </ul>
  841.                                 <!-- // ** one_boxdesign_piclist ** // -->
  842.                                 <!-- // ** .one_box ** // -->
  843.                             </div>
  844.                             <div class="one_box fades">
  845.                                 <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  846.                                 <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>
  847.                                     ※特色対応不可</p>
  848.                                 <!-- // ** .one_box ** // -->
  849.                             </div>
  850.                         </dd>
  851.                         <!-- /// .design_note_box *** /// -->
  852.                         <!-- ☆☆ ONE DATA ☆☆ -->
  853.                         <dt class="up">
  854.                             <p class="design_num up">5</p>
  855.                             <h4 class="design_title up">リッチブラック推奨</h4>
  856.                         </dt>
  857.                         
  858.                             <div class="one_box fades">
  859.                                 <ul class="design_piclist style01 fades">
  860.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker08.png') }}" class="up"></li>
  861.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker09.png') }}" class="up"></li>
  862.                                 </ul>
  863.                                 <!-- // ** one_boxdesign_piclist ** // -->
  864.                                 <!-- // ** .one_box ** // -->
  865.                             </div>
  866.                             
  867.                         <dd class="design_note_box fades">
  868.                             <div class="one_box fades">
  869.                                 <p class="list_cap">デザイン中の黒色箇所はリッチブラックをご使用ください。</p>
  870.                                 <ul class="design_piclist style03 fades">
  871.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker10.png') }}" class="up">
  872.                                         <p>リッチブラック(推奨:C50% M50% Y50% K100%):スミベタより深い黒で印刷されます。【 オススメ 】</p>
  873.                                     </li>
  874.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker11.png') }}" class="up">
  875.                                         <p>スミベタ(K100%):ブラックのみで黒を印刷。全体的に薄い色乗りになります。</p>
  876.                                     </li>
  877.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker12.png') }}" class="up">
  878.                                         <p>4色ベタ(C100% M100% Y100% K100%):使用量が多すぎにじみやかすれなどが発生する為、使用不可です。</p>
  879.                                     </li>
  880.                                 </ul>
  881.                                 <!-- // ** one_boxdesign_piclist ** // -->
  882.                                 <!-- // ** .one_box ** // -->
  883.                             </div>
  884.                         </dd>
  885.                         <!-- /// .design_note_box *** /// -->
  886.                         <!-- ☆☆ ONE DATA ☆☆ -->
  887.                         <dt class="up">
  888.                             <p class="design_num up">6</p>
  889.                             <h4 class="design_title up">「シルバーステッカー」、「クリアーステッカー」、「ハーフクリアーステッカー」について</h4>
  890.                         </dt>
  891.                         <dd class="design_note_box fades">
  892.                             <div class="one_box fades">
  893.                                 <ul class="design_piclist fades ">
  894.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker13.png') }}" class="up"></li>
  895.                                 </ul>
  896.                                 <!-- // ** one_boxdesign_piclist ** // -->
  897.                                 <!-- // ** .one_box ** // -->
  898.                             </div>
  899.                             <div class="one_box fades">
  900.                                 <p class="indent up">◯ データ内、白色で指定されている箇所は すべてステッカーの下地の色で表現されます。色使いには十分ご注意ください。</p>
  901.                                 <p class="indent up">◯ CMYKカラーでの印刷となりますので、 シルバーステッカーやクリアーステッカーはデータ上で白で表現されている箇所は各紙種の下地の色で仕上がります。
  902.                                 </p>
  903.                                 <p class="indent up">◯ 他のステッカーとは異なり、ステッカーの素材の風合いを活かしたステッカーを製作いただけます。</p>
  904.                                 <p class="indent up">◯ またパステルカラーなど、濃度の薄い色味につきましては下地の色が強く出てしまう場合がございます。</p>
  905.                                 <p class="indent up">◯ 仕上がりの色味が気になる場合は、事前に少量で確認用にご依頼いただくことを推奨させていただきます。</p>
  906.                                 <!-- // ** .one_box ** // -->
  907.                             </div>
  908.                         </dd>
  909.                         <!-- /// .design_note_box *** /// -->
  910.                         <!-- ☆☆ ONE DATA ☆☆ -->
  911.                         <dt class="up">
  912.                             <p class="design_num up">7</p>
  913.                             <h4 class="design_title up">裏面モノクロ印刷</h4>
  914.                         </dt>
  915.                         <dd class="design_note_box fades">
  916.                             <div class="one_box fades">
  917.                                 <p class="list_cap">裏面印刷を行うことでこんなことができます</p>
  918.                                 <ul class="design_piclist fades style03">
  919.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker18.png') }}" class="up">
  920.                                         <p class="up">企業情報を載せて名刺がわりに使ったり</p>
  921.                                     </li>
  922.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker19.png') }}" class="up">
  923.                                         <p class="up">キャラクターのプロフィールを載せたり</p>
  924.                                     </li>
  925.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker20.png') }}" class="up">
  926.                                         <p class="up">イベントのクーポン券として使用したり</p>
  927.                                     </li>
  928.                                 </ul>
  929.                                 <!-- // ** one_boxdesign_piclist ** // -->
  930.                                 <!-- // ** .one_box ** // -->
  931.                             </div>
  932.                             <div class="one_box fades">
  933.                                 <h5 class="up sub_headline">デザイン方法</h5>
  934.                                 <p class="indent up">◯ 表面デザインデータご入稿後、当店にてカットラインを作成させていただきます。</p>
  935.                                 <p class="indent up">◯ 当店にて作成いたしましたカットラインデータを利用し、裏面デザインを作成ください。</p>
  936.                                 <aside class="caution_box fades" style="margin-top:1em;">
  937.                                     <div class="caution_inner">
  938.                                         <h5 class="caution_title up">ご注意</h5>
  939.                                         <p class="up indent">◯ ※通常より確認事項が増えますため、納期に余裕を持ってご入稿ください。</p>
  940.                                         <!-- // ** .caution_box ** // -->
  941.                                     </div>
  942.                                 </aside>
  943.                                 <!-- // ** .one_box ** // -->
  944.                             </div>
  945.                             <div class="one_box fades">
  946.                                 <h5 class="up sub_headline">データ入稿の流れ</h5>
  947.                                 <ul class="design_piclist fades">
  948.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker21.png') }}" class="up"></li>
  949.                                 </ul>
  950.                                 <ul class="design_piclist fades">
  951.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker22.png') }}" class="up"></li>
  952.                                 </ul>
  953.                                 <!-- // ** one_boxdesign_piclist ** // -->
  954.                                 <aside class="one_box caution_box fades">
  955.                                     <div class="caution_inner">
  956.                                         <h5 class="caution_title up">裏面データ作成上のご注意</h5>
  957.                                         <p class="up indent">◯ 色はK=100%の1Cにてデザインを行ってください。</p>
  958.                                         <p class="up indent">◯ カットラインより3mmほど内側にデザインを作成してください。</p>
  959.                                         <p class="up indent">◯ 裏面印刷は正確に同じ位置に合わせることが非常に難しいため、表面のデザインと裏面のデザインの印刷位置にズレが生じます。</p>
  960.                                         <p class="up indent">◯ デザインが3mmほどズレても問題のないデータ作成をお願いいたします。</p>
  961.                                         <p class="up indent">◯ なお、ズレに対する刷り直しは致しかねますのでご了承ください。</p>
  962.                                         <!-- // ** .caution_box ** // -->
  963.                                     </div>
  964.                                 </aside>
  965.                                 <!-- // ** .one_box ** // -->
  966.                             </div>
  967.                             <div class="one_box fades">
  968.                                 <h5 class="up sub_headline">剥離紙(裏紙)の色について</h5>
  969.                                 <ul class="design_piclist fades">
  970.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker23.png') }}" class="up"></li>
  971.                                 </ul>
  972.                                 <p class="list_cap">◯ デザイン上、白色の部分は、剥離紙の地色である「薄い黄色」または「白色」になります。</p>
  973.                                 <!-- // ** one_boxdesign_piclist ** // -->
  974.                                 <!-- // ** .one_box ** // -->
  975.                             </div>
  976.                         </dd>
  977.                         <!-- /// .design_note_box *** /// -->
  978.                         <!-- ☆☆ ONE DATA ☆☆ -->
  979.                         <dt class="up">
  980.                             <p class="design_num up">8</p>
  981.                             <h4 class="design_title up">屋外使用に適したステッカーについて</h4>
  982.                         </dt>
  983.                         <dd class="design_note_box fades">
  984.                             <div class="one_box fades">
  985.                                 <p class="indent up">◯ 弊社ではPET素材(ホワイトステッカー・弱粘着ステッカー・シルバーステッカー・クリアステッカー)に+ラミネート加工を施したステッカーをお勧めしております。</p>
  986.                                 <p class="indent up">◯ 上記4種類のステッカーはZEAMI Goodsの中でも耐久性・耐水性に優れたステッカーとなります。</p>
  987.                                 <p class="indent up">◯ また+ラミネート加工を施すことにより、さらに耐久性・耐水性をあげる事が可能です。</p>
  988.                                 <p class="indent up">◯ ただし、使用環境によってステッカーの劣化スピードは大幅に変わって参ります。</p>
  989.                                 <p class="indent up">◯ 実際の使用環境での耐久性・耐水性が気になる場合は、弊社にて各ステッカーのサンプルをご用意してしておりますので、事前にお試し頂けましたら幸いです。</p>
  990.                                 <!-- // ** .one_box ** // -->
  991.                             </div>
  992.                         </dd>
  993.                         <!-- /// .design_note_box *** /// -->
  994.                     </dl>
  995.                     <!-- //// .design_container **** //// -->
  996.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  997.                     <div class="bottom_notes_bloc fades">
  998.                         <aside class="one_box caution_box fades">
  999.                             <div class="caution_inner">
  1000.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  1001.                                 <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  1002.                                 <p class="up indent">2. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  1003.                                 <p class="up indent">3. デザインの周囲2mmほど外側にカットラインが来ますので、その余白ぶんを見越してデータを作成してください。</p>
  1004.                                 <p class="up indent">4. 必要な場合は天地左右2㎜以上の塗り足しをつけてください。</p>
  1005.                                 <p class="up indent">5. 塗り足しがある場合、塗り足しを含めたデザインを規格サイズ内に収めてください。</p>
  1006.                                 <p class="up indent">6. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意下さい。</p>
  1007.                                 <p class="up indent">7. お客様自身でカット位置を指定する場合はデザインデータ内にレイヤーを分けるか切り抜き線と分かるように指示を入れるようにしてください。指示を元に弊社にて、カットラインを製作致します。その場合デザインギリギリに設定するとズレなどで仕上がりにステッカーの下地が出手しまう場合もございます。</p>
  1008.                                 <!-- // ** .caution_box ** // -->
  1009.                             </div>
  1010.                         </aside>
  1011.                         <!-- //// .bottom_notes_bloc **** //// -->
  1012.                     </div>
  1013.                 </article>
  1014.                 <!-- //// #Period03 ++++ //// -->
  1015.                 <!-- ■■ その他 ++ ■■ -->
  1016.                 <article
  1017.                     id="Period04" class="panel">
  1018.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  1019.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  1020.                         <div id="title_twoLayout">
  1021.                             <p class="title_cap up">入稿可能なデータ形式</p>
  1022.                             <p class="indent section_note up">◯ jpg形式, png形式, gif形式, pdf形式</p>
  1023.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  1024.                         </div>
  1025.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  1026.                         <!--
  1027.                         <figure id="titlePic" class="two_layout download">
  1028.                             <a href="#" target="_blank">
  1029.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  1030.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  1031.                             </a>
  1032.                         </figure>-->
  1033.                         <!-- //// ++++ #titlePic ++++ //// -->
  1034.                         <!-- ///// #section_titleBloc +++++ ///// -->
  1035.                     </div>
  1036.                     <h3 class="section_title up">データの作成方法</h3>
  1037.                     <dl class="design_container">
  1038.                         
  1039.                         <dd class="design_note_box fades">
  1040.                             <div class="one_box fades">
  1041.                                 <p class="up">下図のように背景を広めにとり、できるだけ大きく作成してください。当店で適切なサイズに縮小します。</p>
  1042.                                 <!-- // ** .one_box ** // -->
  1043.                             </div>
  1044.                             <div class="one_box fades">
  1045.                                 <ul class="design_piclist fades ">
  1046.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker24.jpg') }}" class="up"></li>
  1047.                                 </ul>
  1048.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1049.                                 <!-- // ** .one_box ** // -->
  1050.                             </div>
  1051.                         </dd>
  1052.                     </dl>
  1053.                     
  1054.                     
  1055.                     <h3 class="section_title up">カラーモードをRGBでデータを製作された場合のご注意</h3>
  1056.                     <dl class="design_container">
  1057.                         
  1058.                         <dd class="design_note_box fades">
  1059.                             <div class="one_box fades">
  1060.                                 <p class="up">CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。</p>
  1061.                                 <!-- // ** .one_box ** // -->
  1062.                             </div>
  1063.                             <div class="one_box fades">
  1064.                                 <ul class="design_piclist fades ">
  1065.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker07.png') }}" class="up"></li>
  1066.                                 </ul>
  1067.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1068.                                 <!-- // ** .one_box ** // -->
  1069.                             </div>
  1070.                         </dd>
  1071.                     </dl>
  1072.                     <!-- //// .design_container **** //// -->
  1073.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  1074.                     <div class="bottom_notes_bloc fades">
  1075.                         <aside class="one_box caution_box fades">
  1076.                             <div class="caution_inner">
  1077.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  1078.                                 <p class="up indent">1. 保存形式:jpg、png、gif、pdf</p>
  1079.                                 <p class="up indent">2. ファイル保存名/フォルダ保存名:半角英数のみ</p>
  1080.                                 <p class="up indent">3. カラーモード:CMYK</p>
  1081.                                 <p class="up indent">4. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  1082.                                 <!-- // ** .caution_box ** // -->
  1083.                             </div>
  1084.                         </aside>
  1085.                         <!-- //// .bottom_notes_bloc **** //// -->
  1086.                     </div>
  1087.                 </article>
  1088.                 <!-- //// #Period04 ++++ //// -->
  1089.                 <!-- ■■ シミュレーター ++ ■■ -->
  1090.                 <article
  1091.                     id="Period05" class="panel">
  1092.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  1093.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  1094.                         <div id="title_twoLayout">
  1095.                             <p class="title_cap up">入稿可能なデータ形式</p>
  1096.                             <p class="indent section_note up">◯ PNG(背景透過)</p>
  1097.                         </div>
  1098.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  1099.                         <!-- //// ++++ #titlePic ++++ //// -->
  1100.                         <!-- ///// #section_titleBloc +++++ ///// -->
  1101.                     </div>
  1102.                     <h3 class="section_title up">データの作成方法</h3>
  1103.                     <dl
  1104.                         class="design_container">
  1105.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1106.                         <dt class="up">
  1107.                             <p class="design_num up">1</p>
  1108.                             <h4 class="design_title up">画像を準備</h4>
  1109.                         </dt>
  1110.                         <dd class="design_note_box">
  1111.                             <div class="one_box fades">
  1112.                                 <p class="up">ファイル形式:PNG</p>
  1113.                                 <p class="up">背景は透過してください</p>
  1114.                                 <!-- // ** .one_box ** // -->
  1115.                             </div>
  1116.                             <div class="one_box fades">
  1117.                                 <ul class="design_piclist fades">
  1118.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim25.png') }}" class="up"></li>
  1119.                                 </ul>
  1120.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1121.                                 <!-- // ** .one_box ** // -->
  1122.                             </div>
  1123.                             <p class="up">※JPGファイルの場合、デザインに沿った形状ではなくJPGの外周に沿った四角形での仕上がりになります</p>
  1124.                         </dd>
  1125.                         <!-- /// .design_note_box *** /// -->
  1126.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1127.                         <dt class="up">
  1128.                             <p class="design_num up">2</p>
  1129.                             <h4 class="design_title up">シミュレーターを起動</h4>
  1130.                         </dt>
  1131.                         <dd class="design_note_box fades">
  1132.                             <div class="one_box fades">
  1133.                                 <ul class="design_piclist fades">
  1134.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim26.png') }}" class="up"></li>
  1135.                                 </ul>
  1136.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1137.                                 <!-- // ** .one_box ** // -->
  1138.                             </div>
  1139.                         </dd>
  1140.                         <!-- /// .design_note_box *** /// -->
  1141.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1142.                         <dt class="up">
  1143.                             <p class="design_num up">3</p>
  1144.                             <h4 class="design_title up">デザインファイルを選択</h4>
  1145.                         </dt>
  1146.                         <dd class="design_note_box fades">
  1147.                             <div class="one_box fades">
  1148.                                 <p class="up">【 写真追加 】をクリックし、予め用意したPNG画像を選択
  1149. 選択した写真が右側に表示されるので「クリップなし」「円形クリップ」「方形クリップ」や「左回転」「右回転」で編集を行い、完成次第右上の【 決定 】を選択します</p>
  1150.                                 <!-- // ** .one_box ** // -->
  1151.                             </div>
  1152.                             <div class="one_box fades">
  1153.                                 <ul class="design_piclist fades ">
  1154.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim27.png') }}" class="up"></li>
  1155.                                 </ul>
  1156.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1157.                                 <!-- // ** .one_box ** // -->
  1158.                             </div>
  1159.                         </dd>
  1160.                         <!-- /// .design_note_box *** /// -->
  1161.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1162.                         <dt class="up">
  1163.                             <p class="design_num up">4</p>
  1164.                             <h4 class="design_title up">デザイン</h4>
  1165.                         </dt>
  1166.                         <dd class="design_note_box fades">
  1167.                             <div class="one_box fades">
  1168.                                 <p class="up">選択した画像がテンプレート内に表示されるので、【 拡大 】【 縮小 】ボタンや、右下の【 緑色矢印 】にて拡大縮小や、ドラッグにてデザイン位置の微調整を行います。
  1169. アクリルキーホルダーの場合は、デザインにリングが沿うように配置してください。</p>
  1170.                                 <!-- // ** .one_box ** // -->
  1171.                             </div>
  1172.                             <div class="one_box fades">
  1173.                                 <ul class="design_piclist fades">
  1174.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim28.png') }}" class="up"></li>
  1175.                                 </ul>
  1176.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1177.                                 <!-- // ** .one_box ** // -->
  1178.                             </div>
  1179.                             <div class="one_box fades">
  1180.                                 <p class="up">リングの位置を変更したい場合は、【 カラー変更 】にてリング位置を選択してください。</p>
  1181.                                 <p class="up">編集が完了したら左上の【 戻る 】をクリック。</p>
  1182.                                 <!-- // ** .one_box ** // -->
  1183.                             </div>
  1184.                                 <!-- // ** .one_box ** // -->
  1185.                         </dd>
  1186.                         <!-- /// .design_note_box *** /// -->
  1187.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1188.                         <dt class="up">
  1189.                             <p class="design_num up">5</p>
  1190.                             <h4 class="design_title up">デザイン詳細</h4>
  1191.                         </dt>
  1192.                         <dd class="design_note_box fades">
  1193.                            <div class="one_box fades">
  1194.                                 <p class="indent up">【プレビュー】を押すと仕上がりイメージをご確認いただけます。</p>
  1195.                                 <p class="indent up">※カットラインは弊社にて微調整させていただく場合がございます。</p>
  1196.                                 <!-- // ** .one_box ** // -->
  1197.                             </div>
  1198.                             
  1199.                             <div class="one_box fades">
  1200.                                 <ul class="design_piclist fades">
  1201.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim29.png') }}" class="up"></li>
  1202.                                 </ul>
  1203.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1204.                                 <!-- // ** .one_box ** // -->
  1205.                             </div>
  1206.                         </dd>
  1207.                         <!-- /// .design_note_box *** /// -->
  1208.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1209.                         <dt class="up">
  1210.                             <p class="design_num up">6</p>
  1211.                             <h4 class="design_title up">デザイン終了</h4>
  1212.                         </dt>
  1213.             
  1214.                         <dd class="design_note_box fades">
  1215.                             <div class="one_box fades">
  1216.                                 <p class="indent up">デザイン完成後、右上の【 カートボタン 】を押してください。</p>
  1217.                                 <p class="indent up">「購入ページへ移動します」【 はい 】を選択します。</p>
  1218.                                 <!-- // ** .one_box ** // -->
  1219.                             </div>
  1220.                             <div class="one_box fades">
  1221.                                 <ul class="design_piclist fades ">
  1222.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim30.png') }}" class="up"></li>
  1223.                                 </ul>
  1224.                                 <!-- // ** one_boxdesign_piclist ** // -->
  1225.                                 <!-- // ** .one_box ** // -->
  1226.                             </div>
  1227.                         </dd>
  1228.                         <!-- /// .design_note_box *** /// -->
  1229.                         <!-- ☆☆ ONE DATA ☆☆ -->
  1230.                         <!-- /// .design_note_box *** /// -->
  1231.                     </dl>
  1232.                     <!-- //// .design_container **** //// -->
  1233.                         <!-- /// .design_note_box *** /// -->
  1234.                 </article>
  1235.                 <!-- //// #Period05 ++++ //// -->
  1236.                 <!-- //// ++++ #informationContainer ++++ //// -->
  1237.             </div>
  1238.         </section>
  1239.         <!-- ///// +++++ #Design +++++ ///// -->
  1240.         <!-- ///// +++++ #mainContents +++++ ///// -->
  1241.     </main>
  1242. {% endblock %}