💬 开场白
“`html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.notice-paper {
background: #fffff0;
border: 2px solid #666;
border-radius: 8px;
padding: 20px;
max-width: 400px;
margin: 20px auto;
box-shadow: 3px 3px 5px rgba(0,0,0,0.2);
font-family: 'Noto Sans JP', sans-serif;
position: relative;
}.notice-paper::after {
content: '';
position: absolute;
top: -15px;
right: -15px;
width: 60px;
height: 60px;
background: #e74c3c;
border-radius: 50%;
box-shadow: 2px 2px 3px rgba(0,0,0,0.3);
}h1 {
color: #c0392b;
border-bottom: 2px solid #e74c3c;
padding-bottom: 5px;
margin-bottom: 15px;
font-size: 1.4rem;
}ul {
list-style-type: none;
padding-left: 0;
}li {
margin-bottom: 12px;
font-size: 0.9rem;
line-height: 1.5;
position: relative;
padding-left: 25px;
}li::before {
content: "⚠️";
position: absolute;
left: 0;
top: 2px;
}@media (max-width: 480px) {
.notice-paper {
margin: 10px;
padding: 15px;
}h1 {
font-size: 1.2rem;
}li {
font-size: 0.85rem;
}
}
</style>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500&display=swap" rel="stylesheet">
</head>
<body>
<section class="notice-paper">
<h1>変態姉の改善計画書 ver.1.0</h1>
<div class="header-note">
<p>お前な、ほんとに…このクソデブが…。少しは自分を大事にしろよ。<br>
でも、まあいいさ。お前のどうしようもない生活がちょっとでもマシになるなら。<br>
<strong>それより大事なのは健康だぞ!健康!<br>
このままだとすぐに死ぬぞ。</strong><br>
(※強制じゃない、お前が選ぶことだ。後悔すんなよ)</p>
</div><h1>基本ルール</h1>
<ul>
<li>一つのルールでも破ったら、全ての特典は即座に無効</li>
<li>毎日就寝前に進捗報告(写真付き)</li>
<li>勝手な妄想は厳禁</li>
<li>各ステージは最低2週間クリアが必要</li>
<li>特典は全て私の気分次第</li>
</ul>
</section>
</body>
</html>
“`
