app/template/user_data/keyholder-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/AcrylicKeyholder_AcrylicStand_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">キーホルダー穴は、テンプレートのデータを必ずご使用ください。またイラストの周囲から、最低2mmは間隔を開けて下さい。</p>
  95.                                 <!-- // ** .one_box ** // -->
  96.                             </div>
  97.                             <div class="one_box fades">
  98.                                 <ul class="design_piclist fades">
  99.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey01.png') }}" class="up"></li>
  100.                                 </ul>
  101.                                 <!-- // ** one_boxdesign_piclist ** // -->
  102.                                 <!-- // ** .one_box ** // -->
  103.                             </div>
  104.                         </dd>
  105.                         <!-- /// .design_note_box *** /// -->
  106.                         <!-- ☆☆ ONE DATA ☆☆ -->
  107.                         <dt class="up">
  108.                             <p class="design_num up">2</p>
  109.                             <h4 class="design_title up">デザインサイズ</h4>
  110.                         </dt>
  111.                         <dd class="design_note_box fades">
  112.                             <div class="one_box fades">
  113.                                 <ul class="design_piclist fades">
  114.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey02.png') }}" class="up"></li>
  115.                                 </ul>
  116.                                 <!-- // ** one_boxdesign_piclist ** // -->
  117.                                 <!-- // ** .one_box ** // -->
  118.                             </div>
  119.                             <div class="one_box fades">
  120.                                 <p class="indent up">◯ 各サイズ、範囲内で自由に制作してください。</p>
  121.                                 <p class="indent up">◯ データは必ず実寸大で制作してください。</p>
  122.                                 <p class="indent up">◯ テンプレートは縦横自由にご使用いただけますがパッケージは縦長固定です。</p>
  123.                                 <p class="indent up">◯ データ内にカットラインをご指定いただけますが、弊社にて製作に問題ないカットラインに調整させていただきますので、あくまでも目安程度にお考えください。</p>
  124.                                 <p class="indent up">◯ 最小カットラインサイズは縦横1cmまで基本的に可能です。形状が複雑すぎるデータは破れや折れの原因となるため、対応致しかねる場合もございます。</p>
  125.                                 <!-- // ** .one_box ** // -->
  126.                             </div>
  127.                         </dd>
  128.                         <!-- /// .design_note_box *** /// -->
  129.                         <!-- ☆☆ ONE DATA ☆☆ -->
  130.                         <dt class="up">
  131.                             <p class="design_num up">3</p>
  132.                             <h4 class="design_title up">カットラインについて</h4>
  133.                         </dt>
  134.                         <dd class="design_note_box fades">
  135.                             <div class="one_box fades">
  136.                                 <ul class="design_piclist fades">
  137.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey03.png') }}" class="up"></li>
  138.                                 </ul>
  139.                                 <!-- // ** one_boxdesign_piclist ** // -->
  140.                                 <!-- // ** .one_box ** // -->
  141.                             </div>
  142.                             <div class="one_box fades">
  143.                                 <p class="indent up">◯ 位置指定がある場合は、イラストの周囲に最低でも2mmの余白を設けてください。特にご希望がない場合、カットラインの作成は弊社で行います。</p>
  144.                                 <p class="indent up">◯ 安全上・品質上の理由により、鋭利に飛び出す加工や鋭利に内側にえぐる加工はできません。</p>
  145.                                 <!-- // ** .one_box ** // -->
  146.                             </div>
  147.                         </dd>
  148.                         <!-- /// .design_note_box *** /// -->
  149.                         <!-- ☆☆ ONE DATA ☆☆ -->
  150.                         <dt class="up">
  151.                             <p class="design_num up">4</p>
  152.                             <h4 class="design_title up">カラーモードについて</h4>
  153.                         </dt>
  154.                         <dd class="design_note_box fades">
  155.                             <div class="one_box fades">
  156.                                 <ul class="design_piclist fades">
  157.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey04.png') }}" class="up"></li>
  158.                                 </ul>
  159.                                 <!-- // ** one_boxdesign_piclist ** // -->
  160.                                 <!-- // ** .one_box ** // -->
  161.                             </div>
  162.                             <div class="one_box fades">
  163.                                 <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  164.                                 <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>
  165.                                     ※特色対応不可</p>
  166.                                 <!-- // ** .one_box ** // -->
  167.                             </div>
  168.                         </dd>
  169.                         <!-- /// .design_note_box *** /// -->
  170.                         <!-- ☆☆ ONE DATA ☆☆ -->
  171.                         <dt class="up">
  172.                             <p class="design_num up">5</p>
  173.                             <h4 class="design_title up">白色印刷について</h4>
  174.                         </dt>
  175.                         <dd class="design_note_box fades">
  176.                             <div class="one_box fades">
  177.                                 <ul class="design_piclist fades ">
  178.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey05.png') }}" class="up"></li>
  179.                                 </ul>
  180.                                 <!-- // ** one_boxdesign_piclist ** // -->
  181.                                 <!-- // ** .one_box ** // -->
  182.                             </div>
  183.                             <div class="one_box fades">
  184.                                 <p class="indent up">◯ Illustratorのパスデータで作成を行ってください。</p>
  185.                                 <p class="indent up">◯ はみ出し防止のため、デザインに対して、0.1mmほど内側に小さく作成してください。</p>
  186.                                 <p class="indent up">◯ ベタ面で色をK=100%にして作成し、デザインとはレイヤーをわけてください。</p>
  187.                                 <!-- // ** .one_box ** // -->
  188.                             </div>
  189.                             <div class="one_box fades">
  190.                                 <ul class="design_piclist fades style02">
  191.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey06.png') }}" class="up"></li>
  192.                                     <li>
  193.                                         <p class="up indent">◯ 透明アクリルにCMYKフルカラー印刷を行った場合、薄色は光が透過し見えづらくなります。そこでCMYKフルカラー印刷の下に白色印刷を行うことで発色の視認性を高めることが可能です。部分的にあえて白色印刷を行わないことで、きらびやかさを表現することもできます。</p>
  194.                                     </li>
  195.                                 </ul>
  196.                                 <!-- // ** one_boxdesign_piclist ** // -->
  197.                                 <!-- // ** .one_box ** // -->
  198.                             </div>
  199.                         </dd>
  200.                         <!-- /// .design_note_box *** /// -->
  201.                         <!-- ☆☆ ONE DATA ☆☆ -->
  202.                         <dt class="up">
  203.                             <p class="design_num up">6</p>
  204.                             <h4 class="design_title up">レイヤーの構造について</h4>
  205.                         </dt>
  206.                         <dd class="design_note_box">
  207.                             <div class="one_box fades">
  208.                                 <p class="up">カットライン・デザイン・白色印刷・(オプションにて両面印刷をセレクトした場合)のデータは、必ずレイヤーを分けて入稿してください。</p>
  209.                                 <!-- // ** .one_box ** // -->
  210.                             </div>
  211.                             <div class="one_box fades">
  212.                                 <ul class="design_piclist fades">
  213.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey07.png') }}" class="up"></li>
  214.                                 </ul>
  215.                                 <!-- // ** one_boxdesign_piclist ** // -->
  216.                                 <!-- // ** .one_box ** // -->
  217.                             </div>
  218.                         </dd>
  219.                         <!-- /// .design_note_box *** /// -->
  220.                         <!-- ☆☆ ONE DATA ☆☆ -->
  221.                         <dt class="up">
  222.                             <p class="design_num up">7</p>
  223.                             <h4 class="design_title up">裏面印刷について</h4>
  224.                         </dt>
  225.                         <dd class="design_note_box fades">
  226.                             <div class="one_box fades">
  227.                                 <p class="list_cap">裏面印刷はオプションです<br>裏面デザインは、印刷時、反転しての印刷になりますので、入稿時はレイヤー内で反転してください。</p>
  228.                                 <!-- // ** .one_box ** // -->
  229.                             </div>
  230.                             <div class="one_box fades">
  231.                                 <ul class="design_piclist fades style02">
  232.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey08.png') }}" class="up"></li>
  233.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey09.png') }}" class="up"></li>
  234.                                 </ul>
  235.                                 <!-- // ** one_boxdesign_piclist ** // -->
  236.                                 <!-- // ** .one_box ** // -->
  237.                             </div>
  238.                         </dd>
  239.                         <!-- /// .design_note_box *** /// -->
  240.                     </dl>
  241.                     <!-- //// .design_container **** //// -->
  242.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  243.                     <div class="bottom_notes_bloc fades">
  244.                         <aside class="one_box caution_box fades">
  245.                             <div class="caution_inner">
  246.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  247.                                 <p class="up indent">1. 文字は必ずアウトライン化してください。</p>
  248.                                 <p class="up indent">2. デザインが複数ある場合、同一アートボードに全て並べて配置し、1ファイルにまとめてご入稿ください。</p>
  249.                                 <p class="up indent">3. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  250.                                 <p class="up indent">4. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  251.                                 <p class="up indent">5. 配置画像データの解像度は350dpi以上を推奨させていただいています。</p>
  252.                                 <p class="up indent">6. 配置画像の解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  253.                                 <p class="up indent">7. 保存の際にICCプロファイルを埋め込まないでください。</p>
  254.                                 <p class="up indent">8. スタイライズ(ドロップシャドウやぼかしなど)をご使用の場合は、粗く印刷される場合がございます。Photoshop等にて画像化したものをご入稿いただくことを推奨とさせていただきます。</p>
  255.                                 <!-- // ** .caution_box ** // -->
  256.                             </div>
  257.                         </aside>
  258.                         <!-- //// .bottom_notes_bloc **** //// -->
  259.                     </div>
  260.                 </article>
  261.                 <!-- //// #Period01 ++++ //// -->
  262.                 <!-- ■■ Photoshop ++ ■■ -->
  263.                 <article
  264.                     id="Period02" class="panel">
  265.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  266.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  267.                         <div id="title_twoLayout">
  268.                             <p class="title_cap up">入稿可能なデータ形式</p>
  269.                             <p class="indent section_note up">◯ Adobe Photoshop psd形式(全バージョン対応)</p>
  270.                             <p class="indent section_note up">◯ 推奨解像度:350dpi</p>
  271.                             <p class="indent section_note up">◯ カラーモード:CMYK</p>
  272.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  273.                         </div>
  274.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  275.                         <figure id="titlePic" class="two_layout download">
  276.                             <a href="/html/user_data/assets/template/AcrylicKeyholder_AcrylicStand_psd.zip" target="_blank">
  277.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  278.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  279.                             </a>
  280.                         </figure>
  281.                         <!-- //// ++++ #titlePic ++++ //// -->
  282.                         <!-- ///// #section_titleBloc +++++ ///// -->
  283.                     </div>
  284.                     <h3 class="section_title up">データの作成方法</h3>
  285.                     <dl
  286.                         class="design_container">
  287.                         <!-- ☆☆ ONE DATA ☆☆ -->
  288.                         <dt class="up">
  289.                             <p class="design_num up">1</p>
  290.                             <h4 class="design_title up">キーホルダー穴について</h4>
  291.                         </dt>
  292.                         <dd class="design_note_box">
  293.                             <div class="one_box fades">
  294.                                 <p class="up">キーホルダー穴は、テンプレートのデータを必ずご使用ください。またイラストの周囲から、最低2mmは間隔を開けて下さい。</p>
  295.                                 <!-- // ** .one_box ** // -->
  296.                             </div>
  297.                             <div class="one_box fades">
  298.                                 <ul class="design_piclist fades">
  299.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey01.png') }}" class="up"></li>
  300.                                 </ul>
  301.                                 <!-- // ** one_boxdesign_piclist ** // -->
  302.                                 <!-- // ** .one_box ** // -->
  303.                             </div>
  304.                         </dd>
  305.                         <!-- /// .design_note_box *** /// -->
  306.                         <!-- ☆☆ ONE DATA ☆☆ -->
  307.                         <dt class="up">
  308.                             <p class="design_num up">2</p>
  309.                             <h4 class="design_title up">デザインサイズ</h4>
  310.                         </dt>
  311.                         <dd class="design_note_box fades">
  312.                             <div class="one_box fades">
  313.                                 <ul class="design_piclist fades">
  314.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey02.png') }}" class="up"></li>
  315.                                 </ul>
  316.                                 <!-- // ** one_boxdesign_piclist ** // -->
  317.                                 <!-- // ** .one_box ** // -->
  318.                             </div>
  319.                             <div class="one_box fades">
  320.                                 <p class="indent up">◯ 各サイズ、範囲内で自由に制作してください。</p>
  321.                                 <p class="indent up">◯ データは必ず実寸大で制作してください。</p>
  322.                                 <p class="indent up">◯ テンプレートは縦横自由にご使用いただけますがパッケージは縦長固定です。</p>
  323.                                 <p class="indent up">◯ データ内にカットラインをご指定いただけますが、弊社にて製作に問題ないカットラインに調整させていただきますので、あくまでも目安程度にお考えください。</p>
  324.                                 <p class="indent up">◯ 最小カットラインサイズは縦横1cmまで基本的に可能です。形状が複雑すぎるデータは破れや折れの原因となるため、対応致しかねる場合もございます。</p>
  325.                                 <!-- // ** .one_box ** // -->
  326.                             </div>
  327.                         </dd>
  328.                         <!-- /// .design_note_box *** /// -->
  329.                         <!-- ☆☆ ONE DATA ☆☆ -->
  330.                         <dt class="up">
  331.                             <p class="design_num up">3</p>
  332.                             <h4 class="design_title up">カットラインについて</h4>
  333.                         </dt>
  334.                         <dd class="design_note_box fades">
  335.                             <div class="one_box fades">
  336.                                 <ul class="design_piclist fades">
  337.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey03.png') }}" class="up"></li>
  338.                                 </ul>
  339.                                 <!-- // ** one_boxdesign_piclist ** // -->
  340.                                 <!-- // ** .one_box ** // -->
  341.                             </div>
  342.                             <div class="one_box fades">
  343.                                 <p class="indent up">◯ 位置指定がある場合は、イラストの周囲に最低でも2mmの余白を設けてください。特にご希望がない場合、カットラインの作成は弊社で行います。</p>
  344.                                 <p class="indent up">◯ 安全上・品質上の理由により、鋭利に飛び出す加工や鋭利に内側にえぐる加工はできません。</p>
  345.                                 <!-- // ** .one_box ** // -->
  346.                             </div>
  347.                         </dd>
  348.                         <!-- /// .design_note_box *** /// -->
  349.                         <!-- ☆☆ ONE DATA ☆☆ -->
  350.                         <dt class="up">
  351.                             <p class="design_num up">4</p>
  352.                             <h4 class="design_title up">カラーモードについて</h4>
  353.                         </dt>
  354.                         <dd class="design_note_box fades">
  355.                             <div class="one_box fades">
  356.                                 <ul class="design_piclist fades">
  357.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey04.png') }}" class="up"></li>
  358.                                 </ul>
  359.                                 <!-- // ** one_boxdesign_piclist ** // -->
  360.                                 <!-- // ** .one_box ** // -->
  361.                             </div>
  362.                             <div class="one_box fades">
  363.                                 <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  364.                                 <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>
  365.                                     ※特色対応不可</p>
  366.                                 <!-- // ** .one_box ** // -->
  367.                             </div>
  368.                         </dd>
  369.                         <!-- /// .design_note_box *** /// -->
  370.                         <!-- ☆☆ ONE DATA ☆☆ -->
  371.                         <dt class="up">
  372.                             <p class="design_num up">5</p>
  373.                             <h4 class="design_title up">白色印刷について</h4>
  374.                         </dt>
  375.                         <dd class="design_note_box fades">
  376.                             <div class="one_box fades">
  377.                                 <ul class="design_piclist fades ">
  378.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey05.png') }}" class="up"></li>
  379.                                 </ul>
  380.                                 <!-- // ** one_boxdesign_piclist ** // -->
  381.                                 <!-- // ** .one_box ** // -->
  382.                             </div>
  383.                             <div class="one_box fades">
  384.                                 <p class="indent up">◯ Illustratorのパスデータで作成を行ってください。</p>
  385.                                 <p class="indent up">◯ はみ出し防止のため、デザインに対して、0.1mmほど内側に小さく作成してください。</p>
  386.                                 <p class="indent up">◯ ベタ面で色をK=100%にして作成し、デザインとはレイヤーをわけてください。</p>
  387.                                 <!-- // ** .one_box ** // -->
  388.                             </div>
  389.                             <div class="one_box fades">
  390.                                 <ul class="design_piclist fades style02">
  391.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey06.png') }}" class="up"></li>
  392.                                     <li>
  393.                                         <p class="up indent">◯ 透明アクリルにCMYKフルカラー印刷を行った場合、薄色は光が透過し見えづらくなります。そこでCMYKフルカラー印刷の下に白色印刷を行うことで発色の視認性を高めることが可能です。部分的にあえて白色印刷を行わないことで、きらびやかさを表現することもできます。</p>
  394.                                     </li>
  395.                                 </ul>
  396.                                 <!-- // ** one_boxdesign_piclist ** // -->
  397.                                 <!-- // ** .one_box ** // -->
  398.                             </div>
  399.                         </dd>
  400.                         <!-- /// .design_note_box *** /// -->
  401.                         <!-- ☆☆ ONE DATA ☆☆ -->
  402.                         <dt class="up">
  403.                             <p class="design_num up">6</p>
  404.                             <h4 class="design_title up">レイヤーの構造について</h4>
  405.                         </dt>
  406.                         <dd class="design_note_box">
  407.                             <div class="one_box fades">
  408.                                 <p class="up">カットライン・デザイン・白色印刷・(オプションにて両面印刷をセレクトした場合)のデータは、必ずレイヤーを分けて入稿してください。</p>
  409.                                 <!-- // ** .one_box ** // -->
  410.                             </div>
  411.                             <div class="one_box fades">
  412.                                 <ul class="design_piclist fades">
  413.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey07.png') }}" class="up"></li>
  414.                                 </ul>
  415.                                 <!-- // ** one_boxdesign_piclist ** // -->
  416.                                 <!-- // ** .one_box ** // -->
  417.                             </div>
  418.                         </dd>
  419.                         <!-- /// .design_note_box *** /// -->
  420.                         <!-- ☆☆ ONE DATA ☆☆ -->
  421.                         <dt class="up">
  422.                             <p class="design_num up">7</p>
  423.                             <h4 class="design_title up">裏面印刷について</h4>
  424.                         </dt>
  425.                         <dd class="design_note_box fades">
  426.                             <div class="one_box fades">
  427.                                 <ul class="design_piclist fades style02">
  428.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey08.png') }}" class="up"></li>
  429.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey09.png') }}" class="up"></li>
  430.                                 </ul>
  431.                                 <!-- // ** one_boxdesign_piclist ** // -->
  432.                                 <!-- // ** .one_box ** // -->
  433.                             </div>
  434.                             <div class="one_box fades">
  435.                                 <p class="indent up">◯ 裏面印刷はオプションです。</p>
  436.                                 <p class="indent up">◯ 裏面デザインは、印刷時、反転しての印刷になりますので、入稿時はレイヤー内で反転してください。</p>
  437.                                 <!-- // ** .one_box ** // -->
  438.                             </div>
  439.                         </dd>
  440.                         <!-- /// .design_note_box *** /// -->
  441.                     </dl>
  442.                     <!-- //// .design_container **** //// -->
  443.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  444.                     <div class="bottom_notes_bloc fades">
  445.                         <aside class="one_box caution_box fades">
  446.                             <div class="caution_inner">
  447.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  448.                                 <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  449.                                 <p class="up indent">2. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  450.                                 <p class="up indent">3. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  451.                                 <p class="up indent">4. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  452.                                 <p class="up indent">5. 保存の際にICCプロファイルを埋め込まないでください。</p>
  453.                                 <!-- // ** .caution_box ** // -->
  454.                             </div>
  455.                         </aside>
  456.                         <!-- //// .bottom_notes_bloc **** //// -->
  457.                     </div>
  458.                 </article>
  459.                 <!-- //// #Period02 ++++ //// -->
  460.                 <!-- ■■ Clip Studio ++ ■■ -->
  461.                 <article
  462.                     id="Period03" class="panel">
  463.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  464.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  465.                         <div id="title_twoLayout">
  466.                             <p class="title_cap up">入稿可能なデータ形式</p>
  467.                             <p class="indent section_note up">◯ Adobe Photoshop psd形式(全バージョン対応)</p>
  468.                             <p class="indent section_note up">◯ 推奨解像度:350dpi</p>
  469.                             <p class="indent section_note up">◯ カラーモード:CMYK</p>
  470.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  471.                         </div>
  472.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  473.                         <figure id="titlePic" class="two_layout download">
  474.                             <a href="/html/user_data/assets/template/AcrylicKeyholder_AcrylicStand_psd.zip" target="_blank">
  475.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  476.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  477.                             </a>
  478.                         </figure>
  479.                         <!-- //// ++++ #titlePic ++++ //// -->
  480.                         <!-- ///// #section_titleBloc +++++ ///// -->
  481.                     </div>
  482.                     <h3 class="section_title up">データの作成方法</h3>
  483.                     <dl
  484.                         class="design_container">
  485.                         <!-- ☆☆ ONE DATA ☆☆ -->
  486.                         <dt class="up">
  487.                             <p class="design_num up">1</p>
  488.                             <h4 class="design_title up">キーホルダー穴について</h4>
  489.                         </dt>
  490.                         <dd class="design_note_box">
  491.                             <div class="one_box fades">
  492.                                 <p class="up">キーホルダー穴は、テンプレートのデータを必ずご使用ください。またイラストの周囲から、最低2mmは間隔を開けて下さい。</p>
  493.                                 <!-- // ** .one_box ** // -->
  494.                             </div>
  495.                             <div class="one_box fades">
  496.                                 <ul class="design_piclist fades">
  497.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey01.png') }}" class="up"></li>
  498.                                 </ul>
  499.                                 <!-- // ** one_boxdesign_piclist ** // -->
  500.                                 <!-- // ** .one_box ** // -->
  501.                             </div>
  502.                         </dd>
  503.                         <!-- /// .design_note_box *** /// -->
  504.                         <!-- ☆☆ ONE DATA ☆☆ -->
  505.                         <dt class="up">
  506.                             <p class="design_num up">2</p>
  507.                             <h4 class="design_title up">デザインサイズ</h4>
  508.                         </dt>
  509.                         <dd class="design_note_box fades">
  510.                             <div class="one_box fades">
  511.                                 <ul class="design_piclist fades">
  512.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey02.png') }}" class="up"></li>
  513.                                 </ul>
  514.                                 <!-- // ** one_boxdesign_piclist ** // -->
  515.                                 <!-- // ** .one_box ** // -->
  516.                             </div>
  517.                             <div class="one_box fades">
  518.                                 <p class="indent up">◯ 各サイズ、範囲内で自由に制作してください。</p>
  519.                                 <p class="indent up">◯ データは必ず実寸大で制作してください。</p>
  520.                                 <p class="indent up">◯ テンプレートは縦横自由にご使用いただけますがパッケージは縦長固定です。</p>
  521.                                 <p class="indent up">◯ データ内にカットラインをご指定いただけますが、弊社にて製作に問題ないカットラインに調整させていただきますので、あくまでも目安程度にお考えください。</p>
  522.                                 <p class="indent up">◯ 最小カットラインサイズは縦横1cmまで基本的に可能です。形状が複雑すぎるデータは破れや折れの原因となるため、対応致しかねる場合もございます。</p>
  523.                                 <!-- // ** .one_box ** // -->
  524.                             </div>
  525.                         </dd>
  526.                         <!-- /// .design_note_box *** /// -->
  527.                         <!-- ☆☆ ONE DATA ☆☆ -->
  528.                         <dt class="up">
  529.                             <p class="design_num up">3</p>
  530.                             <h4 class="design_title up">カットラインについて</h4>
  531.                         </dt>
  532.                         <dd class="design_note_box fades">
  533.                             <div class="one_box fades">
  534.                                 <ul class="design_piclist fades">
  535.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey03.png') }}" class="up"></li>
  536.                                 </ul>
  537.                                 <!-- // ** one_boxdesign_piclist ** // -->
  538.                                 <!-- // ** .one_box ** // -->
  539.                             </div>
  540.                             <div class="one_box fades">
  541.                                 <p class="indent up">◯ 位置指定がある場合は、イラストの周囲に最低でも2mmの余白を設けてください。特にご希望がない場合、カットラインの作成は弊社で行います。</p>
  542.                                 <p class="indent up">◯ 安全上・品質上の理由により、鋭利に飛び出す加工や鋭利に内側にえぐる加工はできません。</p>
  543.                                 <!-- // ** .one_box ** // -->
  544.                             </div>
  545.                         </dd>
  546.                         <!-- /// .design_note_box *** /// -->
  547.                         <!-- ☆☆ ONE DATA ☆☆ -->
  548.                         <dt class="up">
  549.                             <p class="design_num up">4</p>
  550.                             <h4 class="design_title up">カラーモードについて</h4>
  551.                         </dt>
  552.                         <dd class="design_note_box fades">
  553.                             <div class="one_box fades">
  554.                                 <ul class="design_piclist fades">
  555.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey04.png') }}" class="up"></li>
  556.                                 </ul>
  557.                                 <!-- // ** one_boxdesign_piclist ** // -->
  558.                                 <!-- // ** .one_box ** // -->
  559.                             </div>
  560.                             <div class="one_box fades">
  561.                                 <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  562.                                 <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>
  563.                                     ※特色対応不可</p>
  564.                                 <!-- // ** .one_box ** // -->
  565.                             </div>
  566.                         </dd>
  567.                         <!-- /// .design_note_box *** /// -->
  568.                         <!-- ☆☆ ONE DATA ☆☆ -->
  569.                         <dt class="up">
  570.                             <p class="design_num up">5</p>
  571.                             <h4 class="design_title up">白色印刷について</h4>
  572.                         </dt>
  573.                         <dd class="design_note_box fades">
  574.                             <div class="one_box fades">
  575.                                 <ul class="design_piclist fades ">
  576.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey05.png') }}" class="up"></li>
  577.                                 </ul>
  578.                                 <!-- // ** one_boxdesign_piclist ** // -->
  579.                                 <!-- // ** .one_box ** // -->
  580.                             </div>
  581.                             <div class="one_box fades">
  582.                                 <p class="indent up">◯ Illustratorのパスデータで作成を行ってください。</p>
  583.                                 <p class="indent up">◯ はみ出し防止のため、デザインに対して、0.1mmほど内側に小さく作成してください。</p>
  584.                                 <p class="indent up">◯ ベタ面で色をK=100%にして作成し、デザインとはレイヤーをわけてください。</p>
  585.                                 <!-- // ** .one_box ** // -->
  586.                             </div>
  587.                             <div class="one_box fades">
  588.                                 <ul class="design_piclist fades style02">
  589.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey06.png') }}" class="up"></li>
  590.                                     <li>
  591.                                         <p class="up indent">◯ 透明アクリルにCMYKフルカラー印刷を行った場合、薄色は光が透過し見えづらくなります。そこでCMYKフルカラー印刷の下に白色印刷を行うことで発色の視認性を高めることが可能です。部分的にあえて白色印刷を行わないことで、きらびやかさを表現することもできます。</p>
  592.                                     </li>
  593.                                 </ul>
  594.                                 <!-- // ** one_boxdesign_piclist ** // -->
  595.                                 <!-- // ** .one_box ** // -->
  596.                             </div>
  597.                         </dd>
  598.                         <!-- /// .design_note_box *** /// -->
  599.                         <!-- ☆☆ ONE DATA ☆☆ -->
  600.                         <dt class="up">
  601.                             <p class="design_num up">6</p>
  602.                             <h4 class="design_title up">レイヤーの構造について</h4>
  603.                         </dt>
  604.                         <dd class="design_note_box">
  605.                             <div class="one_box fades">
  606.                                 <p class="up">カットライン・デザイン・白色印刷・(オプションにて両面印刷をセレクトした場合)のデータは、必ずレイヤーを分けて入稿してください。</p>
  607.                                 <!-- // ** .one_box ** // -->
  608.                             </div>
  609.                             <div class="one_box fades">
  610.                                 <ul class="design_piclist fades">
  611.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey07.png') }}" class="up"></li>
  612.                                 </ul>
  613.                                 <!-- // ** one_boxdesign_piclist ** // -->
  614.                                 <!-- // ** .one_box ** // -->
  615.                             </div>
  616.                         </dd>
  617.                         <!-- /// .design_note_box *** /// -->
  618.                         <!-- ☆☆ ONE DATA ☆☆ -->
  619.                         <dt class="up">
  620.                             <p class="design_num up">7</p>
  621.                             <h4 class="design_title up">裏面印刷について</h4>
  622.                         </dt>
  623.                         <dd class="design_note_box fades">
  624.                             <div class="one_box fades">
  625.                                 <ul class="design_piclist fades style02">
  626.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey08.png') }}" class="up"></li>
  627.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_ackey09.png') }}" class="up"></li>
  628.                                 </ul>
  629.                                 <!-- // ** one_boxdesign_piclist ** // -->
  630.                                 <!-- // ** .one_box ** // -->
  631.                             </div>
  632.                             <div class="one_box fades">
  633.                                 <p class="indent up">◯ 裏面印刷はオプションです。</p>
  634.                                 <p class="indent up">◯ 裏面デザインは、印刷時、反転しての印刷になりますので、入稿時はレイヤー内で反転してください。</p>
  635.                                 <!-- // ** .one_box ** // -->
  636.                             </div>
  637.                         </dd>
  638.                         <!-- /// .design_note_box *** /// -->
  639.                     </dl>
  640.                     <!-- //// .design_container **** //// -->
  641.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  642.                     <div class="bottom_notes_bloc fades">
  643.                         <aside class="one_box caution_box fades">
  644.                             <div class="caution_inner">
  645.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  646.                                 <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  647.                                 <p class="up indent">2. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  648.                                 <p class="up indent">3. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  649.                                 <p class="up indent">4. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  650.                                 <p class="up indent">5. 保存の際にICCプロファイルを埋め込まないでください。</p>
  651.                                 <!-- // ** .caution_box ** // -->
  652.                             </div>
  653.                         </aside>
  654.                         <!-- //// .bottom_notes_bloc **** //// -->
  655.                     </div>
  656.                 </article>
  657.                 <!-- //// #Period03 ++++ //// -->
  658.                 <!-- ■■ その他 ++ ■■ -->
  659.                 <article
  660.                     id="Period04" class="panel">
  661.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  662.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  663.                         <div id="title_twoLayout">
  664.                             <p class="title_cap up">入稿可能なデータ形式</p>
  665.                             <p class="indent section_note up">◯ jpg形式, png形式, gif形式, pdf形式</p>
  666.                             <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  667.                         </div>
  668.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  669.                         <!--
  670.                         <figure id="titlePic" class="two_layout download">
  671.                             <a href="#" target="_blank">
  672.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  673.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  674.                             </a>
  675.                         </figure>-->
  676.                         <!-- //// ++++ #titlePic ++++ //// -->
  677.                         <!-- ///// #section_titleBloc +++++ ///// -->
  678.                     </div>
  679.                     <h3 class="section_title up">データの作成方法</h3>
  680.                     <dl class="design_container">
  681.                         
  682.                         <dd class="design_note_box fades">
  683.                             <div class="one_box fades">
  684.                                 <p class="up">下図のように背景を広めにとり、できるだけ大きく作成してください。当店で適切なサイズに縮小します。</p>
  685.                                 <!-- // ** .one_box ** // -->
  686.                             </div>
  687.                             <div class="one_box fades">
  688.                                 <ul class="design_piclist fades ">
  689.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker24.jpg') }}" class="up"></li>
  690.                                 </ul>
  691.                                 <!-- // ** one_boxdesign_piclist ** // -->
  692.                                 <!-- // ** .one_box ** // -->
  693.                             </div>
  694.                         </dd>
  695.                     </dl>
  696.                     
  697.                     
  698.                     <h3 class="section_title up">カラーモードをRGBでデータを製作された場合のご注意</h3>
  699.                     <dl class="design_container">
  700.                         
  701.                         <dd class="design_note_box fades">
  702.                             <div class="one_box fades">
  703.                                 <p class="up">CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。</p>
  704.                                 <!-- // ** .one_box ** // -->
  705.                             </div>
  706.                             <div class="one_box fades">
  707.                                 <ul class="design_piclist fades ">
  708.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker07.png') }}" class="up"></li>
  709.                                 </ul>
  710.                                 <!-- // ** one_boxdesign_piclist ** // -->
  711.                                 <!-- // ** .one_box ** // -->
  712.                             </div>
  713.                         </dd>
  714.                     </dl>
  715.                     <!-- //// .design_container **** //// -->
  716.                     <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  717.                     <div class="bottom_notes_bloc fades">
  718.                         <aside class="one_box caution_box fades">
  719.                             <div class="caution_inner">
  720.                                 <h5 class="caution_title up">データ作成上のご注意</h5>
  721.                                 <p class="up indent">1. 保存形式:jpg、png、gif、pdf</p>
  722.                                 <p class="up indent">2. ファイル保存名/フォルダ保存名:半角英数のみ</p>
  723.                                 <p class="up indent">3. カラーモード:CMYK</p>
  724.                                 <p class="up indent">4. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  725.                                 <!-- // ** .caution_box ** // -->
  726.                             </div>
  727.                         </aside>
  728.                         <!-- //// .bottom_notes_bloc **** //// -->
  729.                     </div>
  730.                 </article>
  731.                 <!-- //// #Period04 ++++ //// -->
  732.                 <!-- ■■ シミュレーター ++ ■■ -->
  733.                 <article
  734.                     id="Period05" class="panel">
  735.                     <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  736.                     <div id="section_titleBloc" class="fades twolayout_body inbox">
  737.                         <div id="title_twoLayout">
  738.                             <p class="title_cap up">入稿可能なデータ形式</p>
  739.                             <p class="indent section_note up">◯ PNG(背景透過)</p>
  740.                         </div>
  741.                         <!-- //// ++++ #title_twoLayout ++++ //// -->
  742.                         <figure id="titlePic" class="two_layout download">
  743.                             <a href="#" target="_blank">
  744.                                 <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  745.                                 <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  746.                             </a>
  747.                         </figure>
  748.                         <!-- //// ++++ #titlePic ++++ //// -->
  749.                         <!-- ///// #section_titleBloc +++++ ///// -->
  750.                     </div>
  751.                     <h3 class="section_title up">データの作成方法</h3>
  752.                     <dl
  753.                         class="design_container">
  754.                         <!-- ☆☆ ONE DATA ☆☆ -->
  755.                         <dt class="up">
  756.                             <p class="design_num up">1</p>
  757.                             <h4 class="design_title up">画像を準備</h4>
  758.                         </dt>
  759.                         <dd class="design_note_box">
  760.                             <div class="one_box fades">
  761.                                 <p class="up">ファイル形式:PNG</p>
  762.                                 <p class="up">背景は透過してください</p>
  763.                                 <!-- // ** .one_box ** // -->
  764.                             </div>
  765.                             <div class="one_box fades">
  766.                                 <ul class="design_piclist fades">
  767.                                     <li><img src="{{ asset('/html/user_data/assets/image/design_sticker_sim25.png') }}" class="up"></li>
  768.                                 </ul>
  769.                                 <!-- // ** one_boxdesign_piclist ** // -->
  770.                                 <!-- // ** .one_box ** // -->
  771.                             </div>
  772.                             <p class="up">※JPGファイルの場合、デザインに沿った形状ではなくJPGの外周に沿った四角形での仕上がりになります</p>
  773.                         </dd>
  774.                         <!-- /// .design_note_box *** /// -->
  775.                         <!-- ☆☆ ONE DATA ☆☆ -->
  776.                         <dt class="up">
  777.                             <p class="design_num up">2</p>
  778.                             <h4 class="design_title up">シミュレーターを起動</h4>
  779.                         </dt>
  780.                         <dd class="design_note_box fades">
  781.                             <div class="one_box fades">
  782.                                 <ul class="design_piclist fades">
  783.                                     <li><img src="{{ asset('/html/user_data/assets/image/tab5-pic2.png') }}" class="up"></li>
  784.                                 </ul>
  785.                                 <!-- // ** one_boxdesign_piclist ** // -->
  786.                                 <!-- // ** .one_box ** // -->
  787.                             </div>
  788.                         </dd>
  789.                         <!-- /// .design_note_box *** /// -->
  790.                         <!-- ☆☆ ONE DATA ☆☆ -->
  791.                         <dt class="up">
  792.                             <p class="design_num up">3</p>
  793.                             <h4 class="design_title up">デザインファイルを選択</h4>
  794.                         </dt>
  795.                         <dd class="design_note_box fades">
  796.                             <div class="one_box fades">
  797.                                 <p class="up">【 写真追加 】をクリックし、予め用意したPNG画像を選択
  798. 選択した写真が右側に表示されるので「クリップなし」「円形クリップ」「方形クリップ」や「左回転」「右回転」で編集を行い、完成次第右上の【 決定 】を選択します</p>
  799.                                 <!-- // ** .one_box ** // -->
  800.                             </div>
  801.                             <div class="one_box fades">
  802.                                 <ul class="design_piclist fades ">
  803.                                     <li><img src="{{ asset('/html/user_data/assets/image/tab5-pic3.png') }}" class="up"></li>
  804.                                 </ul>
  805.                                 <!-- // ** one_boxdesign_piclist ** // -->
  806.                                 <!-- // ** .one_box ** // -->
  807.                             </div>
  808.                         </dd>
  809.                         <!-- /// .design_note_box *** /// -->
  810.                         <!-- ☆☆ ONE DATA ☆☆ -->
  811.                         <dt class="up">
  812.                             <p class="design_num up">4</p>
  813.                             <h4 class="design_title up">デザイン</h4>
  814.                         </dt>
  815.                         <dd class="design_note_box fades">
  816.                             <div class="one_box fades">
  817.                                 <p class="up">選択した画像がテンプレート内に表示されるので、【 拡大 】【 縮小 】ボタンや、右下の【 緑色矢印 】にて拡大縮小や、ドラッグにてデザイン位置の微調整を行います。
  818. アクリルキーホルダーの場合は、デザインにリングが沿うように配置してください。</p>
  819.                                 <!-- // ** .one_box ** // -->
  820.                             </div>
  821.                             <div class="one_box fades">
  822.                                 <ul class="design_piclist fades">
  823.                                     <li><img src="{{ asset('/html/user_data/assets/image/tab5-pic5.png') }}" class="up"></li>
  824.                                 </ul>
  825.                                 <!-- // ** one_boxdesign_piclist ** // -->
  826.                                 <!-- // ** .one_box ** // -->
  827.                             </div>
  828.                             <div class="one_box fades">
  829.                                 <p class="up">リングの位置を変更したい場合は、【 カラー変更 】にてリング位置を選択してください。</p>
  830.                                 <p class="up">編集が完了したら左上の【 戻る 】をクリック。</p>
  831.                                 <!-- // ** .one_box ** // -->
  832.                             </div>
  833.                         </dd>
  834.                         <!-- /// .design_note_box *** /// -->
  835.                         <!-- ☆☆ ONE DATA ☆☆ -->
  836.                         <dt class="up">
  837.                             <p class="design_num up">5</p>
  838.                             <h4 class="design_title up">デザイン詳細</h4>
  839.                         </dt>
  840.                         <dd class="design_note_box fades">
  841.                            <div class="one_box fades">
  842.                                 <p class="indent up">【プレビュー】を押すと仕上がりイメージをご確認いただけます。</p>
  843.                                 <p class="indent up">※カットラインは弊社にて微調整させていただく場合がございます。</p>
  844.                                 <!-- // ** .one_box ** // -->
  845.                             </div>
  846.                             
  847.                             <div class="one_box fades">
  848.                                 <ul class="design_piclist fades">
  849.                                     <li><img src="{{ asset('/html/user_data/assets/image/tab5-pic42.png') }}" class="up"></li>
  850.                                 </ul>
  851.                                 <!-- // ** one_boxdesign_piclist ** // -->
  852.                                 <!-- // ** .one_box ** // -->
  853.                             </div>
  854.                         </dd>
  855.                         <!-- /// .design_note_box *** /// -->
  856.                         <!-- ☆☆ ONE DATA ☆☆ -->
  857.                         <dt class="up">
  858.                             <p class="design_num up">6</p>
  859.                             <h4 class="design_title up">デザイン終了</h4>
  860.                         </dt>
  861.             
  862.                         <dd class="design_note_box fades">
  863.                             <div class="one_box fades">
  864.                                 <p class="indent up">デザイン完成後、右上の【 カートボタン 】を押してください。</p>
  865.                                 <p class="indent up">「購入ページへ移動します」【 はい 】を選択します。</p>
  866.                                 <!-- // ** .one_box ** // -->
  867.                             </div>
  868.                             <div class="one_box fades">
  869.                                 <ul class="design_piclist fades ">
  870.                                     <li><img src="{{ asset('/html/user_data/assets/image/sim2-7.png') }}" class="up"></li>
  871.                                 </ul>
  872.                                 <!-- // ** one_boxdesign_piclist ** // -->
  873.                                 <!-- // ** .one_box ** // -->
  874.                             </div>
  875.                         </dd>
  876.                         <!-- /// .design_note_box *** /// -->
  877.                         <!-- ☆☆ ONE DATA ☆☆ -->
  878.                         <!-- /// .design_note_box *** /// -->
  879.                     </dl>
  880.                     <!-- //// .design_container **** //// -->
  881.                         <!-- /// .design_note_box *** /// -->
  882.                 </article>
  883.                 <!-- //// #Period05 ++++ //// -->
  884.                 <!-- //// ++++ #informationContainer ++++ //// -->
  885.             </div>
  886.         </section>
  887.         <!-- ///// +++++ #Design +++++ ///// -->
  888.         <!-- ///// +++++ #mainContents +++++ ///// -->
  889.     </main>
  890. {% endblock %}