.tabs-list { list-style:none; }
.tabs-list li { display:inline-block; *display:inline; *zoom:1; margin-right:10px; margin-bottom:2px; }
.tabs-list li a { display:block; height:38px; line-height:38px; padding:0 30px; /*background-color:#ebebeb;*/ color:#808080; text-decoration:none; font-size:14px; transition:all 0.4s ease 0s; }
/*.tabs-list li a:hover { background-color:#d9d9d9; }
.tabs-list li.active a { background-color:#abcea7; color:#fff; }*/
.tab-content { margin:10px 0 15px; }
.tabs .accordion-handle, .tabs-2 .accordion-handle { display:none; }

.tabs-vertical-left, .tabs-vertical-right { *zoom:1; margin-bottom:30px;}
.tabs-vertical-left:before, .tabs-vertical-left:after, .tabs-vertical-right:before, .tabs-vertical-right:after { visibility:hidden; display:block; font-size:0;content:" "; clear:both; height:0; }
.tabs-vertical-left .tabs-list, .tabs-vertical-right .tabs-list { width:25%; }
/*.tabs-vertical-left .tabs-list li,*/ .tabs-vertical-right .tabs-list li { display:block; width:100%; }
.tabs-vertical-left .tabs-list li a, .tabs-vertical-right .tabs-list li a { height:auto; line-height:1.5; font-size:16px}
.tabs-vertical-left .tabs-list { float:left; }
.tabs-vertical-left .tabs-container { float:right; }
.tabs-vertical-left .tabs-container .tab-content { margin:0 0 0 15px; }
.tabs-vertical-right .tabs-list { float:right; }
.tabs-vertical-right .tabs-container { float:left; }
.tabs-vertical-right .tabs-container .tab-content { margin:0 15px 0 0; }
/*.tabs-vertical-left .tabs-container, .tabs-vertical-right .tabs-container { width:75%; }*/
.accordion-handle { position:relative; margin-bottom:10px; /*background-color:#ebebeb;*/ background-color:#e5ddc4; text-decoration:none; /*color:#808080;*/ color: #9c8a52; cursor:pointer; transition:all 0.4s ease 0s; }
.accordion-handle:hover { background-color:#4c7dcd; }
.accordion-handle.active { /*background-color:#4c7dcd;*/  background-color:#d5994b; color:#fff; }
.accordion-handle h4 { height:2em; line-height:2em; padding:0 15px; font-size:1.2em; font-weight:normal; }
.accordion-handle i { display:block; width:38px; height:38px; overflow:hidden; position:absolute; right:0; top:0; background:url(../images/icon-accordion.gif) no-repeat top center; }
.accordion-handle.active i { background-position:bottom center; }
.accordion-content { margin-bottom:15px; display:none; }


/* tabs-1 样式 */

@media only screen and ( max-width:768px ){
	.responsive-tabs .tabs-list { display:none; }
	.responsive-tabs .accordion-handle { display:block; }	
	.responsive-tabs.tabs-vertical-left .tabs-container, .responsive-tabs.tabs-vertical-right .tabs-container { width:100%; float:none; }
	.responsive-tabs.tabs-vertical-left .tabs-container .tab-content, .responsive-tabs.tabs-vertical-right .tabs-container .tab-content { margin:10px 0 15px; }	
}

@media only screen and ( min-width:768px ){
	.responsive-tabs .tabs-list { display:block; }
	.responsive-tabs .accordion-handle { display:none; }
	.tabs-vertical-left .tabs-list li {  width: calc(100% / 2 - 5px); margin-right: 5px; margin-bottom: 5px; position: relative; left: 0px; bottom: 0px; float: left;}
	.tabs-vertical-left .tabs-list li:nth-child(even) {	margin-right: 0px;} 
	.tabs-list li a {padding: 0px;}
	.tabs-vertical-left .tabs-list li .pic{ float: left; width: 100%; position: relative;}
	.tabs-vertical-left .tabs-list li .pic img{width:100%; height: 100%; border-radius: 10px;}
	.tabs-vertical-left .tabs-list li .pic p{ width:100%; color:transparent; line-height:26px; position:absolute; left:0px; bottom:0px;/* background:url(../img/tab_bg.png);*/}
	.tabs-vertical-left .tabs-list li .pic p a{color:transparent;}
	.tabs-vertical-left .tabs-list { width:30%; }
	.tabs-vertical-left .tabs-container { width:70%; }
	.tabs-vertical-left .tabs-container .tab-content{ overflow: hidden; margin-right: 10px;}
	.tabs-vertical-left .tabs-list li{ /*opacity:0.6;*/ opacity:0.8; filter:alpha(opacity=60);	transition: .5s;} 
	.tabs-vertical-left .tabs-list li.active/*  , .tabs-vertical-left .tabs-list li:hover*/{ opacity:1; filter:alpha(opacity=100);	transition: .5s;} 
}
	
/* tabs-2 样式 */

@media only screen and ( max-width:768px ){
	.demo{ margin: 0 10px;}
	.tabs-2 .tabs-container .tab-content .pic img{ width: 100%; /*height: 100%;*/ height: auto;}
}

@media only screen and ( min-width:768px ){	
	/*先假定并列10个*/
	.demo{ width: 1100px;}
	.tabs-2 .tabs-list{ overflow: hidden;}
	.tabs-2 .tabs-list li {  width: calc(100% / 10 - 5px); margin-right: 5px; margin-bottom: 5px; position: relative; left: 0px; bottom: 0px; float: left; opacity:0.6; filter:alpha(opacity=60);	transition: .5s;}
	.tabs-2 .tabs-list li:nth-last-child{margin-right: 0px;}
	.tabs-2 .tabs-list li a { display:block; height:73px; /*background-color:transparent;*/ color:transparent; transition: .5s;}
    .tabs-2 .tabs-list li .pic img{ width: 100%; height: 100%;}
	.tabs-2 .tabs-list li .pic p{ width:100%; color:transparent; line-height:26px; position:absolute; left:0px; bottom:0px;/* background:url(../img/tab_bg.png);*/}
	.tabs-2 .tabs-list li.active/*  , .tabs-vertical-left .tabs-list li:hover*/{ opacity:1; filter:alpha(opacity=100);	transition: .5s; background-color:#0986F0;} 
	/*.tabs-2 .tabs-list li a:hover { background-color:transparent;  }*/
	.tabs-2 .tab-content{ overflow: hidden;}
}


/* tabs-3 样式 */
@media only screen and ( max-width:768px ){
	.demo{ margin: 0 10px;}
	.tabs-3 .tabs-container .tab-content .pic img{ width: 100%; height: 100%;}
}

@media only screen and ( min-width:768px ){	
	/*并列8个*/
	.demo{ width: 1100px;}
	.tabs-3 .tabs-list{ width: calc(18% - 5px); margin-right: 5px; float: left;}
	.tabs-3 .tabs-list li {  width: 100%; margin: 0px; margin-bottom: 5px; padding: 0px; /*background-color:#EBEBED;*/ /*background-color:#ebdfbb;*/ transition: .5s;}
	.tabs-3 .tabs-list li:nth-last-child{margin-right: 0px;}
	.tabs-3 .tabs-list li a { display:block; height: 40px; line-height: 40px; transition: all 0.4s ease 0s; padding-left: 70px;  background-color: #ebebeb;   /*color: #808080;*/ color: #f6d095;   text-decoration: none;   font-size: 18px; background: url(../img/icon_person.png) no-repeat 10px 5px; background-size: 40px 90%; }
	.tabs-3 .tabs-list li.active a { /*background-color: #4c7dcd;*/ background-color: #d5994b; color: #fff;}
    .tabs-3 .tabs-list li .pic img{ width: 100%; height: 100%;}
	.tabs-3 .tabs-list li .pic p{ width:100%; color:transparent; line-height:26px; position:absolute; left:0px; bottom:0px;/* background:url(../img/tab_bg.png);*/}
	.tabs-3 .tabs-list li.active/*  , .tabs-vertical-left .tabs-list li:hover*/{ opacity:1; filter:alpha(opacity=100);	transition: .5s; background-color:#4c7dcd;} 
	/*.tabs-2 .tabs-list li a:hover { background-color:transparent;  }*/
	.tabs-3 .tab-content{ overflow: hidden; width: calc(100% - 20px); padding:10px 10px; padding-bottom: 20px; margin: 0px;}
	.tabs-vertical-left .tabs-container-3{width:82%; float: left;}   
	

}