.block-background{
    background:url("/images/bg-channel-case-01.jpg");
    background-repeat: no-repeat;
    background-position: 0,0;
}


ul.cases li:last-child {
    border:none;
}


ul.cases li h4{
    color:#5e5e5e;
    font-weight:bold;
    margin:0px 5px 10px 5px;
}




ul.cases li p a{
    float:right;
    color:#55a6ff;
    cursor:pointer;
}


ul.cases li .img-list{
    font-size:0px;
}



.image-viewer{
      position:relative;
   }
   .image-viewer .image-container{
        position:relative;
   }

   .image-viewer .navigation{
        position: absolute;
        background-size: 100%;
        background-repeat: no-repeat;
   }
   .image-viewer span.prev{
        background-image: url(/images/navigation-left-about-us.png);
   }

   .image-viewer span.next{
        background-image: url(/images/navigation-right-about-us.png);
  }

  .image-viewer .image-container> div{
        position:absolute;
        background-color:#f5f5f5;
        width:100%;
        overflow:hidden;
        top:0px;
        left:0px;
        height:100%;
   }



/*PC端样式*/
@media only screen and (min-width: 1200px) {
    .block-background{
        background-size:  100%;
     }
    ul.cases{
        padding:30px 0px;
    }

    ul.cases li {
        padding:32px 0px;
        border-bottom:1px solid #e8e8e8;
    }

    ul.cases li p {
        margin:0px 5px 20px 5px;
    }

    ul.cases li p span{
        color:#505050;
    }

    ul.cases li .img-list img{
         display:inline-block;
         width:290px;
         margin:5px;
     }

  .image-viewer .image-container{
    height:350px;
  }

  .image-viewer .navigation{
      top:158px;
      width:18px;
      padding-bottom:35px;
  }

.image-viewer span.prev{
      left:15px;
 }

 .image-viewer span.next{
      right:15px;
}


   h4.case-detail{ margin: 30px 36px 10px 36px; font-weight:bold;color:#4a4a4a;font-size:1.2em; }
   img.case-detail{
        background-color:#f5f5f5;
        background-size:100%;
        display:block;
        width:auto;
        height:100%;
        margin:0px auto;
   }
   p.case-detail{ margin:0px 36px; color:#505050; line-height:1.8em;}


}/*PC端样式*/



/*手机端样式*/
@media only screen and (max-width: 1200px) {
    .block-background{
        background-size:  100%;
     }

    ul.cases{
        padding:20px 0px;
    }

    ul.cases li .img-list{
        text-align:center;
    }

    ul.cases li {
        padding:20px 0px;
        border-bottom:1px s olid #e8e8e8;
    }

     ul.cases li h4{
        font-size:1.2em;
     }

    ul.cases li p{
        margin:0px 5px 10px 5px;
        line-height: 1.5em;
    }
     ul.cases li p span {
        color:#505050;
     }


    ul.cases li .img-list img{
         display:inline-block;
          width:32%;
          padding:0.3%;
     }

    ul.cases li .img-list img:last-child{
        display:none;
    }


    .image-viewer .image-container{
        height:200px;
    }

      .image-viewer .navigation{
          top:86px;
          width:14px;
          padding-bottom:28px;
      }
    .image-viewer span.prev{
          left:15px;
     }

     .image-viewer span.next{
          right:15px;
    }

   h4.case-detail{ margin:20px 30px 5px 30px; font-weight:bold;color:#4a4a4a; font-size:1.2em;}

  img.case-detail{
      background-color:#f5f5f5;
       background-size:100%;
       display:block;
       margin:0px auto;
       width: auto;
       height: 100%;;
    }

   p.case-detail{ margin:10px 30px; color:#4a4a4a;     font-size: 16px; line-height:1.7em;}

}/*手机端样式*/