① - qx1hd

#cssbox("background-color:#ffe6f2; border:2px solid #ff66b2; box-shadow:2px 2px 0 #000, 4px 4px 0 #ffb6d9; width:300px; margin:15px auto; padding:0; animation:popupFade 0.3s ease; font-family:monospace;"){{{
#cssbox("background-color:#ff66b2; color:#fff; font-weight:bold; text-align:left; padding:3px 6px; font-size:12px; box-shadow:inset 0 -1px 0 #cc2b7a;"){{
Desktop　×
}}
#cssbox("padding:14px; text-align:center; color:#000; font-size:12px; line-height:1.6;"){{
&ref(https://storage.nex-tone.link/variants/zoyvu34q1hxgbie5rq1ny59uj4vz/58ced8645b3590cbce39715a69f533062ca8cc552015349942d6fcfa04a99400,250,auto,focus);
''Focus on you.''
(&#9825;&#729;&#65078;&#729;&#9825;)
}}

#cssbox("border:2px solid #000; background-color:#fff; color:#000; width:60px; margin:10px auto 12px auto; text-align:center; font-weight:bold; padding:2px; box-shadow:inset -1px -1px 0 #ccc, inset 1px 1px 0 #fff, 2px 2px 0 #000;"){{
OK
}}
}}}

// #style{{@keyframes popupFade {0%{opacity:0;transform:scale(0.9);}100%{opacity:1;transform:scale(1);}}}}

#cssbox("background-color:#ffe6f2; border:2px solid #ff66b2; box-shadow:2px 2px 0 #000; width:300px; margin:15px auto; padding:0; animation:popupFade 0.3s ease; font-family:monospace;"){{{
#cssbox("background-color:#ff66b2; color:#fff; font-weight:bold; text-align:left; padding:3px 6px; font-size:12px; box-shadow:inset 0 -1px 0 #cc2b7a;"){{
Desktop　×
}}

#cssbox("padding:14px; text-align:center; color:#000; font-size:12px; line-height:1.6;"){{
&ref(https://storage.nex-tone.link/variants/zoyvu34q1hxgbie5rq1ny59uj4vz/58ced8645b3590cbce39715a69f533062ca8cc552015349942d6fcfa04a99400,250,auto,focus);\\
''Focus on you.''\\
(&#9825;&#729;&#65078;&#729;&#9825;)
}}

#cssbox("border:1px solid #000; background-color:#ffe6f2; color:#000; width:60px; margin:10px auto 12px auto; text-align:center; font-weight:bold; padding:2px; box-shadow:1px 1px 0 #000;"){{
OK
}}
}}}

Desktop  &font(monospace){&#10005;}

&img(https://storage.nex-tone.link/variants/zoyvu34q1hxgbie5rq1ny59uj4vz/58ced8645b3590cbce39715a69f533062ca8cc552015349942d6fcfa04a99400,250,auto);
\\
Focus on you.\\
( &#728;&#840; &#7509; &#728;&#840;&#9825;)

OK

// #style{{@keyframes popupFade {0%{opacity:0;transform:scale(0.9);}100%{opacity:1;transform:scale(1);}}}}

#cssbox("background-color:#ffecf5; border:2px solid #ff66a3; box-shadow:2px 2px 0 #000; width:280px; margin:10px auto; padding:0; animation:popupFade 0.3s ease; font-family:monospace;"){{{{


// #style{{@keyframes popupFade {0%{opacity:0;transform:scale(0.9);}100%{opacity:1;transform:scale(1);}}}}

#cssbox("background-color:#ffecf5; border:2px solid #ff66a3; box-shadow:2px 2px 0 #000000; width:280px; margin:10px auto; padding:0; animation:popupFade 0.3s ease; font-family:monospace;"){{{
#cssbox("background-color:#ff66a3; color:#fff; font-weight:bold; text-align:left; padding:4px 8px; font-size:12px;"){{
Desktop　&font(monospace){×}
}}
#cssbox("padding:12px; text-align:center; color:#000000; font-size:12px; line-height:1.6;"){{
&img(https://upload.wikimedia.org/wikipedia/commons/3/3b/Exclamation_icon_pink.svg,20,auto);
\\
I love you.\\
ヾ(＠⌒▽⌒＠)ﾉ
}}

#cssbox("border:2px solid #000000; background-color:#ffecf5; color:#000000; width:60px; margin:10px auto; text-align:center; font-weight:bold; padding:2px; box-shadow:1px 1px 0 #000000;"){{
OK
}}
}}}



&color(){};**Task Manager: Ririmu** [#mf3a10bf]

|CENTER:33%|CENTER:33%|CENTER:33%|h
|[[#ref(【1段目左のアイコンファイル名】.png,100x100){,nolink}>【Page1 飛び先ページ名】]]|[[#ref(【1段目中央のアイコンファイル名】.png,100x100){,nolink}>【Page2 飛び先ページ名】]]|[[#ref(【1段目右のアイコンファイル名】.png,100x100){,nolink}>【Page3 飛び先ページ名】]]|
|[[#ref(【2段目左のアイコンファイル名】.png,100x100){,nolink}>【Page4 飛び先ページ名】]]|[[#ref(【2段目中央のアイコンファイル名】.png,100x100){,nolink}>【Page5 飛び先ページ名】]]|[[#ref(【2段目右のアイコンファイル名】.png,100x100){,nolink}>【Page6 飛び先ページ名】]]|
|[[#ref(【3段目左のアイコンファイル名】.png,100x100){,nolink}>【Page7 飛び先ページ名】]]|[[#ref(【3段目中央のアイコンファイル名】.png,100x100){,nolink}>【Page8 飛び先ページ名】]]|[[#ref(【3段目右のアイコンファイル名】.png,100x100){,nolink}>【Page9 飛び先ページ名】]]|



**Task Manager: Ririmu** [#a3a9895f]

#responsive_layout_container{{{
// 4が3つで12の幅を占有し、横に3つ並びます。

#responsive_layout_item(4){{
[[#ref(【1段目左のアイコンファイル名】.png,100%){,nolink}>【Page1 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【1段目中央のアイコンファイル名】.png,100%){,nolink}>【Page2 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【1段目右のアイコンファイル名】.png,100%){,nolink}>【Page3 飛び先ページ名】]]
}}

// --- 2段目以降も同様に記述してください ---

}}}


// --- アイコン・メニュー (画像アイコン・最終安定版) ---

// 1. 全体を囲むデザイン (黒とピンクのレトロPC風)
#cssbox("background-color: #FFC0CB;border: solid 2px #000000;padding: 5px;text-align: center;"){{{

// 2. ウィンドウのタイトルバー
#cssbox("margin: 0px 0px 5px 0px;background-color: #000000;padding: 3px 0px;border-bottom: solid 2px #000000;"){{
&color(#FFFFFF){**Task Manager: Ririmu**};
}}

// 3. 3列テーブル (横並びを保証)
|CENTER:33%|CENTER:33%|CENTER:33%|h
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【1段目左のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page1 飛び先ページ名】
}}
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【1段目中央のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page2 飛び先ページ名】
}}
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【1段目右のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page3 飛び先ページ名】
}}
|
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【2段目左のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page4 飛び先ページ名】
}}
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【2段目中央のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page5 飛び先ページ名】
}}
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【2段目右のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page6 飛び先ページ名】
}}
|
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【3段目左のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page7 飛び先ページ名】
}}
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【3段目中央のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page8 飛び先ページ名】
}}
|BGCOLOR(#FFC0CB):#cssbox("margin: 5px;width: 100%;background-color: #FFFFFF;border: solid 1px #000000;box-shadow: 2px 2px #333333;padding: 5px;"){{
[[#ref(【3段目右のアイコンファイル名】.png,100x100)|画像がクリックできませんでした|nolink]]
>【Page9 飛び先ページ名】
}}
|}
}}}


#responsive_layout_container(N){{{
// N: モバイルデバイスを含め常に水平レイアウトを試みる

#responsive_layout_item(4){{
[[#ref(【1段目左のアイコンファイル名】.png,100%){,nolink}>【Page1 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【1段目中央のアイコンファイル名】.png,100%){,nolink}>【Page2 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【1段目右のアイコンファイル名】.png,100%){,nolink}>【Page3 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【2段目左のアイコンファイル名】.png,100%){,nolink}>【Page4 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【2段目中央のアイコンファイル名】.png,100%){,nolink}>【Page5 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【2段目右のアイコンファイル名】.png,100%){,nolink}>【Page6 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【3段目左のアイコンファイル名】.png,100%){,nolink}>【Page7 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【3段目中央のアイコンファイル名】.png,100%){,nolink}>【Page8 飛び先ページ名】]]
}}

#responsive_layout_item(4){{
[[#ref(【3段目右のアイコンファイル名】.png,100%){,nolink}>【Page9 飛び先ページ名】]]
}}
}}}
}}}}