@charset "UTF-8";

.wrap-notice{width: 100%; padding:40px; overflow: hidden; position: relative; border:1px solid #ddd;}
.wrap-notice > ul > li .list {display: none;}
.wrap-notice > ul > li.on .list {display: block;}
.wrap-notice > ul li li.nodata{line-height:260px; text-align:center;}

.wrap-notice .title{position: absolute; left: 40px; top:40px;}
.wrap-notice .title-text{font-size: 21px;color: #666;font-family: 'Noto Light';}
.wrap-notice .on .title-text{color: #0d63b0;font-weight: normal;font-family: 'Noto Medium';}

.wrap-notice > ul > li:nth-child(2) .title {top: 90px;}
.wrap-notice > ul > li:nth-child(3) .title {top: 135px;}
.wrap-notice > ul > li:nth-child(4) .title {top: 180px;}
.wrap-notice .more{width: 25px; height: 25px; background-image: url(../images/more_btn.png); background-size: cover; top: 20px; position: absolute; right: 20px; text-indent: -9999px;}
.wrap-notice .con{overflow: hidden; position: relative; margin-bottom: 20px;}

.wrap-notice .list{margin-left:150px;}
.wrap-notice .list li:last-child .con{margin-bottom: 0;}
.wrap-notice .notice-date{width: 80px; height: 80px; border-radius: 50%; background-color: #e9e9e9; float: left; text-align:center; display:table; color:#7e7e7e}
.wrap-notice .list li:hover .notice-date{background-color: #96daf3; color:#fff;}
.wrap-notice .notice-date p{display:table-cell; vertical-align:middle; line-height:1.2; font-family:'Noto Light'; font-size:16px;}
.wrap-notice .notice-date span{display: block;}
.wrap-notice .notice-content{float: left; margin-top: 11.5px; margin-left: 20px; width: calc(100% - 100px); line-height:1.2;}
.wrap-notice .notice-content strong{font-size:20px; color:#111; margin-bottom:10px;}
.wrap-notice .notice-content span{font-size:18px; color:#888; font-family:'Noto Light';}
.wrap-notice .notice-content span,
.wrap-notice .notice-content strong{display:block;  white-space: nowrap; text-overflow: ellipsis; overflow: hidden; position: relative;}

@media all and (max-width:1023px){
	.wrap-notice > ul{height:275px; position:relative;}
	.wrap-notice{padding:20px;}
	.wrap-notice ul li{display:inline-block;}
	.wrap-notice ul li li{display:block;}
	.wrap-notice .title{position:inherit;}
	.wrap-notice > ul > li + li{margin-left:15px;}
	.wrap-notice > ul > li .list{position:absolute; margin-left:0; left: 0; top: 50px; width:100%;}
	.wrap-notice .con{margin-bottom:10px;}
	.wrap-notice > ul > li .list .con a{display:block; overflow:hidden; position:relative;}
	.wrap-notice .notice-date{width:70px; height:70px;}
	.wrap-notice .notice-content{margin-top:10px; margin-left:10px;}
	.wrap-notice .notice-content strong{margin-bottom:5px; font-size:18px;}
	.wrap-notice .notice-content span{font-size:16px;}
	.wrap-notice .more{right:0; top:-50px;}
}

@media all and (max-width:767px){
	.wrap-notice{border:none; border-bottom:1px solid #ddd; padding: 0 0 60px 0;}
	.wrap-notice .con {margin-bottom: 20px;}
}
