diff --git a/assignment11/index.html b/assignment11/index.html
new file mode 100644
index 0000000..9669351
--- /dev/null
+++ b/assignment11/index.html
@@ -0,0 +1,25 @@
+
+
+
+
+
+
+ Document
+
+
+ 11回課題ページ
+ 1.影
+ かげつきもじ
+ かげつきぼっくす
+
+ 2.背景画像半透明で重ねた文字は不透明
+
+ 3.斜め
+ うああああああ
+ 4.マウスホバーで30度傾く
+ くにゃ(30度傾く音)
+
+
\ No newline at end of file
diff --git a/assignment11/style.css b/assignment11/style.css
new file mode 100644
index 0000000..1b5cdf8
--- /dev/null
+++ b/assignment11/style.css
@@ -0,0 +1,75 @@
+/* 角丸ボーダー */
+h2.kadomaru{
+ border: 2px solid #c5c5c5;
+ background-color: #ededed;
+ border-radius: 20px;
+ padding: 3px 15px;
+}
+
+/* 影付き文字・ボックス */
+div.kageMoji{
+ display: inline-block;
+ text-shadow: 4px 4px 4px #aaa;
+
+}
+div.kageBox{
+ display: inline-block;
+ margin-left: 10px;
+ padding: 5px;
+ box-shadow: 4px 4px 4px #c5c5c5;
+}
+
+/* 半透明画像の上に文字を重ねる */
+div.box,div.layerBottom,div.layerTop{
+ width: 400px; height: 276px;
+}
+
+div.box{
+ position: relative;
+
+}
+
+div.box div{
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+div.layerBottom{
+ background:url(../myHobby/img/triangles-bg.png) ;
+ opacity: 0.6;
+}
+
+div.layerTop{
+ opacity: 1.0;
+ font-size: 1.5em;
+ font-weight: bold;
+ text-shadow: 1px 1px #bdbdbd;
+}
+
+/* 斜め */
+div.naname{
+ background: #e5f40f;
+ transform: rotate(-20deg);
+ text-align: center;
+ width: 30%;
+ margin: 100px 0;
+ border: solid 1px #000;
+}
+
+/* 傾き */
+div.katamuki{
+ transition: 0.5s;
+ width: 30%;
+ padding: 15px;
+ margin: 100px 50px;
+ border: solid 1px #000;
+ text-align: center;
+}
+
+div.katamuki:hover{
+ background: #19fda6;
+ transform: rotate(-30deg);
+ text-align: center;
+ border: solid 1px #000;
+}
+