@charset "UTF-8";

/* visual */
.news-visual{background-image:url('../images/newsroom/news-main.jpg');}

.news-content {padding-bottom: 150px;}

/**
 * board wrap content
==========================================================================================**/
.board {width: 100%;}
	/* list */
	.board .list {border-top: 2px solid #121212;}
	.board .list li {padding: 40px 0; border-bottom: 1px solid #ddd;}
	.board .list li .desc {display: flex; font-size: 16px; font-weight: 700; font-family: 'Montserrat'; color: #121212;}
	.board .list li .desc .category {margin-left: 16px;}
	.board .list li .desc .category::before {display: inline-block; content:'';width: 1px; height: 16px; border-left: 1px solid #aeaeae; margin-right: 16px;}
	.board .list li h3 {font-size: 24px; font-weight: 600; color: #121212;}
	.board .list li a {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;}	
	.board .list li .thumb {width: 340px; height: 200px; border-radius: 5px; overflow: hidden;}
	.board .list li .thumb img {width: 100%; height: 100%; object-fit: cover; border-radius: 5px; transition: all .5s ease;}
	.board .list li a:hover .desc,
	.board .list li a:hover h3 {color: #0154c4;}
	.board .list li a:hover .thumb img {transform: scale(1.1);} 
	/* detail */
	.board .detail h3 {font-size: 48px;}
	.board .detail .desc {display: flex; font-size: 16px; font-weight: 700; font-family: 'Montserrat'; color: #121212; margin-top: 16px;}
	.board .detail .desc .category {margin-left: 16px;}
	.board .detail .desc .category::before {display: inline-block; content:'';width: 1px; height: 16px; border-left: 1px solid #aeaeae; margin-right: 16px;}
	.board .detailView {display: flex; margin-top: 80px; padding-bottom: 80px; border-bottom: 1px solid #121212;}
	.board .detailView .summary {width: 25%;}
	.board .detailView .summary h4 {font-size: 24px; font-weight: 600;}
	.board .detailView .summary p {font-size: 24px; font-weight: 600;}	
	.board .detailView .content {width: 70%;}
	.board .detailView .content .img {width: 100%; height: 400px; border-radius: 5px;}
	.board .detailView .content .img img {width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
	.board .detailView .content p {font-size: 16px; margin-top: 24px;}
	/* pagination wrap */
	.pagination {display: flex; align-items: center; align-content: center; justify-content: space-between; width: 100%; margin-top: 40px;}
	.pagination::before,
	.pagination::after {display: block; content: ''; flex: 1;}
	.pagination .indicator {display: flex; font-weight: 600; font-size: 18px;}
	.pagination .indicator .prev,
	.pagination .indicator .next {font-family: 'Montserrat'; color: #d9d9d9; cursor: default;}
	.pagination .indicator .prev.on,
	.pagination .indicator .next.on {color: #000; cursor: pointer;}
	.pagination .indicator .pageControl {}
	.pagination .indicator .pageControl::before,
	.pagination .indicator .pageControl::after {display: inline-block; content: ''; width: 1px; height: 14px; margin: 0 24px; border-left: 1px solid #aeaeae;}
	.pagination .indicator li {display: inline-block;}
	.pagination .indicator li a {display: block; font-family: 'Montserrat'; color: #d9d9d9; padding: 0 8px;}
	.pagination .indicator li a.on,
	.pagination .indicator li a:hover {color: #000;}
	.pagination .indicator .linkButton {display: inline-block; font-family: 'Montserrat'; color: #fff; padding: 12px 40px 8px; border-radius: 30px; background-color: #121212;}

	@media screen and (max-width: 1280px) { /* PC + Tablet 환경 */
		.news-content {padding-bottom: 80px;}
	}
	
	@media screen and (max-width: 450px) { /* Mobile 환경 */
		.board .list li h3 {font-size: 20px;}
	}