Add light box.

Fix bug.

assets/javascripts/app.js

@@ -446,16 +446,21 @@
 
   // 當文件物件模型(DOM)載入後，執行init函數
   $(document).ready(function() {
+    $(".w-ba-banner__wrap").height(300);
     init();
-            if( $('div[data-pp="1000"]').text() !== ''){
-                $('.black-screen').addClass('active');
-            }
+    if( $('div[data-pp="1000"]').text() !== ''){
+        $('.black-screen').addClass('active');
+    }
     
-            $('.close-btn').click(function() {
-              $('.black-screen').removeClass('active');
-            })    
+    $('.close-btn').click(function() {
+      $('.black-screen').removeClass('active');
+    })
   });
-
+  $(window).on("load",function(){
+    $(".ba-banner-widget-1 .ad-overlay").css("bottom","auto");
+    $(".slide").css("height","auto");
+    $(".w-ba-banner__wrap").css("height","auto");
+  })
   // 執行 member等高計算，目前改用flexbox故mark掉 by ika 20160105
   // $(window).load(function() {
   //   if ($('.index-member-3').length && $(window).width() > 992) {

assets/stylesheets/template/template.scss

@@ -81,22 +81,22 @@
     font-weight: bold;
     transition:opacity .5s ,top .5s, left 0s .5s;
     padding: 2px;
-  @media (min-width: 768px){
-    width: 40%;
-    padding: 30px;
-  }
+    @media (min-width: 768px){
+      width: 40%;
+      padding: 30px;
+    }
+    @media (max-width: 767px){
+      padding: 30px 10px;
+    }
     .close-btn{
       position: absolute;
       right: 0;
-      top:-40px;
+      top:0;
       padding: 5px 10px;
       background: $theme-color-main;
       color:#fff;
       font-size: 18px;
       transition:.3s;
-      @media (min-width: 768px){
-        top:0;
-      }
       &:hover{
         background: $theme-color-second;
       }
@@ -143,15 +143,19 @@
 }
 .w-ba-banner.ad-banner-widget-1.ba-banner-widget-1, 
 .slide {
-  padding: 0 !important;
-    height: 458px!important;
+  padding: 0;
+  height: 458px;
 }
 
 .ad-overlay.w-ba-banner__caption.w-ad-banner__caption {
     bottom: 55px;
-    height: 60px !important;
-    padding: 10px;
+    height: 60px;
+    padding: 0 10px;
     text-align: center;
+    overflow: hidden;
+    p{
+      display: none;
+    }
 }
 span.w-annc__category-wrap.col-sm-2 {
     width: 90px;

home/index.html.erb

@@ -33,13 +33,12 @@
     </div>
   </div>
 <div class="black-screen">
-    <div class="content">
-         <div data-pp='1000'></div>
-        <a href='javascript:;' class="close-btn">
-                  <i class="fa fa-times"></i> 
-        </a >
-
-    </div>
+  <div class="content">
+    <div data-pp='1000'></div>
+      <a href='javascript:;' class="close-btn">
+        <i class="fa fa-times"></i> 
+      </a >
+  </div>
 </div>
   
   <%= render_footer %>