﻿@charset "utf-8";
/* CSS Document */

.news{float:left;width:100%;margin-top:20px;}
/* 主页左侧新闻 */
.showtab{float:left;width:100%;overflow:hidden}

.showtab .tabbtn{height:42px;line-height:42px;width:100%;border-bottom:2px solid #f0f0f0;font-size:16px;margin-bottom:10px}
.showtab .tabbtn li{float:left;width:121px; border:solid 1px #f0f0f0;line-height:40px;text-align:center;cursor:pointer}
.showtab .tabbtn .current{background:#f0f0f0;color:#000;font-weight:bold}

.showtab .tabcon{float:left;width:100%;margin-bottom:10px}
.showtab .tabcon .sublist{float:left}
.showtab .tabcon .product{position:relative;width:50%;height:180px;float:left;padding:10px 20px;overflow:hidden;-webkit-transition:all .2s linear;transition:all .2s linear;_display:inline;_zoom:1}
.showtab .tabcon .thumbnail{position:relative;width:100%;overflow:hidden;height:170px}
.showtab .tabcon .thumbnail img{transition:transform 0.3s ease 0s;width:100%;}
.showtab .tabcon .thumbnail .overlay{position:absolute;z-index:2;width:100%; height:40px;padding:0 15px; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.5);color:#fff;white-space: nowrap;overflow:hidden; text-overflow: ellipsis;font:100 14px/40px "微软雅黑"}

.showtab .tabcon .newslist{overflow: hidden;padding:15px 15px 10px 15px}
.showtab .tabcon .newslist li{float:left;width:50%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:30px;line-height:30px;padding:0 25px;background:url(../images/top_bg.png) no-repeat scroll 12px -268px transparent}

.showtab .tabcon .sublist .hot{float:left;width:243.33px;margin:0 5px;border:1px solid #f0f0f0;border-top:3px solid #FF6000;padding:10px}
.showtab .tabcon .sublist .hot .title{float:left;width: 100%;font:800 14px/31px "微软雅黑"}
.showtab .tabcon .sublist .hot li{ float:left; width:100%;font:100 14px/30px "微软雅黑";height:30px;overflow:hidden}
.showtab .tabtitle{height:42px;width:100%;border-bottom:2px solid #f0f0f0}
.showtab .tabtitle .active,.tabtitle .normal{float:left;width:121px; border:solid 1px #f0f0f0;line-height:40px;text-align:center;cursor:pointer}
.showtab .tabtitle .active{background:#f0f0f0;color:#000}

.showtab .TabContent{float:left;width:100%}
.showtab .TabContent .product{position:relative;width:100%;height:190px;float:left;padding:20px 10px 10px 10px; overflow:hidden;-webkit-transition:all .2s linear;transition:all .2s linear;_display:inline;_zoom:1}
.showtab .TabContent .thumbnail{position:relative;width:100%;overflow: hidden}
.showtab .TabContent .thumbnail img {transition:transform 0.3s ease 0s;width:380px;height:170px}
.showtab .TabContent .overlay{position:absolute;z-index:2;width:100%;height:45px;padding:0 15px;left:0;bottom:0; background:rgba(0, 0, 0, 0.5);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:800 16px/45px "微软雅黑"}
.showtab .TabContent .newslist{position:relative;height:96px;line-height:30px;text-align:left;white-space:nowrap; overflow:hidden;text-overflow:ellipsis;padding:10px 5px}

.showtab .TabContent .newslist li {line-height: 32px; padding-left: 25px; background: url(../images/top_bg.png) no-repeat scroll 12px -268px transparent}

@media (max-width:767px){
.showtab .tabbtn li{width:33.3333%}
.showtab .tabcon{margin-bottom:0px}
.showtab .tabcon .newslist{padding:5px 0 15px 0}
.showtab .tabcon .newslist li{width:100%;}
.showtab .tabcon .sublist .hotlist{display:none}}
@media (min-width:768px){
.showtab .tabcon .newslist{padding:5px 15px 15px 0}
.showtab .tabcon .newslist li{width:50%}}
@media (min-width:992px){
.showtab .tabcon .product{position:relative;width:50%;height:180px;float:left;padding:10px 6px 0px 6px;overflow:hidden;-webkit-transition:all .2s linear;transition:all .2s linear;_display:inline;_zoom:1}	
.showtab .tabcon .sublist .hot{float:left;width:302px;margin:0 5px;border:1px solid #f0f0f0;border-top:3px solid #FF6000;padding:10px;}}
@media (min-width:1200px){	
.showtab .tabbtn li{float:left;width:121px; border:solid 1px #f0f0f0;line-height:40px;text-align:center;cursor:pointer;}
.showtab .tabcon .sublist .hot{float:left;width:243.33px;margin:0 5px;border:1px solid #f0f0f0;border-top:3px solid #FF6000;padding:10px;}
.showtab .tabcon .sublist .hot .title{float:left;width: 100%;font:800 14px/31px "微软雅黑";padding-left:30px;background:url(../images/top_bg.png) no-repeat scroll 0px -212px transparent;color:#a20000}
.showtab .tabcon .sublist .hot ul{float:left;padding-left:25px;background:url(../images/top_bg.png) no-repeat scroll 0px -314px transparent}
.showtab .tabcon .sublist .hot li{ float:left;font:100 14px/30px "微软雅黑"}
.showtab .tabtitle{height:42px;width:100%;border-bottom:2px solid #f0f0f0}}

/* 左侧新闻 */
article{float:left;width:50%;margin:0;padding:10px 0}
article a:hover{text-decoration:none}
article .pic{float:left; height: auto; border:1px;position: relative;}
article .pic img{width: 100%; height:130px; border:0px solid #ddd;}
article .newsbox { float:left;height:80px; overflow: hidden; padding: 0px 8px 0px 10px; }
article .newsbox .title{ float: left; font-weight:100; line-height:30px; overflow:hidden;}
article .newsbox .area{}
article .newsbox p{ float:left; color:#333 ; font:200 14px/20px "微软雅黑"; margin:10px 0px 0 0px; height: auto; overflow:hidden; width:100%}

@media (max-width:767px){
section{float:left;width:100%}
article{padding: 5px 0 0 0}
article .pic{width:100%;float:left;height:auto;border:1px;position:relative;padding: 0px 4px 0 4px;}
article .pic img{width:100%;height:110px;border:0px solid #ddd;}
article .newsbox{float: left;width: 100%;height:35px;overflow:hidden;padding:0px 0px 0px 0px;}
article .newsbox .title{text-align: center;width: 100%;font:100 14px/30px "微软雅黑"}
article .newsbox .other{display:none}
article .newsbox .area{display:none}}

@media (min-width:1200px){
article{padding: 10px 0}
aside{ display: block }	
article .newsbox .other{ display:block; float: left; width:100%; padding:10px 0 0 0; color:#999; font-size:12px}
article .newsbox p{}}

/* 3列图片显示 */
@media (min-width:768px){
article{width:50%;margin:0;padding:10px 0}
article{ padding: 10px 0 }
article .pic{width:215px;}
article .newsbox .title{font:100 16px/33px "微软雅黑";line-height:30px;height:30px;overflow:hidden;white-space:nowrap;width:100%}
.column3 .newsbox .title a{display: inline-block;}
.column3 .newsbox .title .area{color:#FF6000}}
@media (min-width:992px){
.column3{float:left;width:50%}
.column3 .p3{width:100%;padding:0 5px}
.column3 .newsbox{height:95px;padding:0px 8px;float: left;}
.column3 .newsbox .title{font-size:14px;font-weight:800;line-height:30px;height:30px;overflow:hidden;white-space:nowrap;width:100%}
.column3 .newsbox .title a{display: inline-block;}
.column3 .newsbox .title .area{color:#FF6000}
.column3 .newsbox .other{display:none}
.column3 .newsbox p{margin:0px 0 3px 0}}
@media (min-width:1200px){
.column3{float:left;width:25%}
.column3 .p3{width:100%;padding:0 5px}
.column3 .newsbox{height:95px;padding:0px 3px;width:100%;}
.column3 .newsbox .title{font-size:14px;font-weight:800;line-height:30px;height:30px;overflow:hidden;white-space:nowrap;width:100%}
.column3 .newsbox .title a{display: inline-block;}
.column3 .newsbox .title .area{color:#FF6000}
.column3 .newsbox .other{display:none}
.column3 .newsbox p{margin:0px 0 3px 0;display: block;}}
