1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> 7 <title>ãã³ååºã®ç¡æä½æãµã¼ãã¹ ãã£ã«ãã-nyanimon-</title> 8 <meta name="description" content="ãã³ååºã®ç¡æä½æãµã¼ãã¹ ãã£ã«ãã-nyanimon-"> 9 <meta name="keywords" content="ãã³,ååº,ç¡æä½æãµã¼ãã¹,ãã£ã«ãã,nyanimon"> 10 <meta property="og:type" content="website" /> 11 <meta property="og:title" content="ãã³ååºã®ç¡æä½æãµã¼ãã¹ ãã£ã«ãã-nyanimon-" /> 12 <meta property="og:site_name" content="ãã³ååºã®ç¡æä½æãµã¼ãã¹ ãã£ã«ãã-nyanimon-" /> 13 <meta property="og:description" content="ãã³ã®åçã®ã¢ãããã¼ãï¼ã«ã³ã¿ã³ãªæåæ å ±ã®å ¥åã§ããµãã¨ãæããã«æç«ã®ååºãèªåçæã§ãããµã¼ãã¹ã§ãã" /> 14 <meta property="og:url" content="https://nyanimon.com" /> 15 <meta property="og:locale" content="ja_JP" /> 16 17 <link rel="preload" href="/images/img_loading.png" as="image"> 18 19 20 <link href="https://fonts.googleapis.com/css?family=Kosugi+Maru|M+PLUS+Rounded+1c|Noto+Sans+JP|Noto+Serif+SC|Sawarabi+Gothic|Sawarabi+Mincho" rel="stylesheet"> 21 22 <link rel="stylesheet" href="https://nyanimon.com/css/index.css"> 23 <link rel="stylesheet" type="text/css" href="https://nyanimon.com/css/slick.css"/> 24 <link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/ui-lightness/jquery-ui.css"> 25 <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/cropper/4.0.0/cropper.css"> 26 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous"> 27 <link href="css/evol-colorpicker.css" rel="stylesheet" type="text/css"> 28 <link rel="stylesheet" href="https://nyanimon.com/css/slick-custom.css?20210224112011"> 29 <link rel="stylesheet" href="https://nyanimon.com/css/custom.css?20190212105948"> 30 <link rel="stylesheet" href="https://nyanimon.com/css/loader.css?20211201174111"> 31 <link rel="stylesheet" href="https://nyanimon.com/css/swiper.css?20191016163139"> 32 33 34 35 36 37 38 39 40 41
41<script src="https://code.createjs.com/easeljs-0.7.1.min.js"></script>
41 42
42<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
42 43
43<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
43 44
44<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
44 45
45<script src="js/evol-colorpicker.min.js" type="text/javascript" charset="utf-8"></script>
45 46
46<script src="https://nyanimon.com/js/exif.js" type="text/javascript" charset="utf-8"></script>
46 47
47<script src="https://cdnjs.cloudflare.com/ajax/libs/cropper/4.0.0/cropper.js" type="text/javascript" charset="utf-8"></script>
47 48
48<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
48 49
49<script type="text/javascript" src="https://nyanimon.com/js/slick.min.js"></script>
49 50
50<script type="text/javascript" src="https://nyanimon.com/js/swiper.min.js"></script>
50 51
51<script src="https://nyanimon.com/js/common.js?20191016165203"></script>
51 52
52<script src="https://nyanimon.com/js/function.js?20201020110819"></script>
52 53 54
54<script type="text/javascript"> 55 $(document).ready(function() { 56 $("#color").colorpicker(); 57 }); 58 59 $(function () { 60 $('#direction').click(function () { 61 var parent = $(this).parent(); 62 parent.toggleClass('isVertical isHorizontal'); 63 $(this).val(parent.hasClass('isVertical') ? 1 : 2); 64 }) 65 }); 66 </script>
66 67 68 69
69<script type="text/javascript" src="https://nyanimon.com/js/templateConfig.js?20210203170829"></script>
69 70
70<script type="text/javascript" src="https://nyanimon.com/js/slickConfig.js?20180608163510"></script>
70 71
71<script type="text/javascript" src="https://nyanimon.com/js/textConfig.js?20190212105948"></script>
71 72 73 <!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 68 bytes, lines 73-74
73 74 <script async src="https://www.googletagmanager.com/gtag/js?id=
74UA-119889631-1
vendor: 16 bytes, lines 74-75
74"></script> 75
75<script> 76
vendor: 152 bytes, lines 76-80
76window.dataLayer = window.dataLayer || []; 77 function gtag(){dataLayer.push(arguments);} 78 gtag('js', new Date()); 79 80 gtag('config', '
80UA-119889631-1
vendor: 8 bytes, lines 80-81
80'); 81
81</script>
81 82</head> 83<body> 84<div id="firstContent"> 85 <div class="mainContents"> 86 <div class="mainVisual swiper-container"> 87 <div class="swiper-wrapper"> 88 <p class="swiper-slide"><img src="images/mv01.png" alt=""></p> 89 <p class="swiper-slide"><img src="images/mv02.png" alt=""></p> 90 <p class="swiper-slide"><img src="images/mv03.png" alt=""></p> 91 <p class="swiper-slide"><img src="images/mv04.png" alt=""></p> 92 <p class="swiper-slide"><img src="images/mv05.png" alt=""></p> 93 <p class="swiper-slide"><img src="images/mv06.png" alt=""></p> 94 <p class="swiper-slide"><img src="images/mv07.png" alt=""></p> 95 <p class="swiper-slide"><img src="images/mv08.png" alt=""></p> 96 <p class="swiper-slide"><img src="images/mv09.png" alt=""></p> 97 </div> 98 </div> 99 <div class="header"> 100 <div class="header-sns-btns"> 101 <p class="mv-btn btn-fb rover-hover"><a href="https://twitter.com/nyanimon0222" target="_blank"><img src="images/ico_tw.png" alt="twitter"></a></p> 102 <p class="mv-btn btn-ig rover-hover"><a href="https://www.instagram.com/nyanimon/" target="_blank"><img src="images/ico_ig.png" alt="instagram"></a></p> 103 </div> 104 <h1 class="title"> 105 <img src="images/title.png" alt="ãã³ååºã®ç¡æä½æãµã¼ãã¹ ãã£ã«ãã-nyanimon- éå¶ä¼ç¤¾ï¼æ ªå¼ä¼ç¤¾ãããã¡" class="on-pc"> 106 <img src="images/title_sp.png" alt="ãã³ååºã®ç¡æä½æãµã¼ãã¹ ãã£ã«ãã-nyanimon- éå¶ä¼ç¤¾ï¼æ ªå¼ä¼ç¤¾ãããã¡" class="on-sp"> 107 </h1> 108 </div> 109 <div class="example-area"> 110 <!--<nav class="menu"> 111 <div class="menu-list"> 112 <p class="btn-menu"><a href=""><img src="images/btn_menu.png" alt="MENU"></a></p> 113 </div> 114 </nav>--> 115 <p class="overview" id="introduction">ãã³ã®åçã®ã¢ãããã¼ãï¼<br class="on-sp">ã«ã³ã¿ã³ãªæåæ å ±ã®å ¥åã§ã<br class="on-pc"> 116 ãµãã¨ãæããã«<br class="on-sp">æç«ã®ååºãèªåçæã§ãããµã¼ãã¹<br class="on-sp">ããã£ã«ãããã§ãã</p> 117 <p class="bnr-general rover-hover"><a href="https://lit.link/nyanimon" target="_blank"><img src="/images/bnr_general.jpg" alt="ãããã¡ãµã¼ãã¹ç·åãµã¤ã"></a></p> 118 <p class="bnr-neco-demy"><a href="https://necodemy.stores.jp/" target="_blank"><img src="/images/bnr_neco-demy01.jpg" alt=""></a></p> 119 <div class="other-btns"> 120 <p class="btn-shop rover-hover"><a href="https://nyanimon.kawaiishop.jp/" target="_blank"><img src="https://nyanimon.com/images/btn_shop.png" alt="ãã£ã«ããã·ã§ããï¼å°å·ä»£è¡ã»ã°ããºã»ã¤ãã³ããªã©ï¼" class="on-pc"><img src="https://nyanimon.com/images/btn_shop_sp.png" alt="ãã£ã«ããã·ã§ããï¼å°å·ä»£è¡ã»ã°ããºã»ã¤ãã³ããªã©ï¼" class="on-sp"></a></p> 121 <p class="btn-article disabled"><a href=""><img src="https://nyanimon.com/images/btn_article.png" alt="ç¹éè¨äºç´¹ä»" class="on-pc"><img src="https://nyanimon.com/images/btn_article_sp.png" alt="ç¹éè¨äºç´¹ä»" class="on-sp"></a></p> 122 <p class="btn-introduce disabled"><a href=""><img src="https://nyanimon.com/images/btn_introduce.png" alt="çæ¿ãã³ç´¹ä»" class="on-pc"><img src="https://nyanimon.com/images/btn_introduce_sp.png" alt="çæ¿ãã³ç´¹ä»" class="on-sp"></a></p> 123</div> 124 <h2 class="header-example" id="example"><img src="images/header_example.png" alt="ä¾ãã°ãããªæ¥½ãã¿æ¹" class="on-pc"><img src="images/header_example_sp.png" alt="ä¾ãã°ãããªæ¥½ãã¿æ¹" class="on-sp"></h2> 125 <div class="example-list"> 126 <dl class="example-item"> 127 <dt class="photo"><img src="images/img_example1.jpg" alt=""></dt> 128 <dd class="title bg-pink">ãã³ãªã¼ãã¼å士ã®äº¤æµã«</dd> 129 </dl> 130 <dl class="example-item"> 131 <dt class="photo"><img src="images/img_example2.jpg" alt=""></dt> 132 <dd class="title bg-red">SNSã§ã®ãã³èªæ ¢ã«</dd> 133 </dl> 134 <dl class="example-item"> 135 <dt class="photo"><img src="images/img_example3.jpg" alt=""></dt> 136 <dd class="title bg-red">å®æå ¥ãã«</dd> 137 </dl> 138 <dl class="example-item"> 139 <dt class="photo"><img src="images/img_example4.jpg" alt=""></dt> 140 <dd class="title bg-pink">ã¹ããã±ã¼ã¹ã®ä¸ã«</dd> 141 </dl> 142 <dl class="example-item"> 143 <dt class="photo"><img src="images/img_example5.jpg" alt=""></dt> 144 <dd class="title bg-pink">æ è¡ãã´ã«ããªã©ã®ãã¼ã ã¿ã°ã«</dd> 145 </dl> 146 <dl class="example-item"> 147 <dt class="photo"><img src="images/img_example6.jpg" alt=""></dt> 148 <dd class="title bg-red">ã³ã¬ã¯ã·ã§ã³ã«</dd> 149 </dl> 150 </div> 151 </div> 152 <div class="threeStep-area" id="step"> 153 <h3 class="header-3step"><img src="images/head_3step.png" alt="3ã¹ãããã§ã«ã³ã¿ã³ä½æ"></h3> 154 <div class="step-list"> 155 <div class="step-item"> 156 <p class="image"><img src="images/img_step1.png" alt="Step1 ååºã®ãã¶ã¤ã³ãã³ãã¬ã¼ããé¸ã¶ 縦åã»æ¨ªåãªã©ãã好ã¿ã®ãã¶ã¤ã³ãã³ãã¬ã¼ãããé¸ã³ãã ããããã³ãã¬ã¼ãã¯éæãå¢ããã¦ããäºå®ã§ãã" class="on-pc"><img src="images/img_step1_sp.png" alt="Step1 ååºã®ãã¶ã¤ã³ãã³ãã¬ã¼ããé¸ã¶ 縦åã»æ¨ªåãªã©ãã好ã¿ã®ãã¶ã¤ã³ãã³ãã¬ã¼ãããé¸ã³ãã ããããã³ãã¬ã¼ãã¯éæãå¢ããã¦ããäºå®ã§ãã" class="on-sp"></p> 157 <p class="btn-original rover-hover"><a href="https://www.nyanimon.com/original" target="_blank"><img src="images/btn_original.png" alt="ææã®ãªãªã¸ãã«ãã¶ã¤ã³ååºã使ãããæ¹ã¯ã³ãã©" class="on-pc"><img src="images/btn_original_sp.png" alt="ææã®ãªãªã¸ãã«ãã¶ã¤ã³ååºã使ãããæ¹ã¯ã³ãã©" class="on-sp"></a></p> 158 </div> 159 <div class="step-item"> 160 <p class="image"><img src="images/img_step2.png" alt="Step2 åçãã¢ãããã¼ã æç«ã®ãæ°ã«å ¥ãã®åçãã¢ãããã¦ããµã¤ãºãåãã¨ãä½ç½®ã調æ´ãã¾ãã" class="on-pc"><img src="images/img_step2_sp.png" alt="Step2 åçãã¢ãããã¼ã æç«ã®ãæ°ã«å ¥ãã®åçãã¢ãããã¦ããµã¤ãºãåãã¨ãä½ç½®ã調æ´ãã¾ãã" class="on-sp"></p> 161 </div> 162 <div class="step-item"> 163 <p class="image"><img src="images/img_step3.png" alt="Step3 ããã¹ãæ å ±ã®ç»é² æç«ã®ååãæ§å¥ãã¾ããã®ä»ã«ç´¹ä»ãããæ å ±ãå ¥åï¼ãã£ããã³ãã¼ï¼æ§æ ¼ï¼å¥½ããªã¢ãï¼å¹´é½¢ï¼å種ãªã©ãªã©ï¼ãã¾ããååºè£é¢ã«æ²è¼ãã飼ã主æ å ±ï¼ååï¼ä½æï¼TELï¼E-mailï¼è¶£å³ï¼SNSã®IDãªã©ï¼ãèªç±é ç®ã§å ¥åãã¾ãã" class="on-pc"><img src="images/img_step3_sp.png" alt="Step3 ããã¹ãæ å ±ã®ç»é² æç«ã®ååãæ§å¥ãã¾ããã®ä»ã«ç´¹ä»ãããæ å ±ãå ¥åï¼ãã£ããã³ãã¼ï¼æ§æ ¼ï¼å¥½ããªã¢ãï¼å¹´é½¢ï¼å種ãªã©ãªã©ï¼ãã¾ããååºè£é¢ã«æ²è¼ãã飼ã主æ å ±ï¼ååï¼ä½æï¼TELï¼E-mailï¼è¶£å³ï¼SNSã®IDãªã©ï¼ãèªç±é ç®ã§å ¥åãã¾ãã" class="on-sp"></p> 164 </div> 165 <p class="img_complete"><img src="images/img_complete.png" alt="宿"></p> 166 </div> 167 <div class="step-detail"> 168 <div class="detail-item"> 169 <div class="detail-description"> 170 <p class="header-image sns"><img src="images/head_3step_sns.png" alt="SNSã§çºä¿¡ããããã®ç»åãã¼ã¿ã使"></p> 171 <p class="notice">â»H:1253pixelÃW:757pixelã®JPEGãã¼ã¿</p> 172 <p class="notice">â»ãã£ã«ãã主å¬ã§ã®ããã³ãªã¼ãã¼äº¤æµã¤ãã³ãã®å®æéå¬ã<br>8æä»¥éã§ä¼ç»ä¸ã§ãã</p> 173 <p class="description-text">ã¤ã³ã¹ã¿ã#nyanimonãã§ããã³èªæ ¢ããã³ãªã¼ãã¼<br>å士ã®äº¤æµããã¾ãããï¼</p> 174 </div> 175 <p class="description-image"><img src="images/img_sns.jpg" alt=""></p> 176 </div> 177 <div class="detail-item"> 178 <div class="detail-description"> 179 <p class="header-image pdf"><img src="images/head_3step_pdf.png" alt="å°å·ç¨PDFãã¼ã¿ãæå®ã¡ã¼ã«ã¢ãã¬ã¹ã«éä¿¡"></p> 180 <p class="description-text">
180ã¤ã³ã¿ã¼ãããå°å·ãªã©ã§ãªãªã¸ãã«ååºã<br>使ãã¾ãããï¼</p> 181 <p class="notice">â»ã©ã¯ã¹ã«ãæ¨å¥¨ï¼PDFå ¥ç¨¿æã«å³ä¸ã®ãåå¦çè¨å®ããã<br>ãä¸å¤®ããåãæããã®èª¿ç¯ãå¿ è¦ã</p> 182 </div> 183 <p class="description-image"><img src="images/img_pdf.jpg" alt=""></p> 184 <p class="btn-service"><a href="#" target="_blank"><img src="images/btn_service.png" alt="ååºã®å°å·ä»£è¡ãµã¼ãã¹" class="on-pc"><img src="images/btn_service_sp.png" alt="ååºã®å°å·ä»£è¡ãµã¼ãã¹" class="on-sp"></a></p> 185 </div> 186 </div> 187 </div> 188 189 <div class="creation-area"> 190 <form action="https://nyanimon.com/form" method="post" id="form"> 191 <input type="hidden" name="_token" value="Kx5vJjtdw7j4c0A5gkWCAMnt3Ks8BE5H5Jw8YL5z"> 192 <h4 class="img-now" id="make"><img src="images/img_now.png" alt="ãã£ãã使" class="on-pc"><img src="images/img_now_sp.png" alt="ãã£ãã使" class="on-sp"></h4> 193 <h5 class="header-step" id="makeStep1"><img src="images/head_step1.png" alt="step1 ååºãã¶ã¤ã³ã®ãã³ãã¬ã¼ãã鏿"></h5> 194 <div id="templateSelection"> 195 <div class="stickyWrap"> 196 <div class="stickyArea"> 197 <div class="template-list"> 198 <div class="template-item"><img data-lazy="images/samples/1-1-5.jpg" data-temp="1"></div> 199 <div class="template-item"><img data-lazy="images/samples/2-2-4.jpg" data-temp="2"></div> 200 <div class="template-item"><img data-lazy="images/samples/3-2-5.jpg" data-temp="3"></div> 201 <div class="template-item"><img data-lazy="images/samples/4-1-1.jpg" data-temp="4"></div> 202 <div class="template-item"><img data-lazy="images/samples/5-1-4.jpg" data-temp="5"></div> 203 <div class="template-item"><img data-lazy="images/samples/6-2-3.jpg" data-temp="6"></div> 204 <div class="template-item"><img data-lazy="images/samples/7-2-1.jpg" data-temp="7"></div> 205 <div class="template-item"><img data-lazy="images/samples/8-1-4.jpg" data-temp="8"></div> 206 <div class="template-item"><img data-lazy="images/samples/9-2-4.jpg" data-temp="9"></div> 207 <div class="template-item"><img data-lazy="images/samples/10-1-4.jpg" data-temp="10"></div> 208 <div class="template-item"><img data-lazy="images/samples/11-2-1.jpg" data-temp="11"></div> 209 <div class="template-item"><img data-lazy="images/samples/12-1-3.jpg" data-temp="12"></div> 210 <div class="template-item"><img data-lazy="images/samples/13-2-1.jpg" data-temp="13"></div> 211 <div class="template-item"><img data-lazy="images/samples/14-2-7.jpg" data-temp="14"></div> 212 <div class="template-item"><img data-lazy="images/samples/15-1-2.jpg" data-temp="15"></div> 213 <div class="template-item"><img data-lazy="images/samples/16-1-4.jpg" data-temp="16"></div> 214 <div class="template-item"><img data-lazy="images/samples/17-2-6.jpg" data-temp="17"></div> 215 <div class="template-item"><img data-lazy="images/samples/18-1-4.jpg" data-temp="18"></div> 216 <div class="template-item"><img data-lazy="images/samples/19-1-6.jpg" data-temp="19"></div> 217 <div class="template-item"><img data-lazy="images/samples/20-1-1.jpg" data-temp="20"></div> 218 <div class="template-item"><img data-lazy="images/samples/21-2-3.jpg" data-temp="21"></div> 219 <div class="template-item"><img data-lazy="images/samples/22-2-1.jpg" data-temp="22"></div> 220 <div class="template-item"><img data-lazy="images/samples/23-2-12.jpg" data-temp="23"></div> 221 <div class="template-item"><img data-lazy="images/samples/24-2-4.jpg" data-temp="24"></div> 222 <div class="template-item"><img data-lazy="images/samples/25-2-1.jpg" data-temp="25"></div> 223 <div class="template-item"><img data-lazy="images/samples/26-2-5.jpg" data-temp="26"></div> 224 <div class="template-item"><img data-lazy="images/samples/27-1-3.jpg" data-temp="27"></div> 225 <div class="template-item"><img data-lazy="images/samples/28-2-1.jpg" data-temp="28"></div> 226 <div class="template-item"><img data-lazy="images/samples/29-2-1.jpg" data-temp="29"></div> 227 <div class="template-item"><img data-lazy="images/samples/30-2-3.jpg" data-temp="30"></div> 228 <div class="template-item"><img data-lazy="images/samples/31-2-3.jpg" data-temp="31"></div> 229 <div class="template-item"><img data-lazy="images/samples/32-2-3.jpg" data-temp="32"></div> 230 <div class="template-item"><img data-lazy="images/samples/33-2-1.jpg" data-temp="33"></div> 231 <div class="template-item new"><img data-lazy="images/samples/34-1-1.jpg" data-temp="34"></div> 232 </div> 233 </div> 234 <button id="choose" type="button" class="customBtn" value="ãã®ãã³ãã¬ã¼ãã«ãã">ãã®ãã³ãã¬ã¼ãã«ãã</button> 235 <div id="templatePattern"> 236 <div> 237 <ul id="colorSelection"> 238 </ul> 239 </div> 240 <div><label id="directionBtn"><input type="checkbox" checked id="direction"></label></div> 241 </div> 242 </div> 243 <div class="template-list-nav"> 244 <div class="template-nav-item"><img data-lazy="images/samples/1-1-5.jpg"></div> 245 <div class="template-nav-item"><img data-lazy="images/samples/2-2-4.jpg"></div> 246 <div class="template-nav-item">
246<img data-lazy="images/samples/3-2-5.jpg"></div> 247 <div class="template-nav-item"><img data-lazy="images/samples/4-1-1.jpg"></div> 248 <div class="template-nav-item"><img data-lazy="images/samples/5-1-4.jpg"></div> 249 <div class="template-nav-item"><img data-lazy="images/samples/6-2-3.jpg"></div> 250 <div class="template-nav-item"><img data-lazy="images/samples/7-2-1.jpg"></div> 251 <div class="template-nav-item"><img data-lazy="images/samples/8-1-4.jpg"></div> 252 <div class="template-nav-item"><img data-lazy="images/samples/9-2-4.jpg"></div> 253 <div class="template-nav-item"><img data-lazy="images/samples/10-1-4.jpg"></div> 254 <div class="template-nav-item"><img data-lazy="images/samples/11-2-1.jpg"></div> 255 <div class="template-nav-item"><img data-lazy="images/samples/12-1-3.jpg"></div> 256 <div class="template-nav-item"><img data-lazy="images/samples/13-2-1.jpg"></div> 257 <div class="template-nav-item"><img data-lazy="images/samples/14-2-7.jpg"></div> 258 <div class="template-nav-item"><img data-lazy="images/samples/15-1-2.jpg"></div> 259 <div class="template-nav-item"><img data-lazy="images/samples/16-1-4.jpg"></div> 260 <div class="template-nav-item"><img data-lazy="images/samples/17-2-6.jpg"></div> 261 <div class="template-nav-item"><img data-lazy="images/samples/18-1-4.jpg"></div> 262 <div class="template-nav-item"><img data-lazy="images/samples/19-1-6.jpg"></div> 263 <div class="template-nav-item"><img data-lazy="images/samples/20-1-1.jpg"></div> 264 <div class="template-nav-item"><img data-lazy="images/samples/21-2-3.jpg"></div> 265 <div class="template-nav-item"><img data-lazy="images/samples/22-2-1.jpg"></div> 266 <div class="template-nav-item"><img data-lazy="images/samples/23-2-12.jpg"></div> 267 <div class="template-nav-item"><img data-lazy="images/samples/24-2-4.jpg"></div> 268 <div class="template-nav-item"><img data-lazy="images/samples/25-2-1.jpg"></div> 269 <div class="template-nav-item"><img data-lazy="images/samples/26-2-5.jpg"></div> 270 <div class="template-nav-item"><img data-lazy="images/samples/27-1-3.jpg"></div> 271 <div class="template-nav-item"><img data-lazy="images/samples/28-2-1.jpg"></div> 272 <div class="template-nav-item"><img data-lazy="images/samples/29-2-1.jpg"></div> 273 <div class="template-nav-item"><img data-lazy="images/samples/30-2-3.jpg"></div> 274 <div class="template-nav-item"><img data-lazy="images/samples/31-2-3.jpg"></div> 275 <div class="template-nav-item"><img data-lazy="images/samples/32-2-3.jpg"></div> 276 <div class="template-nav-item"><img data-lazy="images/samples/33-2-1.jpg"></div> 277 <div class="template-nav-item new"><img data-lazy="images/samples/34-1-1.jpg"></div> 278 </div> 279 </div> 280 281 282 283 284 <div class="nextStep-area"> 285 <p class="img-nextArrow step2"><img src="images/bg_next_black.png" alt=""></p> 286 <div class="upload-area"> 287 <h5 class="header-step" id="makeStep2"><img src="images/head_step2.png" alt="step2 åçãã¢ãããã¼ã" class="on-pc"><img src="images/head_step2_sp.png" alt="step2 åçãã¢ãããã¼ã" class="on-sp"></h5> 288 <div class="uploader-container" id="imgContainer"> 289 <p class="frame"> 290 <img id="crop" src="images/img_photo.png" alt="photo upload" style="display: none;"> 291 <!--<img src="images/img_photo_sp.png" alt="photo upload" class="on-sp">--> 292 </p> 293 <p class="btn-upload"> 294 <!--<a href="javascript:void(0)" onclick="$('#upload_img').click()"><img src="images/btn_upload.png" class="on-pc rover-hover"></a>--> 295 <!--<a href="javascript:void(0)" onclick="$('#upload_img').click()"><img src="images/btn_upload_sp.png" class="on-sp"></a>--> 296 <input type="file" id="upload_img" name="file" style="display:none" accept="image/*"> 297 </p> 298 <div id="imgBtnBox"> 299 <button type="button" class="customBtn" id="whenUploadImg" onclick="$('#upload_img').click()">åçãã¢ãããã¼ã</button> 300 <div id="whenUploadedImg" style="display: none"> 301 <button type="button" id="changeImgBtn" class="customBtn close" onclick="$('#upload_img').click()">ç»åãå¤ãã</button><button type="button" id="commitImgBtn" class="customBtn" onclick="scrollToPosition('make_step3')">ããã§OK</button>
302 <span>â»åçãæ¡å¤§ã»ç¸®å°ã§ãã¾ãï¼PCçã¯ãã¦ã¹ãã¤ã¼ã«ï¼</span> 303 </div> 304 </div> 305 </div> 306 </div> 307 <p class="img-nextArrow"><img src="images/bg_next_black.png" alt=""></p> 308 <div class="text-info-area"> 309 <h5 class="header-step" id="make_step3"><img src="images/head_step3.png" alt="step3 ããã¹ãæ å ±ã®å ¥å" class="on-pc"><img src="images/head_step3_sp.png" alt="step3 ããã¹ãæ å ±ã®å ¥å" class="on-sp"></h5> 310 <div class="input-area"> 311 <p class="form-header">表é¢:ãã³æ å ±</p> 312 <dl class="input-list"> 313 <dt class="input-header required">ãã³ã®ãåå</dt> 314 <dd class="input-body"> 315 <p class="textArea-example">æåã®å¤§ããã«ãã£ã¦æåæ°å¶éãç°ãªãã¾ã<br><small style="font-size:0.75em">ï¼å¤§ï¼5æåã¾ã§ ï¼ ä¸ï¼7æåã¾ã§ ï¼ å°ï¼10æåã¾ã§ï¼</small></p> 316 <div class="counter"> 317 <lable class="inputGroup"><select id="size"> 318 <option value="L">大</option> 319 <option value="M">ä¸</option> 320 <option value="S">å°</option> 321 </select><input type="text" class="text-box" id="name" required maxlength="5" placeholder="5æåã¾ã§å ¥åã§ãã¾ã"></lable> 322 <span class="limit">0/5</span> 323 </div> 324 </dd> 325 <dt class="input-header">æ§å¥</dt> 326 <dd class="input-body"> 327 <label>æªé¸æ 328 <input type="radio" name="sex" class="radio-btn" value=2 id="genderless" checked> 329 <label for="genderless"></label> 330 </label> 331 <label>ãªã¹ 332 <span class="icon">â</span><input type="radio" name="sex" class="radio-btn" value=0 id="male"> 333 <label for="male"></label> 334 </label> 335 <label>ã¡ã¹ 336 <span class="icon">â</span><input type="radio" name="sex" class="radio-btn" value=1 id="female"> 337 <label class="female" for="female"></label> 338 </label> 339 </dd> 340 <dt class="input-header long required">èªç±é ç®</dt> 341 <dd class="input-body"> 342 <p class="textArea-example">ãã¨ãã°ï¼ãã£ããã³ãã¼ ï¼ æ§æ ¼ ï¼ å¥½ããªã¢ã ï¼ å¹´é½¢ ï¼ å種ãªã©</p> 343 <div class="counter"> 344 <div class="text-group"> 345 <label><input type="text" class="text-box" name="front_free" required maxlength="15" placeholder="1è¡ç®"></label> 346 <label><input type="text" class="text-box" name="front_free" maxlength="15" placeholder="2è¡ç®"></label> 347 <label><input type="text" class="text-box" name="front_free" maxlength="15" placeholder="3è¡ç®"></label> 348 </div> 349 350 351 <span class="limit"></span> 352 </div> 353 </dd> 354 <dt class="input-header long">ãã©ã³ãè¨å®</dt> 355 <dd class="input-body"> 356 <p class="textArea-example">ãã©ã³ã ï¼ æåè²</p> 357 <div class="fontSetting"> 358 <select id="font"> 359 <optgroup label="ã´ã·ãã¯ä½"> 360 <option value="Noto Sans JP" class="notosans">Noto Sans JP</option> 361 <option value="Sawarabi Gothic" class="sawarabiG">ãããã³ã´ã·ãã¯</option> 362 </optgroup> 363 <optgroup label="ææä½"> 364 <option value="Noto Serif SC" class="NotoSerifSC">Noto Serif SC</option> 365 <option value="Sawarabi Mincho" class="sawarabiM">ãããã³ææ</option> 366 </optgroup> 367 <optgroup label="丸æå"> 368 <option value="M PLUS Rounded 1c" selected class="msplus1c">M PLUS Rounded 1c</option> 369 <option value="Kosugi Maru" class="KosugiMaru">Kosugi Maru</option> 370 </optgroup> 371 </select> 372 <input style="width:100px;" id="color" value="#000000"> 373 </div> 374 <blockquote id="sampleText" class="msplus">æåsampleã§ããã£ã</blockquote> 375 </dd> 376 </dl> 377 <p class="form-header">è£é¢:飼ã主æ å ±</p> 378 <dl class="input-list"> 379 <dt class="input-header long">èªç±é ç®</dt> 380 <dd class="input-body"> 381 <p class="textArea-example">
381ãã¨ãã°ï¼åå ï¼ ä½æ ï¼TEL ï¼ E-mail ï¼ è¶£å³ ï¼SNSã®IDãªã©</p> 382 <div class="counter"> 383 <div class="text-group"> 384 <label><input type="text" class="text-box" name="back_free" maxlength="32" placeholder="1è¡ç®"></label> 385 <label><input type="text" class="text-box" name="back_free" maxlength="32" placeholder="2è¡ç®"></label> 386 <label><input type="text" class="text-box" name="back_free" maxlength="32" placeholder="3è¡ç®"></label> 387 <label style="display: none;"><input type="text" class="text-box back_free_vertical" name="back_free" maxlength="18" placeholder="4è¡ç®"></label> 388 <label style="display: none;"><input type="text" class="text-box back_free_vertical" name="back_free" maxlength="18" placeholder="5è¡ç®"></label> 389 </div> 390 </div> 391 </dd> 392 </dl> 393 </div> 394 <p class="img-nextArrow"><img src="images/bg_next_black.png" alt=""></p> 395 <p class="btn-make"> 396 <span class="notice">â»åçã®ã¢ãããã¼ããããã³ã®ãååããããã³æ å ±ï¼èªç±é ç®ãã¯å¿ é é ç®ã§ã</span> 397 398 <button id="create" type="button" disabled> 399 <img src="images/btn_make.png" alt="ååºã使ãã" class="on-pc rover-hover"> 400 <img src="images/btn_make_sp.png" alt="ååºã使ãã" class="on-sp"> 401 </button> 402 403 404 <span class="notice">â»ã¯ãªãã¯ããã¨ãååºãã¬ãã¥ã¼ï¼è£ã»è¡¨ï¼ã表示ããã¾ãã</span> 405 <span class="notice">â»ç¸¦åã®ååºã®å ´åãã¹ã¯ãã¼ã«ãã¦è£é¢ãã確èªãã ããã</span> 406 <span class="notice">â»Safari(iOS10以ä¸), <a href="https://www.google.co.jp/chrome/" class="text_link" target="_blank">Chrome</a>以å¤ã®ç°å¢ã§ã¯æ£ããåä½ããªãå ´åãããã¾ã</span> 407 <span class="notice">â»ã@nyanimon.comãããã®åä¿¡ãæå¹ã«ãã¦ãã ãã</span> 408 </p> 409 <p class="bnr-print rover-hover"><a href="https://nyanimon.kawaiishop.jp/items/18319522" target="_blank"><img src="images/bnr_print.jpg" alt="ä½ã£ãååºãå°å·ããã"></a></p> 410 <p class="bnr-neco-demy"><a href="https://necodemy.stores.jp/" target="_blank"><img src="/images/bnr_neco-demy01.jpg" alt=""></a></p> 411 <div class="other-btns"> 412 <p class="btn-shop rover-hover"><a href="https://nyanimon.kawaiishop.jp/" target="_blank"><img src="https://nyanimon.com/images/btn_shop.png" alt="ãã£ã«ããã·ã§ããï¼å°å·ä»£è¡ã»ã°ããºã»ã¤ãã³ããªã©ï¼" class="on-pc"><img src="https://nyanimon.com/images/btn_shop_sp.png" alt="ãã£ã«ããã·ã§ããï¼å°å·ä»£è¡ã»ã°ããºã»ã¤ãã³ããªã©ï¼" class="on-sp"></a></p> 413 <p class="btn-article disabled"><a href=""><img src="https://nyanimon.com/images/btn_article.png" alt="ç¹éè¨äºç´¹ä»" class="on-pc"><img src="https://nyanimon.com/images/btn_article_sp.png" alt="ç¹éè¨äºç´¹ä»" class="on-sp"></a></p> 414 <p class="btn-introduce disabled"><a href=""><img src="https://nyanimon.com/images/btn_introduce.png" alt="çæ¿ãã³ç´¹ä»" class="on-pc"><img src="https://nyanimon.com/images/btn_introduce_sp.png" alt="çæ¿ãã³ç´¹ä»" class="on-sp"></a></p> 415</div> </div> 416 </div> 417 </form> 418 </div> 419 <div class="pageTop-wrapper"> 420 <p class="btn-pageTop"><a href="#" class="rover-hover"><img src="images/btn_pagetop.png" alt="page top"></a></p> 421 </div> 422 </div> 423 <p class="fixed-btn"><a href="#make" class="rover-hover"><img src="images/btn_now.png" alt="ãã£ãã使"></a></p> 424 <footer class="footer"> 425 <p class="logo">nyanimon</p> 426 <ul class="menu-list"> 427 <li class="menu-item"><a href="https://nyanimon.com" class="rover-hover">ãµã¤ãããã</a></li> 428 <li class="menu-item"><a href="https://nyanimon.com/#example" class="rover-hover">楽ãã¿æ¹</a></li> 429 <li class="menu-item"><a href="https://nyanimon.com/#step" class="rover-hover">使ã¹ããã</a></li> 430 <li class="menu-item"><a href="https://nyanimon.com/#make" class="rover-hover">使ãã</a></li> 431 <li class="menu-item"><a href="https://www.necocochi.co.jp" target="_blank" class="rover-hover">éå¶ä¼ç¤¾</a></li> 432 </ul> 433 <div class="sns-btns"> 434 <p class="fb"><a href="https://twitter.com/nyanimon0222" target="_blank" class="rover-hover"><img src="https://nyanimon.com/images/ico_tw_white.png" alt="twitter"></a></p><p class="ig"><a href="https://www.instagram.com/nyanimon" target="_blank" class="rover-hover"><img src="https://nyanimon.com/images/ico_ig_white.png" alt="instagram"></a></p> 435 </div> 436 <p class="privacy"><a href="https://www.necocochi.co.jp/privacy/" target="_blank" class="rover-hover">ãã©ã¤ãã·ã¼ããªã·ã¼</a></p> 437 <p class="copyright">
437Copyright © 2018 necocochi Co., Ltd All Rights Reserved.</p> 438</footer> <div id="modal"> 439 <!-- åºåé¨å --> 440 <div id="modalContainer"> 441 <div id="preview"> 442 <div id="preview_front"></div> 443 <div id="preview_back"></div> 444 </div> 445 </div> 446 <div id="modal_footer"> 447 <div class="btnBox"> 448 <button id="cancel" type="button" class="customBtn close">ããç´ã</button> 449 <button id="generate" type="button" class="customBtn" disabled>ããã§OK</button> 450 </div> 451 <small>â»å®éã®ã§ããããã¨ç°ãªãå ´åããããã¾ã</small> 452 </div> 453 </div> 454</div> 455
456<script> 457 var callSwiper = function () { 458 var mySwiper = new Swiper ('.swiper-container', { 459 effect: "fade", 460 loop: true, 461 autoplay: { 462 delay: 3400 463 }, 464 speed: 1200 465 }); 466 }; 467 $('#firstContent').hide(); 468 Loader.start(); 469 $(window).load(function () { 470 var ahash = location.hash; 471 Loader.end(); 472 if(!ahash) return $('#firstContent').fadeIn('slow', callSwiper); 473 var gotoNum = $(ahash).offset().top; 474 $('html,body').animate({ scrollTop: gotoNum }, 0 ); 475 $('#firstContent').fadeIn('slow', callSwiper); 476 }); 477 478 $(function () { 479 $('#font option').each(function () { 480 $('#font').val($(this).val()).change(); 481 }) 482 $('#font').val($('#font option:first-child').val()).change(); 483 }); 484 485 $('#font').change(function () { 486 var sample = $('#sampleText'); 487 var className = $(this).find(':selected').attr('class'); 488 sample.removeClass().addClass(className).css('color', $('#color').val()).css('background', ($('#color').val() == '#ffffff' ? '#ccc' : '#fff')); 489 }); 490 491 $('#color').on('change', function () { 492 $('#sampleText').css('color', $(this).val()).css('background', ($(this).val() == '#ffffff' ? '#ccc' : '#fff')) 493 }); 494 495 $(function () { 496 Displayed = new FrameDisplay($('.template-list .slick-current').find('img').data('temp')); 497 }); 498 499</script>
499 500</body> 501</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.