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

Open in your IDE?
  1. {% extends '@user_data/layout/default_frame.twig' %}
  2. {% block title %}
  3. デザイン方法 - その他 | オリジナル缶バッジ/カンバッチ製作【個人小ロットから業務用OEMまで激安印刷】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="/html/user_data/other-design/img/14.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 other">
  62. <!-- ■■ Illustrator ++ ■■ -->
  63. <article
  64. id="Period01" class="panel">
  65. <!-- // ++ アートプリント ++ /////////////////////////////////////////////////////////////// -->
  66. <div id="period01-Case01" class="design_anchor_linkbox fades">
  67. <ul class="design_anchorlink">
  68. <li class="on">
  69. <a href="#period01-Case01">アートプリント</a>
  70. </li>
  71. <li class="">
  72. <a href="#period01-Case02">販売用アートキャンバス</a>
  73. </li>
  74. <li class="">
  75. <a href="#period01-Case03">アクリルフォトパネル</a>
  76. </li>
  77. <li class="">
  78. <a href="#period01-Case04">定型ポストカード</a>
  79. </li><br>
  80. <span class="br"></span>
  81. <li class="">
  82. <a href="#period01-Case05">変形ダイカットポストカード</a>
  83. </li>
  84. <li class="">
  85. <a href="#period01-Case06">缶マグネット</a>
  86. </li>
  87. <li class="">
  88. <a href="#period01-Case07">推し活用 絵馬</a>
  89. </li>
  90. <li class="">
  91. <a href="#period01-Case08">メモリアルアクリルブロック</a>
  92. </li>
  93. <li class="">
  94. <a href="#period01-Case09">缶キーホルダー</a>
  95. </li>
  96. </ul>
  97. <!-- //// **** .design_anchorlink **** //// -->
  98. <!-- ///// .anchor_linkbox +++++**** ///// -->
  99. </div>
  100. <div id="section_titleBloc" class="fades twolayout_body inbox">
  101. <div id="title_twoLayout">
  102. <p class="title_cap up">入稿可能なデータ形式</p>
  103. <p class="indent section_note up">◯ Adobe Illustrator ai形式(全バージョン対応)</p>
  104. <p class="indent section_note up">◯ カラーモード:RGB、CMYK(RGBの場合色合いによっては再現不可のものがございます。予めご了承ください。)</p>
  105. <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  106. <p class="indent section_note up">◯ 画像はリンク配置を行い、必ず全リンク画像データを添えたフォルダを圧縮してご入稿ください</p>
  107. </div>
  108. <!-- //// ++++ #title_twoLayout ++++ //// -->
  109. <figure id="titlePic" class="two_layout download">
  110. <a href="#" target="_blank">
  111. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  112. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  113. </a>
  114. </figure>
  115. <!-- //// ++++ #titlePic ++++ //// -->
  116. <!-- ///// #section_titleBloc +++++ ///// -->
  117. </div>
  118. <h3 class="section_title up">データの作成方法</h3>
  119. <dl
  120. class="design_container">
  121. <!-- ☆☆ ONE DATA ☆☆ -->
  122. <dt class="up">
  123. <p class="design_num up">1</p>
  124. <h4 class="design_title up">デザインサイズ</h4>
  125. </dt>
  126. <dd class="design_note_box">
  127. <div class="one_box fades">
  128. <ul class="design_piclist fades">
  129. <li><img src="{{ asset('assets/img/design-other/ai/case01-design_size.jpg') }}" class="up"></li>
  130. </ul>
  131. <!-- // ** one_boxdesign_piclist ** // -->
  132. <!-- // ** .one_box ** // -->
  133. </div>
  134. <div class="one_box fades">
  135. <p class="indent up">◯ 各サイズ、範囲内自由なサイズで制作してください。</p>
  136. <p class="indent up">◯ テンプレートは縦横自由にご使用いただけます。</p>
  137. <p class="indent up">◯ 最大1mmの裁断ズレが発生することがありますので1mmの背景塗り足しを設けてください。</p>
  138. <p class="indent up">◯ デザインは両面行っていただけますようお願いいたします。</p>
  139. <!-- // ** .one_box ** // -->
  140. </div>
  141. </dd>
  142. <!-- /// .design_note_box *** /// -->
  143. <!-- ☆☆ ONE DATA ☆☆ -->
  144. <dt class="up">
  145. <p class="design_num up">2</p>
  146. <h4 class="design_title up">カラーモードについて</h4>
  147. </dt>
  148. <dd class="design_note_box fades">
  149. <div class="one_box fades">
  150. <p class="up">sRGBカラーを90%以上カバーする高性能印刷機を用いておりますが、完全再現は致しかねます。下記のようなビビッドなRGB色は色味が大きく変化したように感じる場合がございます。ご了承ください。<br>
  151. ※特色対応不可</p>
  152. <!-- // ** .one_box ** // -->
  153. </div>
  154. <div class="one_box fades">
  155. <ul class="design_piclist fades">
  156. <li><img src="{{ asset('assets/img/design-other/ai/case01-color_mode.jpg') }}" class="up"></li>
  157. </ul>
  158. <!-- // ** one_boxdesign_piclist ** // -->
  159. <!-- // ** .one_box ** // -->
  160. </div>
  161. </dd>
  162. <!-- /// .design_note_box *** /// -->
  163. </dl>
  164. <!-- //// .design_container **** //// -->
  165. <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  166. <div class="bottom_notes_bloc fades">
  167. <aside class="one_box caution_box fades">
  168. <div class="caution_inner">
  169. <h5 class="caution_title up">データ作成上のご注意</h5>
  170. <p class="up indent">1. 文字は必ずアウトライン化してください。</p>
  171. <p class="up indent">2. デザインが複数ある場合、同一アートボードに全て並べて配置し、1ファイルにまとめてご入稿ください。</p>
  172. <p class="up indent">3. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  173. <p class="up indent">4. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  174. <p class="up indent">5. 配置画像データの解像度は350dpi以上を推奨させていただいています。</p>
  175. <p class="up indent">6. 配置画像の解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  176. <p class="up indent">7. 保存の際にICCプロファイルを埋め込まないでください。</p>
  177. <p class="up indent">8. スタイライズ(ドロップシャドウやぼかしなど)をご使用の場合は、粗く印刷される場合がございます。Photoshop等にて画像化したものをご入稿いただくことを推奨とさせていただきます。</p>
  178. <!-- // ** .caution_box ** // -->
  179. </div>
  180. </aside>
  181. <!-- //// .bottom_notes_bloc **** //// -->
  182. </div>
  183. <!-- // ++ 販売用アートキャンバス ++ /////////////////////////////////////////////////////////////// -->
  184. <div id="period01-Case02" class="design_anchor_linkbox fades">
  185. <ul class="design_anchorlink">
  186. <li class="">
  187. <a href="#period01-Case01">アートプリント</a>
  188. </li>
  189. <li class="on">
  190. <a href="#period01-Case02">販売用アートキャンバス</a>
  191. </li>
  192. <li class="">
  193. <a href="#period01-Case03">アクリルフォトパネル</a>
  194. </li>
  195. <li class="">
  196. <a href="#period01-Case04">定型ポストカード</a>
  197. </li><br>
  198. <span class="br"></span>
  199. <li class="">
  200. <a href="#period01-Case05">変形ダイカットポストカード</a>
  201. </li>
  202. <li class="">
  203. <a href="#period01-Case06">缶マグネット</a>
  204. </li>
  205. <li class="">
  206. <a href="#period01-Case07">推し活用 絵馬</a>
  207. </li>
  208. <li class="">
  209. <a href="#period01-Case08">メモリアルアクリルブロック</a>
  210. </li>
  211. <li class="">
  212. <a href="#period01-Case09">缶キーホルダー</a>
  213. </li>
  214. </ul>
  215. <!-- //// **** .design_anchorlink **** //// -->
  216. <!-- ///// .anchor_linkbox +++++**** ///// -->
  217. </div>
  218. <div id="section_titleBloc" class="fades twolayout_body inbox">
  219. <div id="title_twoLayout">
  220. <p class="title_cap up">入稿可能なデータ形式</p>
  221. <p class="indent section_note up">◯ Adobe Illustrator ai形式(全バージョン対応)</p>
  222. <p class="indent section_note up">◯ カラーモード:CMYK</p>
  223. <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  224. <p class="indent section_note up">◯ 画像はリンク配置を行い、必ず全リンク画像データを添えたフォルダを圧縮してご入稿ください</p>
  225. </div>
  226. <!-- //// ++++ #title_twoLayout ++++ //// -->
  227. <figure id="titlePic" class="two_layout download">
  228. <a href="#" target="_blank">
  229. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  230. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  231. </a>
  232. </figure>
  233. <!-- //// ++++ #titlePic ++++ //// -->
  234. <!-- ///// #section_titleBloc +++++ ///// -->
  235. </div>
  236. <h3 class="section_title up">データの作成方法</h3>
  237. <dl
  238. class="design_container">
  239. <!-- ☆☆ ONE DATA ☆☆ -->
  240. <dt class="up">
  241. <p class="design_num up">1</p>
  242. <h4 class="design_title up">デザインサイズ</h4>
  243. </dt>
  244. <dd class="design_note_box">
  245. <div class="one_box fades">
  246. <ul class="design_piclist fades">
  247. <li><img src="{{ asset('assets/img/design-other/ai/case02-design_size.jpg') }}" class="up"></li>
  248. </ul>
  249. <!-- // ** one_boxdesign_piclist ** // -->
  250. <!-- // ** .one_box ** // -->
  251. </div>
  252. <div class="one_box fades">
  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">3</p>
  263. <h4 class="design_title up">カラーモードについて</h4>
  264. </dt>
  265. <dd class="design_note_box fades">
  266. <div class="one_box fades">
  267. <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  268. <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>※特色対応不可</p>
  269. <!-- // ** .one_box ** // -->
  270. </div>
  271. <div class="one_box fades">
  272. <ul class="design_piclist fades">
  273. <li><img src="{{ asset('assets/img/design-other/ai/case02-color_mode.jpg') }}" class="up"></li>
  274. </ul>
  275. <!-- // ** one_boxdesign_piclist ** // -->
  276. <!-- // ** .one_box ** // -->
  277. </div>
  278. </dd>
  279. <!-- /// .design_note_box *** /// -->
  280. </dl>
  281. <!-- //// .design_container **** //// -->
  282. <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  283. <div class="bottom_notes_bloc fades">
  284. <aside class="one_box caution_box fades">
  285. <div class="caution_inner">
  286. <h5 class="caution_title up">データ作成上のご注意</h5>
  287. <p class="up indent">1. 文字は必ずアウトライン化してください。</p>
  288. <p class="up indent">2. デザインが複数ある場合、同一アートボードに全て並べて配置し、1ファイルにまとめてご入稿ください。</p>
  289. <p class="up indent">3. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  290. <p class="up indent">4. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  291. <p class="up indent">5. 配置画像データの解像度は350dpi以上を推奨させていただいています。</p>
  292. <p class="up indent">6. 配置画像の解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  293. <p class="up indent">7. 保存の際にICCプロファイルを埋め込まないでください。</p>
  294. <p class="up indent">8. スタイライズ(ドロップシャドウやぼかしなど)をご使用の場合は、粗く印刷される場合がございます。Photoshop等にて画像化したものをご入稿いただくことを推奨とさせていただきます。</p>
  295. <!-- // ** .caution_box ** // -->
  296. </div>
  297. </aside>
  298. <!-- //// .bottom_notes_bloc **** //// -->
  299. </div>
  300. </article>
  301. <!-- //// #Period01 ++++ //// -->
  302. <!-- ■■ Photoshop ++ ■■ -->
  303. <article
  304. id="Period02" class="panel">
  305. <!-- // ++ アートプリント ++ /////////////////////////////////////////////////////////////// -->
  306. <div id="period02-Case01" class="design_anchor_linkbox">
  307. <ul class="design_anchorlink">
  308. <li class="on">
  309. <a href="#period02-Case01">アートプリント</a>
  310. </li>
  311. <li class="">
  312. <a href="#period02-Case02">販売用アートキャンバス</a>
  313. </li>
  314. <li class="">
  315. <a href="#period02-Case03">アクリルフォトパネル</a>
  316. </li>
  317. <li class="">
  318. <a href="#period02-Case04">定型ポストカード</a>
  319. </li><br>
  320. <span class="br"></span>
  321. <li class="">
  322. <a href="#period02-Case05">変形ダイカットポストカード</a>
  323. </li>
  324. <li class="">
  325. <a href="#period02-Case06">缶マグネット</a>
  326. </li>
  327. <li class="">
  328. <a href="#period02-Case07">推し活用 絵馬</a>
  329. </li>
  330. <li class="">
  331. <a href="#period02-Case08">メモリアルアクリルブロック</a>
  332. </li>
  333. <li class="">
  334. <a href="#period02-Case09">缶キーホルダー</a>
  335. </li>
  336. </ul>
  337. <!-- //// **** .design_anchorlink **** //// -->
  338. <!-- ///// .anchor_linkbox +++++**** ///// -->
  339. </div>
  340. <div id="section_titleBloc" class="fades twolayout_body inbox">
  341. <div id="title_twoLayout">
  342. <p class="title_cap up">入稿可能なデータ形式</p>
  343. <p class="indent section_note up">◯ Adobe Photoshop psd形式(全バージョン対応)</p>
  344. <p class="indent section_note up">◯ 推奨解像度:350dpi</p>
  345. <p class="indent section_note up">◯ カラーモード:RGB、CMYK(RGBの場合色合いによっては再現不可のものがございます。予めご了承ください。)</p>
  346. <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  347. </div>
  348. <!-- //// ++++ #title_twoLayout ++++ //// -->
  349. <figure id="titlePic" class="two_layout download">
  350. <a href="#" target="_blank">
  351. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  352. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  353. </a>
  354. </figure>
  355. <!-- //// ++++ #titlePic ++++ //// -->
  356. <!-- ///// #section_titleBloc +++++ ///// -->
  357. </div>
  358. <h3 class="section_title up">データの作成方法</h3>
  359. <dl
  360. class="design_container">
  361. <!-- ☆☆ ONE DATA ☆☆ -->
  362. <dt class="up">
  363. <p class="design_num up">1</p>
  364. <h4 class="design_title up">デザインサイズ</h4>
  365. </dt>
  366. <dd class="design_note_box">
  367. <div class="one_box fades">
  368. <ul class="design_piclist fades">
  369. <li><img src="{{ asset('assets/img/design-other/photoshop/case01-design_size.jpg') }}" class="up"></li>
  370. </ul>
  371. <!-- // ** one_boxdesign_piclist ** // -->
  372. <!-- // ** .one_box ** // -->
  373. </div>
  374. <div class="one_box fades">
  375. <p class="indent up">◯ 各サイズ、範囲内自由なサイズで制作してください。</p>
  376. <p class="indent up">◯ テンプレートは縦横自由にご使用いただけます。</p>
  377. <p class="indent up">◯ 最大1mmの裁断ズレが発生することがありますので1mmの背景塗り足しを設けてください。</p>
  378. <p class="indent up">◯ デザインは両面行っていただけますようお願いいたします。</p>
  379. <!-- // ** .one_box ** // -->
  380. </div>
  381. </dd>
  382. <!-- /// .design_note_box *** /// -->
  383. <!-- ☆☆ ONE DATA ☆☆ -->
  384. <dt class="up">
  385. <p class="design_num up">2</p>
  386. <h4 class="design_title up">カラーモードについて</h4>
  387. </dt>
  388. <dd class="design_note_box fades">
  389. <div class="one_box fades">
  390. <p class="up">sRGBカラーを90%以上カバーする高性能印刷機を用いておりますが、完全再現は致しかねます。下記のようなビビッドなRGB色は色味が大きく変化したように感じる場合がございます。ご了承ください。<br>
  391. ※特色対応不可</p>
  392. <!-- // ** .one_box ** // -->
  393. </div>
  394. <div class="one_box fades">
  395. <ul class="design_piclist fades">
  396. <li><img src="{{ asset('assets/img/icon_home.png') }}" class="up"></li>
  397. </ul>
  398. <!-- // ** one_boxdesign_piclist ** // -->
  399. <!-- // ** .one_box ** // -->
  400. </div>
  401. </dd>
  402. <!-- /// .design_note_box *** /// -->
  403. <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  404. <div class="bottom_notes_bloc fades">
  405. <aside class="one_box caution_box fades">
  406. <div class="caution_inner">
  407. <h5 class="caution_title up">データ作成上のご注意</h5>
  408. <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  409. <p class="up indent">2. 配置画像の解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  410. <!-- // ** .caution_box ** // -->
  411. </div>
  412. </aside>
  413. <!-- //// .bottom_notes_bloc **** //// -->
  414. </div>
  415. <!-- // ++ 販売用アートキャンバス ++ /////////////////////////////////////////////////////////////// -->
  416. <div id="period02-Case02" class="design_anchor_linkbox">
  417. <ul class="design_anchorlink">
  418. <li class="">
  419. <a href="#period02-Case01">アートプリント</a>
  420. </li>
  421. <li class="on">
  422. <a href="#period02-Case02">販売用アートキャンバス</a>
  423. </li>
  424. <li class="">
  425. <a href="#period02-Case03">アクリルフォトパネル</a>
  426. </li>
  427. <li class="">
  428. <a href="#period02-Case04">定型ポストカード</a>
  429. </li><br>
  430. <span class="br"></span>
  431. <li class="">
  432. <a href="#period02-Case05">変形ダイカットポストカード</a>
  433. </li>
  434. <li class="">
  435. <a href="#period02-Case06">缶マグネット</a>
  436. </li>
  437. <li class="">
  438. <a href="#period02-Case07">推し活用 絵馬</a>
  439. </li>
  440. <li class="">
  441. <a href="#period02-Case08">メモリアルアクリルブロック</a>
  442. </li>
  443. <li class="">
  444. <a href="#period02-Case09">缶キーホルダー</a>
  445. </li>
  446. </ul>
  447. <!-- //// **** .design_anchorlink **** //// -->
  448. <!-- ///// .anchor_linkbox +++++**** ///// -->
  449. </div>
  450. <div id="section_titleBloc" class="fades twolayout_body inbox">
  451. <div id="title_twoLayout">
  452. <p class="title_cap up">入稿可能なデータ形式</p>
  453. <p class="indent section_note up">◯ Adobe Photoshop psd形式(全バージョン対応)</p>
  454. <p class="indent section_note up">◯ 推奨解像度:350dpi</p>
  455. <p class="indent section_note up">◯ カラーモード:CMYK</p>
  456. <p class="indent section_note up">◯ ファイル保存名/フォルダ保存名:半角英数のみ</p>
  457. </div>
  458. <!-- //// ++++ #title_twoLayout ++++ //// -->
  459. <figure id="titlePic" class="two_layout download">
  460. <a href="#" target="_blank">
  461. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  462. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  463. </a>
  464. </figure>
  465. <!-- //// ++++ #titlePic ++++ //// -->
  466. <!-- ///// #section_titleBloc +++++ ///// -->
  467. </div>
  468. <h3 class="section_title up">データの作成方法</h3>
  469. <dl
  470. class="design_container">
  471. <!-- ☆☆ ONE DATA ☆☆ -->
  472. <dt class="up">
  473. <p class="design_num up">1</p>
  474. <h4 class="design_title up">デザインサイズ</h4>
  475. </dt>
  476. <dd class="design_note_box">
  477. <div class="one_box fades">
  478. <ul class="design_piclist fades">
  479. <li><img src="{{ asset('assets/img/design-other/photoshop/case02-design_size.jpg') }}" class="up"></li>
  480. </ul>
  481. <!-- // ** one_boxdesign_piclist ** // -->
  482. <!-- // ** .one_box ** // -->
  483. </div>
  484. <div class="one_box fades">
  485. <p class="indent up">◯ テンプレートファイルを用いて規格サイズ通り実寸で制作してください。</p>
  486. <p class="indent up">◯ テンプレートは縦横自由にご使用いただけます。</p>
  487. <p class="indent up">◯ まきしろ部分はキャンバスの側面や裏部分に該当し、表面に露出致しますので背景色にてデザインを行ってください。</p>
  488. <!-- // ** .one_box ** // -->
  489. </div>
  490. </dd>
  491. <!-- /// .design_note_box *** /// -->
  492. <!-- ☆☆ ONE DATA ☆☆ -->
  493. <dt class="up">
  494. <p class="design_num up">3</p>
  495. <h4 class="design_title up">カラーモードについて</h4>
  496. </dt>
  497. <dd class="design_note_box fades">
  498. <div class="one_box fades">
  499. <p class="indent up">◯ カラーモードRGBのファイルは印刷時にCMYK形式に変換させていただきます。</p>
  500. <p class="indent up">◯ CMYKはRGBに比べ表現できる色の幅が狭いため、データによっては色味が大きく変化したように感じる場合があります。<br>※特色対応不可</p>
  501. <!-- // ** .one_box ** // -->
  502. </div>
  503. <div class="one_box fades">
  504. <ul class="design_piclist fades">
  505. <li><img src="{{ asset('assets/img/design-other/photoshop/case02-color_mode.jpg') }}" class="up"></li>
  506. </ul>
  507. <!-- // ** one_boxdesign_piclist ** // -->
  508. <!-- // ** .one_box ** // -->
  509. </div>
  510. </dd>
  511. <!-- /// .design_note_box *** /// -->
  512. </dl>
  513. <!-- //// .design_container **** //// -->
  514. <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  515. <div class="bottom_notes_bloc fades">
  516. <aside class="one_box caution_box fades">
  517. <div class="caution_inner">
  518. <h5 class="caution_title up">データ作成上のご注意</h5>
  519. <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  520. <p class="up indent">2. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  521. <p class="up indent">3. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  522. <p class="up indent">4. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  523. <p class="up indent">5. 保存の際にICCプロファイルを埋め込まないでください。</p>
  524. <!-- // ** .caution_box ** // -->
  525. </div>
  526. </aside>
  527. <!-- //// .bottom_notes_bloc **** //// -->
  528. </div>
  529. </article>
  530. <!-- //// #Period02 ++++ //// -->
  531. <!-- ■■ Clip Studio ++ ■■ -->
  532. <article
  533. id="Period03" class="panel">
  534. <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  535. <div id="section_titleBloc" class="fades twolayout_body inbox">
  536. <div id="title_twoLayout">
  537. <p class="title_cap up">入稿可能なデータ形式</p>
  538. <p class="indent section_note up">◯ xxx</p>
  539. <p class="indent section_note up">◯ xxx</p>
  540. <p class="indent section_note up">◯ xxx</p>
  541. <p class="indent section_note up">◯ xxx</p>
  542. </div>
  543. <!-- //// ++++ #title_twoLayout ++++ //// -->
  544. <figure id="titlePic" class="two_layout download">
  545. <a href="#" target="_blank">
  546. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  547. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  548. </a>
  549. </figure>
  550. <!-- //// ++++ #titlePic ++++ //// -->
  551. <!-- ///// #section_titleBloc +++++ ///// -->
  552. </div>
  553. <h3 class="section_title up">データの作成方法</h3>
  554. <dl class="design_container"></dl>
  555. <!-- //// .design_container **** //// -->
  556. <!-- // ++ データ作成上のご注意 ++ ///////////////////////////////////////////////////////////////////////////////////// -->
  557. <div class="bottom_notes_bloc fades">
  558. <aside class="one_box caution_box fades">
  559. <div class="caution_inner">
  560. <h5 class="caution_title up">データ作成上のご注意</h5>
  561. <p class="up indent">1. デザインが複数ある場合、1つのファイルに1つのデザインを配置してください。(例)デザイン3種類→3つのファイルにわけて保存</p>
  562. <p class="up indent">2. デザインにロックをかけるのはお控えください。印刷不良の原因となることがございます。</p>
  563. <p class="up indent">3. サイズ加工を行っておりません。実寸にてご入稿ください。</p>
  564. <p class="up indent">4. 解像度が低い場合でも、印刷できるデータであればそのまま印刷致します。仕上がりが不鮮明な場合でも保証対象とはなりませんのでご注意ください。</p>
  565. <p class="up indent">5. 保存の際にICCプロファイルを埋め込まないでください。</p>
  566. <!-- // ** .caution_box ** // -->
  567. </div>
  568. </aside>
  569. <!-- //// .bottom_notes_bloc **** //// -->
  570. </div>
  571. </article>
  572. <!-- //// #Period03 ++++ //// -->
  573. <!-- ■■ その他 ++ ■■ -->
  574. <article
  575. id="Period04" class="panel">
  576. <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  577. <div id="section_titleBloc" class="fades twolayout_body inbox">
  578. <div id="title_twoLayout">
  579. <p class="title_cap up">入稿可能なデータ形式</p>
  580. <p class="indent section_note up">◯ xxx</p>
  581. <p class="indent section_note up">◯ xxx</p>
  582. <p class="indent section_note up">◯ xxx</p>
  583. <p class="indent section_note up">◯ xxx</p>
  584. </div>
  585. <!-- //// ++++ #title_twoLayout ++++ //// -->
  586. <figure id="titlePic" class="two_layout download">
  587. <a href="#" target="_blank">
  588. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  589. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  590. </a>
  591. </figure>
  592. <!-- //// ++++ #titlePic ++++ //// -->
  593. <!-- ///// #section_titleBloc +++++ ///// -->
  594. </div>
  595. <h3 class="section_title up">データの作成方法</h3>
  596. <dl class="design_container"></dl>
  597. <!-- //// .design_container **** //// -->
  598. </article>
  599. <!-- //// #Period04 ++++ //// -->
  600. <!-- ■■ シュミレーター ++ ■■ -->
  601. <article
  602. id="Period05" class="panel">
  603. <!-- // ++ コンテンツタイトル ++ /////////////////////////////////////////////////////////////// -->
  604. <div id="section_titleBloc" class="fades twolayout_body inbox">
  605. <div id="title_twoLayout">
  606. <p class="title_cap up">入稿可能なデータ形式</p>
  607. <p class="indent section_note up">◯ xxx</p>
  608. <p class="indent section_note up">◯ xxx</p>
  609. <p class="indent section_note up">◯ xxx</p>
  610. <p class="indent section_note up">◯ xxx</p>
  611. </div>
  612. <!-- //// ++++ #title_twoLayout ++++ //// -->
  613. <figure id="titlePic" class="two_layout download">
  614. <a href="#" target="_blank">
  615. <img src="{{ asset('assets/img/btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_pc">
  616. <img src="{{ asset('assets/img/sp_btn_dwl-temp.png') }}" alt="テンプレートをダウンロード" class="for_sp">
  617. </a>
  618. </figure>
  619. <!-- //// ++++ #titlePic ++++ //// -->
  620. <!-- ///// #section_titleBloc +++++ ///// -->
  621. </div>
  622. <h3 class="section_title up">データの作成方法</h3>
  623. <dl class="design_container"></dl>
  624. <!-- //// .design_container **** //// -->
  625. </article>
  626. <!-- //// #Period05 ++++ //// -->
  627. <!-- //// ++++ #informationContainer ++++ //// -->
  628. </div>
  629. </section>
  630. <!-- ///// +++++ #Design +++++ ///// -->
  631. <!-- ///// +++++ #mainContents +++++ ///// -->
  632. </main>
  633. {% endblock %}