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

/****************************
   MAIN IMAGE
*****************************/
.mainContent-headerContainer{
	height:500px;
	overflow:hidden;
    position:relative;
    background-image: url('/assets/image/news/main_image.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.header-title{
    width:1100px;
    margin: 50px auto;
    padding-left: 10px;
    color:#FFFFFF;
    letter-spacing: 5px;
}
@media screen and (max-width: 1100px) {
    .header-title{
        padding-left: 25px;
    }
}
@media screen and (max-width: 978px) {
    .mainContent-headerContainer{
        height:475px;
    }
    .header-title{
        font-size: 4.3rem;
    }
}
@media screen and (max-width: 479px) {
    .mainContent-headerContainer{
        height:300px;
    }
    .header-title{
        font-size: 2.5rem;
    }
}


/****************************
   NEWS
*****************************/
.mainContent-newsContainer{
    display: block;
    clear: both;
    overflow: hidden;
    background-color:#ECEBE1;
    text-align:center;
    padding-bottom: 30px;
}
.news{
    max-width: 1100px;
    width:100%;
    margin: auto;
}
.news-title{
    margin:70px 0 50px 0;
    font-weight: 500;
    text-align:center;
}
.news-list{
    list-style: none;
    padding: 0;
}
.news-list > li{
    font-weight: 400;
    width:100%;
    display: table;
    padding:5px;
	background:#ffffff;
}
.news-list > li:nth-child(even){
	background-color:#F3F3F3;
}
.news-list > li > span{
    display: table-cell;
    padding:15px;
}
.news-list > li > span.date{
    width:150px;
}
.news-list > li > span.icon{
    width:200px;
    font-size:1.2rem;
}
.news-list > li > span.icon > span{
    background-color: #D50606;
    display: block;
    color:#ffffff;
    width: 100%;
    padding: 10px 10px;
}
.news-list > li > span.icon > span.news{
    background-color: #00B224;
}
.news-list > li > span.icon > span.info{
    background-color: #0C885E;
}
.news-list > li > span.icon > span.others{
    background-color: #a8a8a8;
}
.news-list > li > span.icon > span.publish{
	background-color: #ff8f34;
}
.news-list > li > span.icon > span.allCustomers{
	background-color: #3f5492;
}
.news-list > li > span.icon > span.businessCustomers{
	background-color: #008DB2;
}
.news-list > li > span.icon > span.individualCustomers{
	background-color: #20b2d6;
}
.news-list > li > span.icon > span.events{
	background-color: #e1748e;
}
.news-list > li > span.icon > span.campaign{
	background-color: #ddd452;
}
.news-list > li > span.title{
    text-align: left
}
.news-list > li > span.btn{
    text-align: right;
}
.news-list > li > span.btn > button{
    height:25px;
    width:185px;
    border-radius:10px;
    font-size: 1.2rem;
    background-color: #ffffff;
}


@media screen and (max-width: 767px) {

	.news-title{
    	margin:25px 0;
	}
	.news-list{
		margin-top:15px;		
	}
	.news-list > li{
		padding:10px;	
	}
	.news-list > li > span{
		display:block;
	    padding:5px 15px;
	}
	.news-list > li > span.date{
		width:125px;
		float:left;
	}
	.news-list > li > span.icon{
		width:125px;
		float:right;
	}
	.news-list > li > span.title{
		clear:both;
		width:100%;
	}
	

}