﻿.pad200{ padding-top:240px;}
.pad100{ padding-bottom:100px;}
.pad137{ padding-bottom:113px;}
.pad60{ padding-top:60px;}
.pad601{ padding-top:24px;}
.pad125{ padding-top:115px;}
.casecenter{ width:90%; margin:0 auto; color:#000; min-width:1400px;}
.casecenter .t1{font-size:63px; }
.casecenter .t400{ font-size:58px;  float:right; margin-bottom:0px;}
.casecenter li{ width:12.5%; float:left; height:244px; position:relative;}
.casecenter .wd{ width:170px; margin:0 auto;}
.casecenter .rno{margin-right:0%; width:145px; float:right;}


.casecenter li .list{ width:150px; margin:0 auto;  cursor:pointer; height:154px; padding-top:10px; vertical-align:middle;  transition: all 0.5s  ease; -webkit-transition: all 0.5s ease ; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; }
.casecenter li .ts{width:150px; margin:0 auto;}
.casecenter li .list img{ width:150px; height:auto; }
.casecenter li:hover .list{height:159px; margin-top:-5%; }
.casecenter li .lists{ margin-left:0px;}
.casecenter li .tss{ margin-left:0px;}


.casecenter .wd .list{ width:170px; margin:0 auto; cursor:pointer; position:relative;height:154px;     transition: all 0.5s  ease; -webkit-transition: all 0.5s ease ; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;}

.casecenter li .titles{ font-size:16px; color:#333333; line-height:30px;}
.casecenter li .desn{ font-size:10px; color:#333333; line-height:30px;}
.casecenter li .desns{ line-height:16px;}
.container .lists{ text-align:right;}

.casecenter li  .rno{margin-right:0%; width:145px; float:right;}



.cases .titles{color:#595758;  float:left;margin-left:60px; font-size:27.48px; font-weight:400; line-height:66px;}
.cases .list{ float:right;font-size:18px; margin-left:60px; font-weight:400;  padding-top:26px; color:#727171; text-align:right;}
.cases .list a{ display:inline-block;  padding-right:0px; color:#727272}
.cases a.active{ color:#000000}
.lists a {display: inline-block; margin-left: 20px; line-height:30px; color: #888889; font-size: 14px; margin-bottom:22px;}
.lists a:hover{  text-decoration:underline}
.bt{ border-bottom:1px solid #dcdcdd;width: 100%; height: 100%; margin: 0 auto;   }
.bts{ border-bottom:1px dotted #dcdcdd}
.caselist ul li {
    width: 32.8%;
    float:left;
    position: relative;
    overflow: hidden;
    display: block;
    line-height: 100%;
	margin:0.2%;
}
.caselist ul li img{
    display: block;
    width: 100%;
    height: auto;
}
.caselist .case-summary {display: none;width: 90%;height: 90%;background: url(../images/black.png) repeat;top: 0;left: 0;position: absolute;padding: 5%;opacity: 1;}
.tran {transition: all .3s ease;}
.lazy {background: url(loading.gif) 50% 50% no-repeat;}
.caselist .case-summary .p1 {top: 0;}
.caselist  .case-summary p {color: #f9f9f9;position: absolute;left: 0; font-size: 20px;}
.caselist .case-summary .p2 {bottom: 16px;font-size: 13px;line-height: 1.9em;}
.caselist  .case-summary span { font-size: 24px;}
.bg{}
.syl { font-family: 'Source-Han-Ligh1f4aae45e717e93' !important;}
.item:hover .case-summary {display:block;width: 100%;height: 100%;background: url(../images/black.png) repeat;top: 0;left: 0;position: absolute;padding: 5%;opacity: 1;}
.item:hover img{display: block;transform: scale(1.1);width: 100%;max-height: 100%;}
.tran {
    transition: all .3s ease;
}
.lists a.active{color:#333;text-decoration:underline;}
.lazy {
    background: url(loading.gif) 50% 50% no-repeat;
}
.viewcase{width:80%; margin:0 auto; min-width:1200px; position:relative;}
.viewcase .titles{ font-size:26px;  line-height:36px; color:#000;}
.viewcase .titlesfu{ font-size:15px; line-height:36px; color:#666666;}
.pads{ padding:40px 0px 40px;}
.viewcase img{display:block; margin-top:8px;}
.viewcase .left{float:left; width:50%; color:#4d4d4d; line-height:30px; font-size:15px; height:100%;}
.viewcase .left span{color:#8c8c8c}
.viewcase .left .btn{ position:relative;}
.viewcase .left .btn span{ padding-left:69px; display:inline-block;}
.viewcase .left .btn .btntitle{ position:absolute; left:0px; top:0px;}
.viewcase .right{float:right; width:50%; color:#7f7f7f; line-height:32px; font-size:15px; min-height:120px;}
.viewcase .right .titles{ font-size:30px;}
.viewcase .right .aboutdesn{ padding-top:70px;}
.viewcase .right .hides{ height:256px; overflow:hidden;}
.rightan
{
    text-align:center; width:100%;
-webkit-animation: rightan 1s infinite;
-webkit-animation-fill-mode: both;
}
.rightan img{ width:20px;    display:inline-block}
@-webkit-keyframes rightan
{

from
{
    bottom: 0%;
    opacity: 0;
}
to
{
    bottom: 5%;
    opacity: 1;
}
}
.viewcase .right .aboutdesn p{ font-size:15px;}
.casego{ width:100%; text-align:right; padding:60px 0px;  font-size:15px;}
.casego a{display:inline-block; width:180px;transition: all 0.3s ease;}
.casego a:hover{margin-right:5%;}
.chuangzuo{ }
.fuwu{ position:absolute; left:0px; bottom:40px;  font-size:13px;width:48%;}

@media screen and (max-width: 1702px){
.viewcase{ width:85%;}

}
@media screen and (max-width: 1600px){
    .pad137 {
    padding-bottom: 63px;
}
    .viewcase {
    width: 90%;
}
    .casecenter .t1 {
    font-size: 53px;
}
}
@media  screen and (max-width: 1440px){
    .casecenter {
    width: 90%;
    margin: 0 auto;
    color: #000;
    min-width: 1200px;
}
    .lists a {
    display: inline-block;
    margin-left: 10px;
    line-height: 30px;
    color: #888889;
    font-size: 12px;
    margin-bottom: 22px;
}
    .casecenter li .list img{
    width:80%;
}
    .casecenter li .list {
    width: 150px;
    margin: 0 auto;
    cursor: pointer;
    height: 124px;
    padding-top: 10px;
    vertical-align: middle;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}
    .casecenter li {
    width: 12.5%;
    float: left;
    height: 204px;
    position: relative;
}
    
.casecenter li:hover .list{height:129px; margin-top:-5%; }
}

@media only screen and (max-width: 1230px){
    .casecenter {
    width: 100%;
    margin: 0 auto;
    color: #000;
    min-width: 1200px;
}
    .casecenter .t1 {
    font-size: 43px;
    padding-left:40px;
    padding-right:40px;
}
    .casecenter .t400 {
    font-size: 43px;
    float: right;
    margin-bottom: 0px;
}
    .bt {
    border-bottom: 1px solid #dcdcdd;
    width: 100%;
    margin: 0 auto;
}
    .bter{
    padding-left:40px;
    padding-right:40px;}
     .caselist ul li {
    width: 32.8%;
    float: left;
    position: relative;
    overflow: hidden;
    display: block;
    line-height: 2.9em;
}
     .casecenter li .titles {
    font-size: 13px;
    color: #333333;
    line-height: 30px;
}
.caselist  .case-summary p {color: #f9f9f9;position: absolute;left: 0; font-size: 16px;}
.caselist .case-summary .p2 {bottom: 0;font-size: 13px;}
.caselist  .case-summary span { font-size:18px;}
.lists a {
    display: inline-block;
    margin-left: 12px;
    line-height: 30px;
    color: #888889;
    font-size: 12px;
    margin-bottom: 22px;
}
.casecenter li .desns {
    line-height: 16px; display:none
}
.casecenter li {
    width: 12.4%;
    float: left;
    height: 244px;
    position: relative;
}

}