[kitagata_support-17735] 【都市環境課】【2-17〆】Hpの更新について（生き物図鑑）

css/kitagata_creature_encyclopedia.css

@@ -73,6 +73,122 @@
     width: 48%;
 }
 
+.spring_plantsAnimals_block {
+    position: relative;
+    background: center/100% repeat-y url("../css/img/kitagata_creature_encyclopedia/creature/spring/spring.png");
+    /*background-image: url("../css/img/kitagata_creature_encyclopedia/creature/spring/spring.png");*/
+}
+
+.spring_plansAnimals_bloom_left {
+    position: absolute;
+    top: 20px;
+    z-index: 1;
+    width: 10%;
+}
+
+.spring_plansAnimals_bloom_upperLow_1 {
+    position: absolute;
+    top: 110px;
+    left: 100px;
+    z-index: 1;
+    width: 10%;
+}
+
+.spring_plansAnimals_bloom_upperLow_2 {
+    position: absolute;
+    top: 110px;
+    right: 50px;
+    z-index: 1;
+    width: 10%;
+}
+
+.spring_plansAnimals_bloom_middleLow_1 {
+    position: absolute;
+    top: 300px;
+    left: 50px;
+    z-index: 1;
+    width: 10%;
+}
+
+.spring_plansAnimals_bloom_middleLow_2 {
+    position: absolute;
+    top: 300px;
+    right: -5px;
+    z-index: 1;
+    width: 10%;
+}
+
+
+.spring_plansAnimals_bloom_lowerLow_1 {
+    position: absolute;
+    top: 510px;
+    left: 100px;
+    z-index: 1;
+    width: 10%;
+}
+
+.spring_plansAnimals_bloom_lowerLow_2 {
+    position: absolute;
+    top: 510px;
+    right: -5px;
+    z-index: 1;
+    width: 10%;
+}
+
+.spring_bloom_image {
+    width: 100%;
+}
+
+.summer_plantsAnimals_backgroundColor {
+    position: relative;
+    background: 100% center/100% repeat-y url("../css/img/kitagata_creature_encyclopedia/creature/summer/summer.png");
+    /*background-image: url("../css/img/kitagata_creature_encyclopedia/creature/summer/summer.png");*/
+}
+
+.summer_plansAnimals_grass_lowerLow {
+    position: absolute;
+    top: 460px;
+    left: -10px;
+    z-index: 1;
+    width: 10%;
+}
+
+.autumn_plantsAnimals_backgroundColor {
+    position: relative;
+    background: 100% center/100% repeat-y url(../css/img/kitagata_creature_encyclopedia/creature/autumn/autumn.png);
+    /*background-image: url("../css/img/kitagata_creature_encyclopedia/creature/autumn/autumn.png");*/
+}
+
+.autumn_plansAnimals_bloom_lowerLow_2 {
+    position: absolute;
+    top: 540px;
+    right: -20px;
+    z-index: 1;
+    width: 10%;
+}
+
+.winter_plantsAnimals_backgroundColor {
+    position: relative;
+    background: 100% center/100% repeat-y url("../css/img/kitagata_creature_encyclopedia/creature/winter/winter.png");
+    /*background-image: url("../css/img/kitagata_creature_encyclopedia/creature/winter/winter.png");*/
+}
+
+.winter_plansAnimals_snowman_left {
+    position: absolute;
+    top: 520px;
+    left: -10px;
+    z-index: 1;
+    width: 10%;
+}
+
+.winter_plansAnimals_snowman_right {
+    position: absolute;
+    top: 520px;
+    right: -5px;
+    z-index: 1;
+    width: 10%;
+}
+
 .plantsAnimals_text_block {
     margin-bottom: 16px;
     font-size: 20px;

second/kitagata_creature_encyclopedia.html

@@ -321,7 +321,35 @@
             <div class="plantsAnimals_block">
               <div class="plantsAnimals_wrapper">
 
-                <div class="tpl_plantsAnimals_block">
+                <div class="tpl_plantsAnimals_block spring_plantsAnimals_block">
+                  <div class="spring_plansAnimals_bloom_left">
+                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/2sakura.png" alt="">
+                  </div>
+
+<!--                    <div class="spring_plansAnimals_bloom_upperLow_1">-->
+<!--                      <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/3sakura.png" alt="">-->
+<!--                    </div>-->
+
+<!--                      <div class="spring_plansAnimals_bloom_upperLow_2">-->
+<!--                        <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/3sakura.png" alt="">-->
+<!--                      </div>-->
+
+<!--                  <div class="spring_plansAnimals_bloom_middleLow_1">-->
+<!--                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/3sakura.png" alt="">-->
+<!--                  </div>-->
+
+<!--                  <div class="spring_plansAnimals_bloom_middleLow_2">-->
+<!--                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/3sakura.png" alt="">-->
+<!--                  </div>-->
+
+<!--                  <div class="spring_plansAnimals_bloom_lowerLow_1">-->
+<!--                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/3sakura.png" alt="">-->
+<!--                  </div>-->
+
+                  <div class="spring_plansAnimals_bloom_lowerLow_2">
+                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/spring/sozai/1sakura.png" alt="">
+                  </div>
+
                   <div class="plantsAnimals_text_block">
                     <span class="plantsAnimals_text_red">＜春の動植物＞</span>
                   </div>
@@ -683,7 +711,12 @@
                   </div>
                 </div>
 
-                <div class="tpl_plantsAnimals_block">
+                <div class="tpl_plantsAnimals_block summer_plantsAnimals_backgroundColor">
+
+                  <div class="summer_plansAnimals_grass_lowerLow">
+                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/summer/sozai/3kusa.png" alt="">
+                  </div>
+
                   <div class="plantsAnimals_text_block">
                     <span class="plantsAnimals_text_green">＜夏の動植物＞</span>
                   </div>
@@ -1041,7 +1074,16 @@
                   </div>
                 </div>
 
-                <div class="tpl_plantsAnimals_block">
+                <div class="tpl_plantsAnimals_block autumn_plantsAnimals_backgroundColor">
+                  <div class="spring_plansAnimals_bloom_left">
+                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/autumn/sozai/kaede.png" alt="">
+                  </div>
+
+                  <div class="autumn_plansAnimals_bloom_lowerLow_2">
+                    <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/autumn/sozai/kaede.png" alt="">
+                  </div>
+
+
                   <div class="plantsAnimals_text_block">
                     <span class="plantsAnimals_text_orange">＜秋の動植物＞</span>
                   </div>
@@ -1395,11 +1437,19 @@
                         <span class="tpl_plansAnimals_text">【チョウセンイタチ】</span>
                       </div>
                     </div>
-
                   </div>
                 </div>
 
-                <div class="tpl_plantsAnimals_block">
+                <div class="tpl_plantsAnimals_block winter_plantsAnimals_backgroundColor">
+
+                    <div class="winter_plansAnimals_snowman_left">
+                      <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/winter/sozai/1snowman.png" alt="">
+                    </div>
+
+                    <div class="winter_plansAnimals_snowman_right">
+                      <img class="spring_bloom_image" src="../css/img/kitagata_creature_encyclopedia/creature/winter/sozai/2snowman.png" alt="">
+                    </div>
+
                   <div class="plantsAnimals_text_block">
                     <span class="plantsAnimals_text_blue">＜冬の動植物＞</span>
                   </div>