@charset "utf-8";
@import "common.css";

/*case_list*/

header{ position:fixed; left:0px; top:0px; width:100%;}
header .area{ right:40px;}
.search_area{ position:fixed; left:0px; top:0px; width:100%;}

.search_bg{ display:none; width:100%; height:41px; background: url(../images/search_bg.png) repeat; }
.case{ display:block; overflow:hidden;margin-top:40px;}
.case_list{	
	-webkit-column-width:145px;
	-moz-column-width:145px;
	-o-colum-width:145px;
	-webkit-column-gap:0px;
	-moz-column-gap:0px;
	-o-column-gap:0px;
	  text-align:center;
}
.case_list a{display:inline-block;margin:10px 0px 0px 10px; width:145px; background:#ffffff;vertical-align:middle; 
	transition: top 1s,left 1s;
	-webkit-transition: top 1s,left 1s; 
}
.case_list a img{ width:145px;}
.case_list a span{ display:block; clear:both;  margin:0px 10px;}
.case_list a .project{ margin-top:10px; padding:5px 0px; border-top: 1px dotted #e2e2e2; color:#aeafaf}

/*case_detail*/
.case_detail{ overflow:hidden;  margin:0 auto; width:320px;}
.case_detail_img div{ float:left; overflow:hidden; width:320px;}
.case_detail_img div span{display: table-cell;vertical-align:middle;  }
.case_detail img{ overflow:hidden; width:320px; height:auto; background:#fff; }
.floating_on_bg{z-index:2;opacity:0.8; overflow:hidden;  position:fixed; top:0px; left:0px; width:100%;height:40px; background:#fcfcfc;}
.floating_on h2{ z-index:20; position:fixed;  top:7.5px; left:50%; margin-left:-113px; width:225px; font:1.5em/30px Arial, Helvetica, sans-serif; text-align:center;  }
.floating_on .return,.floating_on .share_icon{ z-index:20;position:fixed;  top:7.5px;width:37px; height:25px;    }
.floating_on .return{ left:15px; }
.floating_on .share_icon{right:15px;}

.floating_under_bg{z-index:2;opacity:0.8; overflow:hidden;  position:fixed; bottom:0px; left:0px; width:100%;height:40px; background:#ffffff; }
.floating_under .botton_go{z-index:20; position:fixed; bottom:0px; left:50%; margin-left:-50px;  width:100px; background:#b23b1c; height:40px; font:1.5em/40px "Microsoft YaHei";color:#ffffff ;  text-shadow:0 1px 0 #933117;text-align:center}
.floating_under .prev,.floating_under .next{z-index:20;  position:fixed; bottom:9px; width:60px; height:21px; font-size:1.3em; color:#000}
.floating_under .prev{ left:15px; }
.floating_under .next{ right:15px; }

/*百度分享*/
.share_area{ z-index:101; position:fixed; left:50%; top:50%; margin-top:-105px; margin-left:-123px; width:246px; height:210px; background:#313131; text-align:center; 
border-radius: 5px;
-webkit-border-radius: 5px; 
-moz-border-radius: 5px; }
.share_cance{ width:200px; height:40px; margin:0 auto; display:block; overflow:hidden; line-height:40px; border:1px solid #000; border-radius: 5px; text-align:center; background:#363636; font-size:1.2em; }
.share_cance:hover ,.share_cance:active{ background:#c8421f;}
.share_areabox{width:200px; margin:0 auto; padding-top:30px; display:block; overflow:hidden;}
.share_areabox a,.share_areabox span{  float:left; display:block; margin:0px 17px 20px 17px;}
@media screen and (max-width:464px) {
.case{ overflow:hidden; margin:75px auto 50px; width:320px;}
 
}

/*attr_box*/
.attr_box{ margin-top:10px; padding:0px 10px;}
.attr_box h2{ position:relative; margin-bottom:10px; height:16px; font-size:16px; line-height:100%; }
.attr_box h2 p{ z-index:5;  position:absolute; left:10px; display:inline-block; padding:0px 5px;background:#e8e8e8}
.attr_box .flipsnap_img{ display:block; overflow:hidden;  height:100px;}
.attr_box .flipsnap_img img{ float:left; margin-right:10px; width:130px; height:100px;}
.attr_box .white_box{ overflow:hidden; margin-top:10px; padding:10px 0px; background:#ffffff;}
.attr_box h3{margin-left:10px;font-size:1.1em;}
.white_box .button_gray{ float:left; margin:10px 0px 0px 10px;  padding:2px 0px; width:63px; font-size:1.1em}
.attr_box .promotions_box{ margin-top:10px; }