@CHARSET "UTF-8";
.pc-template{padding:10px;}
.pc-template .title{padding:5px 10px;}
.template-list{padding:10px;border: 1px solid #eee;}
.template-list ul{overflow: hidden;}
.template-list li{position: relative;float:left;width: 294px;height: 294px;margin:0 20px 20px 0;background: url("../images/computer_model.png") 0 0/100% no-repeat;}
.template-list li h4{text-align: center;color:#ffffff;margin:20px 0 10px;}
.template-list li p{text-align: center;color:#ffffff;overflow: hidden;white-space: pre;margin: 0 10px;}
.template-list li .mask-layer{background: rgba(0,0,0,0.6);position: absolute;width:100%;height:100%;z-index:1;display:none;}
.template-list li:hover .mask-layer{display:block;}
.template-list li .mask-layer .btn-common{position: absolute;top:50%;left:50%;font-size: 14px;margin: -15px 0 0 -75px !important;transition: background 0.8s;-webkit-transition: background 0.8s;}
.template-list li .template-thumbnail{width: 223px;height: 126.5px;overflow: hidden;position: absolute;top: 90px;left: 35px;}
.template-list li .template-thumbnail img {width: 100%;height: 100%;}