.contents{ margin:16px auto 0 auto;}
.lefts{ display:inline; float:left; width:948px;}
.rights{display:inline; position:relative; float:right; width:242px;}



.cases_box{ border:#e5e5e5 solid 1px; width:946px; background:#fff; }

.cases_top{ position:relative; padding-left:46px; height:50px; line-height:50px; border-bottom:#e5e5e5 solid 1px; background:url(../images/nav_ico.png) no-repeat 24px center;color:#999;}
.cases_top a{ color:#256ba9;}

.cases_top .cases_top_span{ position:absolute; right:10px; top:0; height:50px; line-height:50px; }
.cases_top .cases_top_span strong{ color:#ea5504;}


.cases_nav{ margin-bottom:8px;padding-left:23px; height:28px; line-height:28px;background:url(../images/nav_ico.png) no-repeat 0px center;}
.cases_nav a{ color:#256ba9;}

.cases_search{ width:100%;}
.cases_search dl{ border-bottom:#e5e5e5 solid 1px; }
.cases_search dl dt{display:table-cell;vertical-align:middle;text-align:center; min-height:50px; width:130px; color:#000;border-right:#e5e5e5 solid 1px; background:#f2f2f2; line-height:50px;}
.cases_search dl dd{ display:table-cell; width:810px;vertical-align:middle;}

.cases_search dd a{display:inline-block;*display:inline;*zoom:1; vertical-align:top; padding:0 8px; margin:5px 6px; height:28px; line-height:28px;}
.cases_search dd a:hover,.cases_search dd a:active,.cases_search dd a.hover{text-decoration:none; background:#f49727; color:#fff; border-radius:3px;}

.cases_sort{ padding:9px 20px;}

.cases_sort a{display:inline-block;*display:inline;*zoom:1; vertical-align:top; margin-left:-1px; width:85px; height:30px; line-height:30px; text-align:center; border:#ebebeb solid 1px;}
.cases_sort a:hover,.cases_sort a:active,.cases_sort a.hover{text-decoration:none; background:#f2f2f2; color:#f49727;}

.cases_list{ margin-left:-12px;}

.cases_list dl{ position:relative; display:inline; float:left; margin:16px 0 0 13px; width:305px; height:336px; border:#e8e8e8 solid 1px; background:#fff; text-align:center;}
.cases_list dt{z-index:1;}
.cases_list dt img{ height:216px; max-width:305px; }

.cases_list dd{ height:120px;}
.cases_list dd label{display:table-cell;vertical-align:middle;height:120px;  width:106px; }
.cases_list dd label img{ width:72px; height:72px;border-radius:36px;}

.cases_list dd div{display:table-cell;vertical-align:middle;  width:198px; text-align:left;}
.cases_list dd h4{ display:block; font-size:16px; font-weight:normal; color:#333;}
.cases_list dd p{ padding:6px 0;  display:block; font-size:12px; color:#999;}

.cases_list dd i{display:inline-block; width:58px; height:22px; line-height:22px; font-style:normal; border:#d2d2d2 solid 1px; text-align:center; border-radius:3px;}

.cases_list dd i:hover{ background:#f6363a; color:#fff; border-color:#ea5504}
.cases_list dl{transition: all 0.3s;}
.cases_list dl:hover{ -moz-box-shadow: 2px 2px 6px #dcdcdc; -webkit-box-shadow: 2px 2px 6px #dcdcdc; box-shadow: 2px 2px 6px #dcdcdc;}

.cases_fw{display:block; margin:0 0 16px 0; width:240px; height:254px; background:#fff; border:#e5e5e5 solid 1px;}

.cases_fw dt{ display:block; padding-left:74px; position:relative; height:85px; border-bottom:#e8e8e8 solid 1px;}
.cases_fw dt span{display:block; padding-top:20px; font-size:20px; font-weight:800; color:#000;}
.cases_fw dt label{display:block; padding-top:2px; font-size:12px; color:#999;}

.cases_fw dt:before{content: "";   position:absolute; top:28px; left:26px;width:40px; height:40px; background: url(../images/cases/cases_fw_ico.png) no-repeat;background-position:0 0}

.cases_fw dd{ display:block;}
.cases_fw dd p{ display:block;position:relative; padding-left:78px; height:48px; line-height:48px;}
.cases_fw dd p:before{content: "";   position:absolute; top:8px; left:36px;width:40px; height:40px; background: url(../images/cases/cases_fw_ico.png) no-repeat; background-position:0 -40px;}

.cases_bm{ top: 0; width:240px; min-height:260px; background:#fff; border:#e5e5e5 solid 1px;}
.cases_bm h2{ display:block; font-size:18px; padding:20px 0 2px 0; text-align:center;}

.cases_bm input[type="text"],.cases_bm input[type="tel"]{ margin:16px auto 0 auto; display:block; border:#666 solid 1px; padding-left:12px; text-align:left;width:196px;height:34px; border-radius:3px;}
.cases_bm button,.cases_bm .cases_bm_btn{  margin:16px auto 0 auto; display:block; border:0; width:208px; height:40px; line-height:40px; background:#f6363a; font-size:16px; text-align:center; color:#fff; cursor:pointer; border-radius:3px;}
.cases_bm p{ display:block; padding:16px 0 0 0; text-align:center;}

.lefts_details{display:inline; float:left; padding:30px 30px 50px 30px; width:886px;  background:#fff; border:#e5e5e5 solid 1px; }
 
.details_top{ position:relative; height:54px;border-bottom:#e8e8e8 solid 1px;}
.details_top h1{ font-size:32px;}
.details_top span{ position:absolute; right:0; bottom:16px; color:#999; font-size:12px;}
.details_top span strong{ font-size:18px;}

.details_tag{ margin-top:21px;}
.details_tag .details_designers,.details_tag dl{display:inline-block;*display:inline;*zoom:1; vertical-align:middle;font-size:22px; color:#363636;}
.details_tag i{ display:block; color:#999; font-size:12px; font-style:normal;}

.details_tag .details_designers{ position:relative;width:254px; height:72px;}
.details_designers label{display:table-cell;vertical-align:middle; width:78px;}
.details_designers label img{ width:58px; height:58px;border-radius:29px;}
.details_tag .details_designers div{display:table-cell;vertical-align:middle;}


.details_tag .details_designers span{position:absolute; top:12px; left:170px; width:58px; height:22px; line-height:22px; font-style:normal; border:#ea5504 solid 1px; text-align:center; border-radius:3px; font-size:12px; background:#f6363a; color:#fff; cursor:pointer;}


.details_tag dd{position:relative; display:inline-block;*display:inline;*zoom:1; vertical-align:top; border-left:#ccc solid 1px; padding:2px 25px 0 72px; height:46px; }

.details_tag dd:before{content: "";   position:absolute; top:6px; left:20px;width:40px; height:40px; background:url(../images/cases/details_tag_ico.png) no-repeat;}
.details_tag dd:nth-child(2):before { background-position:0 -40px;}
.details_tag dd:nth-child(3):before { background-position:0 -80px;}


.details_summary{margin-top:18px; border:#d1d1d1 solid 1px; padding:16px 25px; line-height:30px;}

.details_contents{margin-top:18px;  line-height:1.5;}
.details_contents img{ margin-top:15px; max-width:100%;}

.cases_other{ margin:18px auto 0 auto; border-top:#e8e8e8 solid 1px;}
.cases_other h2{ display:block; padding-bottom:10px; height:45px; line-height:45px;}
.cases_other dl{ margin:0 auto 0 -20px; display:block; overflow:hidden;}
.cases_other dd{ position:relative; display:inline; float:left; margin-left:24px; width:200px; height:142px;}
.cases_other dd img{ width:100%; height:100%;}
.cases_other dd h4,.cases_other dd h5{ position:absolute; left:0px; bottom:0px; width:100%; height:35px; line-height:35px; color:#fff; text-align:center;}
.cases_other dd h5{  background:#000; opacity:0.5;}

.details_previous_next{ position:relative; margin:50px auto; height:40px; text-align:center; }
.details_previous_next .previous,.details_previous_next .next{display:inline-block;*display:inline;*zoom:1; vertical-align:top;background:#e8e8e8; border-radius:5px; line-height:40px; width:170px; box-sizing:border-box;}
.details_previous_next .previous{ padding-left:28px; text-align:left; color:#ccc;}
.details_previous_next .next{ padding-right:28px; text-align:right;}
.details_previous_next .previous a.details_previous_next .next a{ color:#000;}
.details_previous_next .previous a:hover,.details_previous_next .next a:hover{ font-weight:400; color:#f49727;}
.details_previous_next .details_zx{ position:absolute; left:50%; top:50%; margin:-42px 0 0 -42px; background:#f49727;  color:#fff;  width:78px; height:78px; line-height:78px; border-radius:78px; border:#fff solid 3px; text-align:center;}