@charset 'utf-8';

.materials{padding: 60px 0;}
.materials .materials_tab{}
.materials .materials_tab ul li{display: inline-block; font-size: 16px; line-height: 32px; padding-bottom: 2px; margin: 5px 22px; cursor: pointer;}
.materials .materials_tab ul li.current{color: #fc5e15; border-bottom: solid #fc5e15 2px; padding-bottom: 0;}
.materials .materials_content{margin-top: 35px;}
.materials .materials_list{display: none;}
.materials .materials_list.show{display: block;}
.materials .materials_list::after{content: ''; display: table; clear: both;}
.materials .materials_list .list{width: 23.5%; float: left; box-sizing: border-box; border: solid #e5e5e5 1px; margin: 0 2% 30px 0;}
.materials .materials_list .list:nth-child(4n+1){clear:both;}
.materials .materials_list .list:nth-child(4n){margin-right: 0;}
.materials .materials_list .list .picture{overflow: hidden;}
.materials .materials_list .list .picture img{width: 100%; height: auto; transition: all 0.5s;}
.materials .materials_list .list .picture:hover img{transform: scale(1.1);}
.materials .materials_list .list .contact{padding: 20px; background: #fff;}
.materials .materials_list .list .title{font-size: 20px; font-weight: bold;}
.materials .materials_list .list .text{font-size: 16px; line-height: 24px; margin-top: 20px;}
.materials .materials_list .list .text a{display: block; height: 144px; overflow: hidden;}
.materials .materials_list .list .more{margin-top: 20px;}
.materials .materials_list .list .more a{font-size: 16px; color: #fc5e15;}

@media (max-width:960px) {
	.materials{padding: 30px 10px;}
	.materials .materials_tab ul::after{content: ''; display: table; clear: both;}
	.materials .materials_tab ul li{width: 32%; float: left; text-align: center; font-size: 12px; line-height: 20px; box-sizing: border-box; border: solid #e5e5e5 1px; padding: 5px 0; margin: 0 2% 10px 0;}
	.materials .materials_tab ul li:nth-child(3n){margin-right: 0;}
	.materials .materials_tab ul li.current{padding-bottom: 3px;}
	
	.materials .materials_content{margin-top: 20px;}
	.materials .materials_list .list{width: 48%; margin: 0 4% 20px 0;}
	.materials .materials_list .list:nth-child(2n+1){clear:both;}
	.materials .materials_list .list:nth-child(2n){margin-right: 0;}
	.materials .materials_list .list .contact{padding: 10px 6px; background: #fff;}
	.materials .materials_list .list .title{font-size: 14px; font-weight: bold;}
	.materials .materials_list .list .text{font-size: 12px; line-height: 20px; margin-top: 10px;}
	.materials .materials_list .list .text a{display: block; height: 140px;}
	.materials .materials_list .list .more{margin-top: 10px;}
	.materials .materials_list .list .more a{font-size: 12px;}
}



