.caseBox{ padding:60px 0 0px 30px;}
.caseList{ overflow:hidden; width:96%; margin:0 auto;}
.caseList li{ float:left; width:33.33%; *width:33%; margin-bottom:34px;}
.caseList li .caseItem{ margin-right:30px; overflow:hidden; position:relative;}
.caseList li .caseItem .txt{ font-size:15px; padding:10px 0 0 0; position:absolute; left:0; bottom:0; width:100%; color:#666;}
.caseList li .caseItem .txt u{ text-decoration:none; padding:0 8px; font-family:Arial, Helvetica, sans-serif; font-size:10px;}
.caseList li .caseItem .pic{ height:320px; overflow:hidden;border-radius: 5px; background:#f8f8f8; text-align:center; position: absolute; left:0; top:0; z-index:2; width:100%;}
.caseList li .caseItem .pic .caseImg img {width: 600px;}
.caseBox .more,.newBox .more,.customerBox{ padding:45px 30px 60px 0; text-align:center;}
.caseBox .more a,.newBox .more a,.customerBox a{ height:42px; line-height:42px; border:1px solid #e6e6e6; color:#A9A9A9; display:inline-block; width:220px; border-radius: 5px;}
.caseBox .more a:hover,.newBox .more a:hover,.customerBox a:hover{ background:#f45e5e; color:#fff; border-color:#f45e5e;}
.caseList li .caseItem .infoBox{display: table-cell; vertical-align: middle; text-align: center; color:#fff; *padding-top:15%;}
.caseList li .caseItem .inner{display:table; width:100%; height:100%;}
.caseList li .caseItem .pic .caseInfo{ position:absolute; left:0; top:0; width:100%; height:100%; background:url("../img/case_bg.png") repeat; display:none;}
.caseList li .caseItem .pic .caseInfo h1{ width:240px; margin:0 auto; margin-bottom:5px; -webkit-filter: blur(10px);}
.caseList li .caseItem .pic .caseInfo h1 img { width: 125px; }
.caseList li .caseItem .infoBox p{ line-height:21px; padding:0 10%; padding-top:5px;}

.caseList li .caseItem .pic .caseInfo h1{
	-moz-transform: translate3d(0, -100%, 0);
    -ms-transform: translate3d(0, -100%, 0);
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    opacity: 0; 
	-webkit-filter: blur(10px);}
.caseList li.hover .caseItem .pic .caseInfo h1{ 
	-moz-transform: translate3d(0, 0%, 0);
    -ms-transform: translate3d(0, 0%, 0);
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
	opacity: 1;
	-webkit-filter: blur(0px);}
.caseList li .caseItem .infoBox .step{ -webkit-filter: blur(10px);
    display: inline-block;
    height: 2px;
    width: 30%;
    max-width: 50px;
    margin: 0 auto;
    background-color: #fff;
    margin: 0.5em 0 0.4em;
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);}
.caseList li.hover .caseItem .infoBox .step{-webkit-filter: blur(0px);
	-moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);}
.caseList li .caseItem .infoBox p{    
	-moz-transform: translate3d(0, 200%, 0);
    -ms-transform: translate3d(0, 200%, 0);
    -webkit-transform: translate3d(0, 200%, 0);
    transform: translate3d(0, 100%, 0);
    opacity: 0;  -webkit-filter: blur(10px);}
.caseList li.hover .caseItem .infoBox p{ -moz-transform: translate3d(0, 0%, 0);
    -ms-transform: translate3d(0, 0%, 0);
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
	opacity:0.7; -webkit-filter: blur(0px);}

.caseList li .caseItem .pic img,
.caseList li .caseItem .pic:hover img,
.caseList li .caseItem .infoBox p,
.caseList li.hover .caseItem .infoBox p,
.caseList li .caseItem .infoBox .step,
.caseList li.hover .caseItem .infoBox .step,
.caseList li .caseItem .pic .caseInfo h1,
.caseList li.hover .caseItem .pic .caseInfo h1{-webkit-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;}


.caseList li .caseItem .pic>img{-webkit-transform: scale(1, 1); transform: scale(1); width:100%;}
.caseList li .caseItem:hover .pic>img{ -webkit-transform: scale(1.2, 1.3); transform: scale(1.2,1.3);-webkit-filter: blur(10px); filter: blur(10px); }
.caseList li .zong{ background:#fff; padding-bottom:30px;}
.caseList li .zong a{ background:#fff url("../img/case/0_img.png.html") no-repeat center center; position:absolute; left:0; top:0; width:100%; height:100%; display:block; }
.caseList li .caseItem .txt i{ float:right; width:16px; height:20px; background-repeat:no-repeat; background-position:center center;opacity:0.5; margin-right:5px; margin-left:5px;}
/*.caseList li .caseItem .txt i.web{ background-image:url("../img/case/tab_icon02.png.html");}*/
/*.caseList li .caseItem .txt i.mobile{ background-image:url("../img/case/tab_icon03.png.html");}*/
/*.caseList li .caseItem .txt i.app{ background-image:url("../img/case/tab_icon04.png.html");}*/
/*.caseList li .caseItem .txt i.digital{ background-image:url("../img/case/tab_icon04.png.html");}*/



/*css3*/
{-moz-transition:all .2s linear; -webkit-transition:all .2s linear; transition:all .2s linear;}



/*.bigScreen .caseList li .caseItem .pic>img{ width:100%;}*/