4
実装用データ
サイクルはサービスによって決まり方が違います。個人は暦年＋グループ、法人は決算月起点の事業年度です。出典はNotion「資料提出の年間サイクル」（2026-09-14更新）と「【法人用】マイページ テンプレート（決算月ベース）」（2026-09-10更新）。
個人（スマカク for EC・ストア ／ for フリーランス） 暦年（1〜12月）で、所属グループによって区切りが1か月ずつずれます。
| プラン | グループ | P1 | P2 | P3 |
|---|
| 通常（年3回） | Aグループ | 1〜3月（4月末〆） | 4〜6月（7月末〆） | 7〜12月（翌年1/10〆） |
| Bグループ | 1〜4月（5月末〆） | 5〜7月（8月末〆） | 8〜12月（翌年1/10〆） |
| Cグループ | 1〜5月（6月末〆） | 6〜8月（9月末〆） | 9〜12月（翌年1/10〆） |
| ミニプラン（年2回） | Aグループ | なし | 1〜6月（7月末〆） | 7〜12月（翌年1/10〆） |
| Bグループ | なし | 1〜7月（8月末〆） | 8〜12月（翌年1/10〆） |
| Cグループ | なし | 1〜8月（9月末〆） | 9〜12月（翌年1/10〆） |
法人（スマカク for ひとり法人 ／ ECセラー法人） グループではなく決算月で決まります。事業年度を4か月ずつ3分割する形です。
| フェーズ | 対象期間 | 提出期限 |
|---|
| P1 | 期首から4か月目まで | 期首から5か月目の末日 |
| P2 | 期首5か月目〜8か月目 | 期首から9か月目の末日 |
| P3 | 期首9か月目〜12か月目（決算月を含む） | 決算翌月の10日 |
| 決算月の例 | P1 | P2 | P3 |
|---|
| 3月決算（4/1〜3/31） | 4〜7月（8月末〆） | 8〜11月（12月末〆） | 12〜3月（4/10〆） |
| 12月決算（1/1〜12/31） | 1〜4月（5月末〆） | 5〜8月（9月末〆） | 9〜12月（翌年1/10〆） |
| 9月決算（10/1〜9/30） | 10〜1月（2月末〆） | 2〜5月（6月末〆） | 6〜9月（10/10〆） |
5
実装メモ
フェーズ数は固定で書かない
サイクルの決まり方がサービスで違います。個人は暦年＋グループ（A・B・C）、法人は決算月起点の事業年度で、右上に出すチップも「Aグループ」と「3月決算」で変わります。さらにミニプランはP1がなく年2回です。フェーズの数と対象月は必ずユーザーのサービス・プラン・グループ（法人は決算月）から組み立ててください。3つ固定で書くとミニプランで崩れます。
申告期限カードの見出し
「申告期限まで」だと下の日付と文がつながらないので、「確定申告の期限」＋「2026年分」のタグにしました。何年分の申告かがここで分かります。残り日数は右のリングが担当するので、見出し側に「まで」は入れていません。日付は15pxに上げ、曜日だけ小さくしています。
バッジの外形をそろえる
工程バッジは全状態で高さ18px・枠1px・文字8.5pxです。枠を2pxにすると中身の領域が上下に削られて文字が下がるので、太く見せたい「要対応」は内側の影（inset box-shadow）で描いています。下パディング1pxは、日本語グリフが下寄りに見える分の相殺です。
ボタン文言は幅で切り替える
基本は「資料を提出する」「仕訳をチェックする」「帳簿を確認する」です。iPhoneの標準的な画面幅（375px）なら、そのまま余裕を持って収まります。
画面幅320pxのいちばん狭い端末だけ、長い文言が矢印や期限バッジに食い込むので、そのときだけ「資料を提出」「仕訳チェック」「帳簿を確認」に自動で切り替わります。切り替えの境目はカード内側の幅280pxです。
この画面ではCSSのコンテナクエリで実装していますが、アプリ側では画面幅を取って出し分ける形で問題ありません。判定に使うのはカード本体の幅（画面幅から左右の余白を引いた値）です。
点検中…
確認したいこと
グループの呼び方が資料によって違います。アプリのベースラインHTMLのマイページは「グループA（毎月8日締切）」、Notionの業務側は「Aグループ」で語順が逆で、締切も月末と食い違っています。この画面は丸バッジの「A」なので語順は回避していますが、マイページ側と揃えるときに確定が必要です。