@charset "utf-8";
.main_banner{height: 210px; position:relative; background: #ff6e03; text-align: center;}
.main_banner h1{padding-top:50px;color:#fff; font-size: 38px; font-weight: lighter;}
.main_banner .tab{  position: absolute;left:50%;bottom:-24px;margin-left:-154px;}
.main_banner .tab li{ float: left; font-size: 16px;}
.main_banner .tab li a{ display: block;width:154px;height:48px; line-height: 48px; text-align: center; text-decoration:none;border:1px solid #d16602;border-color:rgba(0,0,0,.3); color:#666;background: #fff;}
.main_banner .tab li a:hover{color:#ff6e03;}
.main_banner .tab li.active a{ background: #ff6e03;color:#fff; box-shadow: inset 0 8px 15px rgba(0,0,0,.1);border-color:rgba(0,0,0,.3);}
.main_banner .tab li:first-child a{border-radius:10px 0 0 10px ;}
.main_banner .tab li:last-child a{border-radius:0 10px 10px 0 ;}
.main_body{padding:30px 0;margin: 30px auto 15px; position: relative; overflow: hidden;}
.main_left{ position:absolute;top:30px;left:0;margin:0 0 -999em;padding:0 0 999em;width:260px;border-top:2px solid #ff6e03; background: #f9f9f9;}
.templets_class_group{padding:15px 15px 0;}
.templets_class_group h3{font-weight:normal; font-size:16px;color:#333;}
.templets_class_list{margin:10px -10px 0 0;}
.templets_class_list li{ float: left;margin:0 10px 10px 0;}
.templets_class_list li a{ display: block;width:108px;height:38px; line-height: 38px; text-align: center; background: #fff;text-decoration:none;color:#999999; border:1px solid #e5e5e5;  overflow: hidden;}
.templets_class_list li.active a{color:#ff6e03;border-color: #ff6e03;}
.templets_class_list li a:hover{color:#ff6e03;}
.main_right{ position:relative;width:670px;margin:0 0 -999em 290px;padding:0 0 999em;min-height: 600px;*height:600px;}
.templets_list{margin-right:-27px;}
.templets_list li{ float: left;margin:0 27px 20px 0;}
.templets_list li h4{ text-align: center; font-size: 15px; font-weight: normal;width:195px;height:20px; line-height:20px;padding:5px;}
.templet_box{ position:relative; display:block;width:199px;height:300px;padding:2px;border:1px solid #e5e5e5; overflow: hidden;}
.templet_box:hover{border-color:#ff6e03;}
.templet_box img{width: 100%;}
.templet_des{ position: absolute;bottom:-122px;left:0; opacity:0;width:100%;height:100px; background: rgba(255,255,255,.9);border-top:2px solid #ff6e03;}
.templet_des p{padding:10px;height:5.4em;overflow:hidden;}

.templet_panel{ background: #f9f9f9;border-top:2px solid #ff6e03;height:630px;}
.templet_gallery{position: relative;height:600px;width:320px;padding:15px 0 15px 15px; float: left;}
.gallery_box{ position: relative;height:567px;width:320px; background: #f9f9f9; overflow: hidden;}
.gallery_box ul{position:absolute;left:0;top:0;width: 5000px;height:567px;}
.gallery_box ul li{ float: left;height:567px;width:320px; text-align: center;}
.gallery_box ul li:after{content:"";width: 0;height:100%; vertical-align: middle;  display:inline-block;*display:inline;zoom:1;}
.gallery_box ul li img{max-width: 100%; vertical-align: middle;}
.gallery_curr{ text-align: center;margin:15px 0;}
.gallery_curr a{ display:inline-block;*display:inline;zoom:1;height:8px ;width: 8px; background: #e1e1e1;border-radius: 4px;}
.gallery_curr a.active{ background: #ff6e03;}
.gallery_ctrl a { display: none; position: absolute; top: 50%;margin-top:-44px;  height: 88px; width: 40px; background:  url(images/icon_control.png) no-repeat; opacity: .8; }
.gallery_ctrl a:hover { opacity: 1; }
.gallery_ctrl a.prev { left: 20px; }
.gallery_ctrl a.next { right: 20px; background-position: -40px 0; }
.templet_gallery:hover .gallery_ctrl a{display: block;}

.templet_info{margin-left:335px;width:565px;padding:45px 30px; font-size: 14px;}
.templet_info h1{ font-size: 32px; font-weight:lighter;margin-bottom:10px;}
.templet_info .label{display:inline-block;*display:inline;zoom:1;padding:2px 5px; margin-right:5px; background: #ff6e03; color: #fff;border-radius:3px; text-decoration: none;}
.templet_details{padding:10px 0 30px;margin:10px 0 0;border-top:1px solid #e5e5e5;}
.templet_details p{margin:0 0 8px 0;}
.templet_case{padding:0 0 30px 0;}
.templet_case ul{padding:10px 0 0;width:100%;height:140px; overflow: hidden;}
.templet_case ul li{ float: left;margin:0 10px 10px 0; text-align: center;color:#999;}
.templet_case ul li a{ display: block;height:114px;width:114px;margin-bottom:10px;border-radius: 20px; overflow: hidden; background: #e5e5e5;}
.templet_link{display: inline-block;padding:10px 20px;background: #ff6e03;color:#fff; font-size: 14px;border-radius: 5px;margin-bottom:10px;}
.templet_link:hover{text-decoration:none;background:#ff8b03 ;}
.templet_feature{padding:30px 15px;}
.templet_feature .title{ font-size: 16px;height:16px; line-height: 16px;padding:2px 5px; font-weight: normal;border-left:2px solid #ff6e03;}
.feature_content{padding-top:20px;}

.b_nav{color:#999;margin:20px 0;padding:0 10px;border-left:2px solid #ff6e03;}
.b_nav span{margin:0 10px;}
.pagination { text-align: center; padding: 10px 10px 20px; }
.pagination a { display: inline-block; _display: inline; zoom: 1; line-height: 12px; margin: 0 3px; padding: 7px 9px; text-align: center; border: 1px solid #eaeaea; }
.pagination .curr { color: #fff; background: #ff6e03; border: 1px solid #ff6e03; }