Repository navigation
Expand file tree
/
Copy pathfumannote.html
More file actions
349 lines (333 loc) · 35.4 KB
/
Copy pathfumannote.html
File metadata and controls
349 lines (333 loc) · 35.4 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>不満ノート — 書いた不満を、相手の言い分に書き直す iOS アプリ</title>
<link rel="canonical" href="https://rustyworks.jp/fumannote.html">
<meta name="description" content="モヤモヤしたことを書き出すと、相手が本当は言うべきだった言葉を、相手の視点で書き直します。頼んだときだけ、その怒りについての整理も返します。iOS アプリ。">
<meta property="og:type" content="website">
<meta property="og:site_name" content="RustyWorks">
<meta property="og:locale" content="ja_JP">
<meta property="og:url" content="https://rustyworks.jp/fumannote.html">
<meta property="og:title" content="不満ノート — 書いた不満を、相手の言い分に書き直す iOS アプリ">
<meta property="og:description" content="モヤモヤしたことを書き出すと、相手が本当は言うべきだった言葉を、相手の視点で書き直します。iOS アプリ。">
<meta property="og:image" content="https://rustyworks.jp/assets/og/fumannote-og.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="不満ノート — 書いた不満を、相手の言い分に書き直す iOS アプリ">
<meta name="twitter:description" content="モヤモヤしたことを書き出すと、相手が本当は言うべきだった言葉を、相手の視点で書き直します。iOS アプリ。">
<meta name="twitter:image" content="https://rustyworks.jp/assets/og/fumannote-og.jpg">
<link rel="icon" href="assets/icons/fumannote.png">
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Zen+Kaku+Gothic+New:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet">
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
background: #f5f0e3;
color: #1f1e1a;
font-family: 'Zen Kaku Gothic New', system-ui, sans-serif;
font-weight: 400;
line-height: 1.75;
text-rendering: optimizeLegibility;
}
a { color: #a8421f; text-decoration: none; transition: color .18s ease; }
a:hover { color: #7d2f10; }
::selection { background: rgba(168,66,31,.18); color: #1f1e1a; }
@keyframes fs-rise {
from { opacity: 0; transform: translateY(14px); }
to { opacity: 1; transform: translateY(0); }
}
.fs-screen {
display: grid;
grid-template-columns: 340px 1fr;
gap: 56px;
align-items: center;
padding: 56px 0;
border-top: 1px solid rgba(31,30,26,.08);
}
.fs-screen:first-of-type { border-top: none; padding-top: 8px; }
.fs-screen img {
width: 100%;
height: auto;
border-radius: 14px;
border: 1px solid rgba(31,30,26,.10);
background: #fffdf7;
}
.fs-screen-num {
font-family: 'IBM Plex Mono', monospace;
font-size: 12.5px;
letter-spacing: .16em;
color: #a8421f;
margin-bottom: 14px;
}
.fs-screen h3 {
font-family: 'Space Grotesk', 'Zen Kaku Gothic New', sans-serif;
font-weight: 500;
font-size: 26px;
line-height: 1.5;
margin-bottom: 14px;
}
.fs-screen p { color: #3d3a33; line-height: 1.9; }
@media (max-width: 860px) {
.fs-screen { grid-template-columns: 1fr; gap: 28px; padding: 44px 0; }
.fs-screen img { max-width: 320px; }
}
@media (max-width: 760px) {
#fs-nav-links { display: none !important; }
/* 狭いと収まらないので、製品名を落としてトップへの導線を残す */
.site-mark { display: none !important; }
.fs-two-col { grid-template-columns: 1fr !important; }
.fs-pad { padding-left: 24px !important; padding-right: 24px !important; }
#fs-hero-title { white-space: normal !important; font-size: 34px !important; }
}
</style>
</head>
<body>
<div style="min-height:100vh; display:flex; flex-direction:column;">
<nav style="position:sticky; top:0; z-index:50; background:rgba(245,240,227,.88); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid rgba(31,30,26,.08);">
<div class="fs-pad" style="max-width:1200px; margin:0 auto; padding:0 40px; height:64px; display:flex; align-items:center; justify-content:space-between; gap:24px;">
<span style="display:flex; align-items:center;"><a class="site-home" href="index.html" style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.04em; color:#6b675c; margin-right:18px;" data-ja="← RustyWorks" data-en="← RustyWorks">← RustyWorks</a><a class="site-mark" href="#top" style="font-family:'Space Grotesk',sans-serif; font-weight:700; letter-spacing:.14em; font-size:15px; color:#1f1e1a;">FUMANNOTE</a></span>
<div id="fs-nav-links" style="display:flex; align-items:center; gap:32px; font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.04em;">
<a href="#screens" style="color:#6b675c;" data-ja="画面" data-en="Screens">画面</a>
<a href="#what" style="color:#6b675c;" data-ja="できること" data-en="What it does">できること</a>
<a href="#later" style="color:#6b675c;" data-ja="説教しない" data-en="No lectures">説教しない</a>
<a href="#price" style="color:#6b675c;" data-ja="料金" data-en="Pricing">料金</a>
<a href="#limits" style="color:#6b675c;" data-ja="正直なところ" data-en="Honest limits">正直なところ</a>
<a href="fumannote_manual.html" style="color:#6b675c;" data-ja="使い方" data-en="Manual">使い方</a>
</div>
<div style="display:flex; align-items:center; gap:14px;">
<div class="lang" role="group" aria-label="Language" style="display:flex; align-items:center; gap:2px; font-family:'IBM Plex Mono',monospace; font-size:12px;">
<button type="button" data-lang="ja" aria-pressed="true" style="font:inherit; background:none; border:0; cursor:pointer; color:#1f1e1a; padding:4px 6px; border-radius:4px;">JA</button>
<span style="color:#c9c3b2;">/</span>
<button type="button" data-lang="en" aria-pressed="false" style="font:inherit; background:none; border:0; cursor:pointer; color:#9b9585; padding:4px 6px; border-radius:4px;">EN</button>
</div>
<a href="https://apps.apple.com/jp/app/id6799295082?pt=128819275&ct=website&mt=8" target="_blank" rel="noopener" style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.03em; color:#ffffff; background:#a8421f; border:1px solid #a8421f; padding:8px 18px; border-radius:6px; white-space:nowrap;" data-ja="App Store" data-en="App Store">App Store</a>
</div>
</div>
</nav>
<main id="top" style="flex:1;">
<!-- HERO -->
<section class="fs-pad" style="max-width:1200px; margin:0 auto; padding:140px 40px 120px; animation:fs-rise .7s ease both;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.16em; color:#a8421f; margin-bottom:34px;">iOS APP</div>
<h1 id="fs-hero-title" style="font-family:'Space Grotesk','Zen Kaku Gothic New',sans-serif; font-weight:500; font-size:min(7.4vw, 88px); line-height:1.1; letter-spacing:-.01em; white-space:nowrap;"><span data-ja="言ってほしかった言葉を、" data-en="The words you wanted">言ってほしかった言葉を、</span><br><span data-ja="代わりに書きます。" data-en="to hear, written for you.">代わりに書きます。</span></h1>
<p style="margin-top:38px; font-size:20px; line-height:1.9; color:#6b675c; max-width:52ch;" data-ja="腹が立ったことを、そのままの言葉で書き出すノートです。書いたものを、相手が本当は言うべきだった言葉に書き直します。謝ってもらえなかった相手の代わりに。" data-en="A notebook for writing down what made you angry, in your own words. What you write is then rewritten as the words the other person should have said — standing in for the apology you never got.">腹が立ったことを、そのままの言葉で書き出すノートです。書いたものを、相手が本当は言うべきだった言葉に書き直します。謝ってもらえなかった相手の代わりに。</p>
<div style="margin-top:44px; display:flex; flex-wrap:wrap; gap:12px;">
<span style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#1f1e1a; border:1px solid rgba(31,30,26,.18); padding:8px 15px; border-radius:6px;" data-ja="相手目線の釈明" data-en="Their side of it">相手目線の釈明</span>
<span style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#1f1e1a; border:1px solid rgba(31,30,26,.18); padding:8px 15px; border-radius:6px;" data-ja="押したときだけ分析" data-en="Analysis only on request">押したときだけ分析</span>
<span style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#1f1e1a; border:1px solid rgba(31,30,26,.18); padding:8px 15px; border-radius:6px;" data-ja="アカウント不要" data-en="No account needed">アカウント不要</span>
<span style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#1f1e1a; border:1px solid rgba(31,30,26,.18); padding:8px 15px; border-radius:6px;" data-ja="無料でも使える" data-en="Free tier included">無料でも使える</span>
</div>
<div style="margin-top:48px; display:flex; flex-wrap:wrap; gap:14px; align-items:center;">
<a href="https://apps.apple.com/jp/app/id6799295082?pt=128819275&ct=website&mt=8" target="_blank" rel="noopener" style="display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:14px; color:#ffffff; background:#a8421f; border:1px solid #a8421f; padding:15px 30px; border-radius:8px;" data-ja="App Store で入手" data-en="Get it on the App Store">App Store で入手</a>
<span style="font-family:'IBM Plex Mono',monospace; font-size:13px; color:#6b675c;" data-ja="iOS · 日本語 · 無料 + 月額300円" data-en="iOS · Japanese only · Free + ¥300/month">iOS · 日本語 · 無料 + 月額300円</span>
</div>
</section>
<!-- SCREENS -->
<section id="screens" class="fs-pad" style="max-width:1100px; margin:0 auto; padding:0 40px 120px;">
<div style="border-top:1px solid rgba(31,30,26,.10); padding-top:80px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.16em; color:#a8421f; margin-bottom:44px;">SCREENS</div>
<div class="fs-screen">
<img src="assets/shots/fumannote-01.jpg" width="780" height="1687" loading="lazy" decoding="async" alt="生成された文章。相手の一人称で、金曜の18時に月曜朝までの対応を依頼したことを認め、事情を説明し、非を認める内容が並んでいる。">
<div>
<div class="fs-screen-num">01</div>
<h3 data-ja="相手の一人称で返ってくる" data-en="Written in their first person">相手の一人称で返ってくる</h3>
<p data-ja="「本当はこう言ってほしかった」を、相手の立場から書きます。何が起きたかを認め、事情を説明し、非を認めるところまで。書いた人の感情を否定しません。" data-en="What you wish they had said, written from their side: acknowledging what happened, explaining the circumstances, and admitting fault. It never dismisses how you felt.">「本当はこう言ってほしかった」を、相手の立場から書きます。何が起きたかを認め、事情を説明し、非を認めるところまで。書いた人の感情を否定しません。</p>
</div>
</div>
<div class="fs-screen">
<img src="assets/shots/fumannote-02.jpg" width="780" height="1687" loading="lazy" decoding="async" alt="ノートの入力画面。「誰に?何に?」に「仕事」、本文に金曜18時の依頼についての不満。下に「相手目線の釈明」と「この怒りについて調べる」。">
<div>
<div class="fs-screen-num">02</div>
<h3 data-ja="うまく言えなくていい" data-en="You do not have to put it well">うまく言えなくていい</h3>
<p data-ja="整った言葉である必要はありません。誰にも見せないので、思ったままの言い方で書けます。1行目に日付を書けば、その日の記録として扱われます。" data-en="It does not need to be polished. No one else sees it, so write it exactly as it comes. Put a date on the first line and it is filed as that day's entry.">整った言葉である必要はありません。誰にも見せないので、思ったままの言い方で書けます。1行目に日付を書けば、その日の記録として扱われます。</p>
</div>
</div>
<div class="fs-screen">
<img src="assets/shots/fumannote-03.jpg" width="780" height="1687" loading="lazy" decoding="async" alt="「この怒りについて」。怒りの強さ7、その下にあった気持ちは「軽視された感覚」、大事にしていたこと、いま動かせる範囲が並んでいる。">
<div>
<div class="fs-screen-num">03</div>
<h3 data-ja="押したときだけ調べる" data-en="It looks deeper only when you ask">押したときだけ調べる</h3>
<p data-ja="怒りの強さ、その下にあった気持ち、大事にしていた前提。決めつけではなく、書かれた文章から読み取れた範囲で示します。自動では走りません。" data-en="The strength of the anger, the feeling underneath it, what you were holding as important. Not a verdict — only what can be read from what you wrote. It never runs on its own.">怒りの強さ、その下にあった気持ち、大事にしていた前提。決めつけではなく、書かれた文章から読み取れた範囲で示します。自動では走りません。</p>
</div>
</div>
<div class="fs-screen">
<img src="assets/shots/fumannote-04.jpg" width="780" height="1687" loading="lazy" decoding="async" alt="「AIアドバイス」。依頼日時を記録する、対応できる範囲を区切って伝える、負担が続く場合は相談窓口へ共有する、といった行動が並んでいる。">
<div>
<div class="fs-screen-num">04</div>
<h3 data-ja="自分だけで動ける一歩" data-en="A step you can take alone">自分だけで動ける一歩</h3>
<p data-ja="相手に期待することは書きません。記録の残し方、次に同じことが起きたときの伝え方など、自分の意思だけで実行できることを並べます。" data-en="Nothing that depends on the other person changing. How to keep a record, how to put it next time — only things you can carry out on your own.">相手に期待することは書きません。記録の残し方、次に同じことが起きたときの伝え方など、自分の意思だけで実行できることを並べます。</p>
</div>
</div>
<div class="fs-screen">
<img src="assets/shots/fumannote-05.jpg" width="780" height="1687" loading="lazy" decoding="async" alt="ホーム画面。「ここに書いて大丈夫」の見出しと「今の気持ちを書き出す」ボタン。その下に「役所」「友だち」「近所」「買い物」のノートが並んでいる。">
<div>
<div class="fs-screen-num">05</div>
<h3 data-ja="開くたび、すぐ書ける" data-en="Open it and start writing">開くたび、すぐ書ける</h3>
<p data-ja="腹が立った瞬間に開くものなので、書き始めるまでを最短にしてあります。過去のノートは下に並び、同じ相手や場面が繰り返していれば、それも見えます。" data-en="You open this the moment you are angry, so getting to a blank page is as short as it can be. Past notes sit below, and if the same person or situation keeps coming back, that shows too.">腹が立った瞬間に開くものなので、書き始めるまでを最短にしてあります。過去のノートは下に並び、同じ相手や場面が繰り返していれば、それも見えます。</p>
</div>
</div>
</div>
</section>
<!-- WHAT -->
<section id="what" class="fs-pad" style="max-width:1200px; margin:0 auto; padding:0 40px 120px;">
<div style="border-top:1px solid rgba(31,30,26,.10); padding-top:80px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.16em; color:#a8421f; margin-bottom:28px;">WHAT IT DOES</div>
<h2 style="font-family:'Space Grotesk','Zen Kaku Gothic New',sans-serif; font-weight:500; font-size:min(5vw,44px); line-height:1.3; margin-bottom:32px;"><span data-ja="気の利いた言い換えでは" data-en="This is not a clever">気の利いた言い換えでは</span><br><span data-ja="ありません。" data-en="rewording.">ありません。</span></h2>
<div class="fs-two-col" style="display:grid; grid-template-columns:1fr 1fr; gap:56px; margin-top:48px;">
<div>
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#a8421f; margin-bottom:14px;">FROM THE OTHER SIDE</div>
<p style="color:#3d3a33; line-height:1.9;"><span data-ja="書いた不満を、" data-en="It takes what you wrote and rewrites it ">書いた不満を、</span><strong style="color:#1f1e1a;" data-ja="相手の一人称で" data-en="in the other person's first person">相手の一人称で</strong><span data-ja="書き直します。何が起きたのかを認め、こちら側の事情を説明し、それを言い訳にせず非を認める。相手がそう言ってくれていたら、こじれずに済んだはずの言葉です。" data-en=". It acknowledges what happened, explains the circumstances on their side, and admits fault without using those circumstances as an excuse — the words that, had they actually been said, would have kept things from souring.">書き直します。何が起きたのかを認め、こちら側の事情を説明し、それを言い訳にせず非を認める。相手がそう言ってくれていたら、こじれずに済んだはずの言葉です。</span></p>
</div>
<div>
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#a8421f; margin-bottom:14px;">YOUR OWN WORDS FIRST</div>
<p style="color:#3d3a33; line-height:1.9;"><span data-ja="まず" data-en="What matters first is ">まず</span><strong style="color:#1f1e1a;" data-ja="そのままの言葉で書けること" data-en="being able to write in your own words">そのままの言葉で書けること</strong><span data-ja="を大事にしています。丁寧に書き直す必要も、誰かに見せる必要もありません。整えるのは、書き終わってからで足ります。" data-en=". There is no need to rewrite it politely, and no one else has to see it. Tidying up can wait until you have finished.">を大事にしています。丁寧に書き直す必要も、誰かに見せる必要もありません。整えるのは、書き終わってからで足ります。</span></p>
</div>
</div>
</div>
</section>
<!-- LATER -->
<section id="later" class="fs-pad" style="max-width:1200px; margin:0 auto; padding:0 40px 120px;">
<div style="border-top:1px solid rgba(31,30,26,.10); padding-top:80px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.16em; color:#a8421f; margin-bottom:28px;">ONLY IF YOU ASK</div>
<h2 style="font-family:'Space Grotesk','Zen Kaku Gothic New',sans-serif; font-weight:500; font-size:min(5vw,44px); line-height:1.3; margin-bottom:32px;"><span data-ja="頼まない限り、" data-en="Until you ask,">頼まない限り、</span><br><span data-ja="何も言いません。" data-en="it says nothing.">何も言いません。</span></h2>
<p style="color:#3d3a33; line-height:1.9; max-width:64ch;"><span data-ja="書いた直後に「あなたはこういう前提を持っています」と返されても、説教にしかなりません。だから" data-en="Being told "here is the assumption you were holding" right after writing would only be a lecture. So ">書いた直後に「あなたはこういう前提を持っています」と返されても、説教にしかなりません。だから</span><strong style="color:#1f1e1a;" data-ja="自分からは出しません。" data-en="it never offers this on its own.">自分からは出しません。</strong><span data-ja="「この怒りについて調べる」を押したときだけ、整理して返します。" data-en=" It answers only when you press 「この怒りについて調べる」 (Look into this anger).">「この怒りについて調べる」を押したときだけ、整理して返します。</span></p>
<div class="fs-two-col" style="display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:48px;">
<div style="background:#fffdf7; border:1px solid rgba(31,30,26,.10); border-radius:10px; padding:28px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12px; color:#a8421f; margin-bottom:10px;" data-ja="押さなければ" data-en="If you never press it">押さなければ</div>
<p style="color:#6b675c; line-height:1.9;" data-ja="相手の言い分だけが表示されます。分析も、助言も、評価も出しません。" data-en="You see only the other person's side. No analysis, no advice, no assessment.">相手の言い分だけが表示されます。分析も、助言も、評価も出しません。</p>
</div>
<div style="background:#fffdf7; border:1px solid rgba(31,30,26,.10); border-radius:10px; padding:28px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12px; color:#a8421f; margin-bottom:10px;" data-ja="押したときだけ" data-en="Only when you do">押したときだけ</div>
<p style="color:#6b675c; line-height:1.9;" data-ja="そのとき何に引っかかっていたのか、その下にどんな気持ちがあったのか、いま自分で動かせる範囲はどこかを表示します。" data-en="It shows what was actually snagging at you, the feeling underneath it, and how much of the situation is within your own reach.">そのとき何に引っかかっていたのか、その下にどんな気持ちがあったのか、いま自分で動かせる範囲はどこかを表示します。</p>
</div>
</div>
</div>
</section>
<!-- PRICE -->
<section id="price" class="fs-pad" style="max-width:1200px; margin:0 auto; padding:0 40px 120px;">
<div style="border-top:1px solid rgba(31,30,26,.10); padding-top:80px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.16em; color:#a8421f; margin-bottom:28px;">PRICING</div>
<h2 style="font-family:'Space Grotesk','Zen Kaku Gothic New',sans-serif; font-weight:500; font-size:min(5vw,44px); line-height:1.3; margin-bottom:32px;" data-ja="違うのは、回数だけです。" data-en="The only difference is how many times.">違うのは、回数だけです。</h2>
<p style="color:#3d3a33; line-height:1.9; max-width:64ch;"><span data-ja="無料と有料で、書き直しの質は変わりません。変わるのは月に使える回数だけです。使い切っても、簡易版に切り替わって書き続けられます。" data-en="Free and paid produce the same quality of writing. All that changes is how many times a month you can use it. Even once you run out, it switches to a simplified version and you keep writing. ">無料と有料で、書き直しの質は変わりません。変わるのは月に使える回数だけです。使い切っても、簡易版に切り替わって書き続けられます。</span><strong style="color:#1f1e1a;" data-ja="アプリが使えなくなることはありません。" data-en="The app never becomes unusable.">アプリが使えなくなることはありません。</strong></p>
<div class="fs-two-col" style="display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:48px;">
<div style="background:#fffdf7; border:1px solid rgba(31,30,26,.14); border-radius:10px; padding:28px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#6b675c; margin-bottom:16px;" data-ja="無料" data-en="Free">無料</div>
<p style="font-size:28px; font-weight:700; margin-bottom:16px;" data-ja="0円" data-en="¥0">0円</p>
<ul style="color:#6b675c; line-height:2; padding-left:20px;">
<li data-ja="ノートは無制限に書ける" data-en="Unlimited notes">ノートは無制限に書ける</li>
<li data-ja="書き直しは最初の10回まで(お試し)" data-en="Rewriting for the first 10 uses (a one-time trial)">書き直しは最初の10回まで(お試し)</li>
<li data-ja="使い切ると簡易版に切り替わる" data-en="After that it switches to the simplified version">使い切ると簡易版に切り替わる</li>
</ul>
</div>
<div style="background:#fffdf7; border:1px solid rgba(168,66,31,.30); border-radius:10px; padding:28px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#a8421f; margin-bottom:16px;" data-ja="たっぷり使える" data-en="Room to use it">たっぷり使える</div>
<p style="font-size:28px; font-weight:700; margin-bottom:4px;" data-ja="月額300円" data-en="¥300 / month">月額300円</p>
<p style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#a8421f; margin-bottom:16px;" data-ja="AI整理を月300回まで" data-en="AI tidying, up to 300 times a month">AI整理を月300回まで</p>
<ul style="color:#3d3a33; line-height:2; padding-left:20px;">
<li data-ja="1日10回に相当する枠" data-en="Around 10 a day">1日10回に相当する枠</li>
<li data-ja="上限に達しても簡易版で書き続けられる" data-en="At the limit, the simplified version keeps you writing">上限に達しても簡易版で書き続けられる</li>
<li data-ja="自動更新・いつでも解約できる" data-en="Auto-renewing, cancel any time">自動更新・いつでも解約できる</li>
<li data-ja="解約は iOS の設定アプリから" data-en="Cancel from the iOS Settings app">解約は iOS の設定アプリから</li>
</ul>
</div>
</div>
</div>
</section>
<!-- LIMITS -->
<section id="limits" class="fs-pad" style="max-width:1200px; margin:0 auto; padding:0 40px 120px;">
<div style="border-top:1px solid rgba(31,30,26,.10); padding-top:80px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; letter-spacing:.16em; color:#a8421f; margin-bottom:28px;">HONEST LIMITS</div>
<h2 style="font-family:'Space Grotesk','Zen Kaku Gothic New',sans-serif; font-weight:500; font-size:min(5vw,44px); line-height:1.3; margin-bottom:48px;" data-ja="正直に書いておくこと" data-en="Things worth stating plainly">正直に書いておくこと</h2>
<div class="fs-two-col" style="display:grid; grid-template-columns:1fr 1fr; gap:40px;">
<div style="background:#fffdf7; border:1px solid rgba(31,30,26,.14); border-radius:10px; padding:28px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#6b675c; margin-bottom:16px;" data-ja="これは医療でも治療でもありません" data-en="This is not medicine or treatment">これは医療でも治療でもありません</div>
<p style="color:#6b675c; line-height:1.9;" data-ja="気持ちの整理を助ける道具であって、症状を診断したり治したりするものではありません。つらさが続くときは、医療機関や相談窓口を頼ってください。" data-en="It is a tool for sorting out how you feel. It does not diagnose or treat anything. If the difficulty persists, please turn to a medical professional or a support line.">気持ちの整理を助ける道具であって、症状を診断したり治したりするものではありません。つらさが続くときは、医療機関や相談窓口を頼ってください。</p>
</div>
<div style="background:#fffdf7; border:1px solid rgba(31,30,26,.14); border-radius:10px; padding:28px;">
<div style="font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#6b675c; margin-bottom:16px;" data-ja="書いた文章は外部のAIへ送られます" data-en="What you write is sent to an external AI">書いた文章は外部のAIへ送られます</div>
<p style="color:#6b675c; line-height:1.9;"><span data-ja="書き直しは外部のAIサービスで行われるため、本文が送信されます。" data-en="Rewriting runs on an external AI service, so the body of your note is transmitted. ">書き直しは外部のAIサービスで行われるため、本文が送信されます。</span><strong style="color:#1f1e1a;" data-ja="実名や社名を書いた場合、それも送られ、生成された文章にもそのまま残ります。" data-en="If you wrote a real person's name or a company name, that is sent too, and it stays in the generated text.">実名や社名を書いた場合、それも送られ、生成された文章にもそのまま残ります。</strong><span data-ja="共有する前に必ず確認してください。詳細は" data-en=" Always check before sharing. Details are in the ">共有する前に必ず確認してください。詳細は</span><a href="fumannote_privacy.html" data-ja="プライバシーポリシー" data-en="privacy policy">プライバシーポリシー</a><span data-ja="にあります。" data-en=".">にあります。</span></p>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="fs-pad" style="max-width:1200px; margin:0 auto; padding:0 40px 140px;">
<div style="border-top:1px solid rgba(31,30,26,.10); padding-top:80px; text-align:center;">
<h2 style="font-family:'Space Grotesk','Zen Kaku Gothic New',sans-serif; font-weight:500; font-size:min(5.5vw,48px); line-height:1.3; margin-bottom:24px;" data-ja="不満ノート" data-en="FumanNote">不満ノート</h2>
<p style="color:#6b675c; margin-bottom:36px;" data-ja="iOS · 日本語のみ · 無料 + 月額300円(月300回まで)" data-en="iOS · Japanese only · Free + ¥300/month (up to 300 uses)">iOS · 日本語のみ · 無料 + 月額300円(月300回まで)</p>
<a href="https://apps.apple.com/jp/app/id6799295082?pt=128819275&ct=website&mt=8" target="_blank" rel="noopener" style="display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:14px; color:#ffffff; background:#a8421f; border:1px solid #a8421f; padding:15px 34px; border-radius:8px;" data-ja="App Store で入手" data-en="Get it on the App Store">App Store で入手</a>
<div style="margin-top:28px; font-family:'IBM Plex Mono',monospace; font-size:13px;">
<a href="fumannote_manual.html" style="color:#6b675c;">Manual</a>
<span style="color:#9b9585; margin:0 12px;">·</span>
<a href="fumannote_privacy.html" style="color:#6b675c;">Privacy</a>
</div>
</div>
</section>
</main>
<footer style="border-top:1px solid rgba(31,30,26,.08); padding:40px;">
<div style="max-width:1200px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:#6b675c;">
<a href="index.html" style="color:#6b675c;">← RustyWorks</a>
<a href="site_privacy.html" style="color:#6b675c;" data-ja="サイトのポリシー" data-en="Site policy">サイトのポリシー</a>
<span>© RustyWorks</span>
</div>
</footer>
</div>
<!-- 製品まわりの共通フッター(README「LP の決まりごと」4番)。ページごとに CSS が違うので、クラスに頼らず自己完結にしてある -->
<nav class="rw-product-footer" aria-label="関連ページ" style="border-top:1px solid #e4e4e7;margin:56px 0 0;padding:20px 24px 26px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;font-family:'IBM Plex Mono',ui-monospace,Menlo,monospace;font-size:12.5px;line-height:1.6;">
<a href="index.html" style="color:#5f6368;text-decoration:none;" data-ja="RustyWorks" data-en="RustyWorks">RustyWorks</a>
<span aria-hidden="true" style="color:#c9ccd1;">·</span>
<a href="fumannote.html" style="color:#5f6368;text-decoration:none;" data-ja="製品ページ" data-en="Product">製品ページ</a>
<span aria-hidden="true" style="color:#c9ccd1;">·</span>
<a href="fumannote_manual.html" style="color:#5f6368;text-decoration:none;" data-ja="取扱説明書" data-en="Manual">取扱説明書</a>
<span aria-hidden="true" style="color:#c9ccd1;">·</span>
<a href="fumannote_privacy.html" style="color:#5f6368;text-decoration:none;" data-ja="プライバシー" data-en="Privacy">プライバシー</a>
<span aria-hidden="true" style="color:#c9ccd1;">·</span>
<a href="site_privacy.html" style="color:#5f6368;text-decoration:none;" data-ja="サイトのポリシー" data-en="Site Policy">サイトのポリシー</a>
</nav>
<script>
(function () {
// 日英切替。サイト共通の作法(recoup.html などと同じ)。
// 選択は localStorage の 'rw-lang' に持つので、ページを移っても保たれる。
//
// ⚠️ textContent を差し替えるので、訳を付ける要素の中に別のタグを入れないこと。
// strong や a を含む段落は、要素ごとに分けて data-ja / data-en を付けてある。
var KEY = 'rw-lang';
var buttons = document.querySelectorAll('.lang button');
var nodes = document.querySelectorAll('[data-ja][data-en]');
function apply(lang) {
document.documentElement.lang = lang;
nodes.forEach(function (el) {
var text = el.getAttribute('data-' + lang);
if (text !== null) el.textContent = text;
});
buttons.forEach(function (b) {
var on = b.dataset.lang === lang;
b.setAttribute('aria-pressed', String(on));
b.style.color = on ? '#1f1e1a' : '#9b9585';
});
try { localStorage.setItem(KEY, lang); } catch (e) {}
}
buttons.forEach(function (b) {
b.addEventListener('click', function () { apply(b.dataset.lang); });
});
var saved = null;
// 言語は強い順に決める。1. URL の ?lang 2. 前回の選択 3. 既定は日本語。
// ブラウザの言語では切り替えない。クローラーは en を名乗ることが多く、
// 日本語で書いたページが英語で索引されてしまうため。
try {
var q = new URLSearchParams(location.search).get('lang');
if (q === 'en' || q === 'ja') {
saved = q;
localStorage.setItem(KEY, q);
}
} catch (e) {}
if (!saved) { try { saved = localStorage.getItem(KEY); } catch (e) {} }
if (!saved) saved = 'ja';
if (saved === 'en') apply('en');
})();
</script>
<!-- Cloudflare Web Analytics --><script type='module' src='https://static.cloudflareinsights.com/beacon.min.js' data-cf-beacon='{"token": "04f66ad1837a4b63af68beb6e835358f"}'></script><!-- End Cloudflare Web Analytics -->
</body>
</html>