@charset "utf-8";

/* 비주얼영역 */
/* #visualArea {width:100%; height:350px; overflow:hidden; background:url('../images/main/visual_img01.jpg') no-repeat; background-size:cover;} */
#visualArea {width:100%; height:350px; background:url('../images/main/visual_img02.jpg') bottom no-repeat; background-size:cover;}
/* #visualArea > p {width:1200px; margin:60px auto; text-align:center;} */

/* 콘텐츠영역 */
#mainCnt {width:100%; overflow:hidden; margin-top:32.5vw;}
#mainCnt > div {width:100%;overflow:hidden;}
#mainCnt > .mcTop {background:#fff;}
#mainCnt > .mcTop > ul {width:1200px; margin:0 auto;padding:60px 0 40px;overflow:hidden;}
#mainCnt > .mcTop > ul > li {float:left;width:31.5%;text-align:center;}
#mainCnt > .mcTop > ul > li:nth-child(2) {margin:0 2.5%}
#mainCnt > .mcTop > ul > li > p {
	display: -webkit-box;
	padding-top:5px;
	line-height:22px;
	height:110px;
	text-align:left;
	word-wrap:break-word; 
    -webkit-line-clamp:5; 
    -webkit-box-orient:vertical; 
    overflow:hidden; 
    text-overflow:ellipsis;
}
#mainCnt > .mcTop > ul > li > p.tit {font-family: 'Oswald', sans-serif; height:auto;padding-top:10px;color:#00307c;font-size:18px;font-weight:500}
#mainCnt > .mcTop > ul > li > .btn {
	display:inline-block;
	margin-top:10px;
	padding:8px 20px 5px 0px;
	color:#00307c;
	border-bottom:2px solid #00307c !important;
	background:url('../images/main/btnRead.png') no-repeat top 14px right;
}

/* 콘텐츠-하단 */
#mainCnt > .mcBottom {background:#f6f6f6;}
#mainCnt > .mcBottom > ul {width:1200px; margin:0 auto;padding:40px 0;overflow:hidden;}
#mainCnt > .mcBottom > ul > li {position:relative;float:left;width:31.5%;background:#fff;}
#mainCnt > .mcBottom > ul > li:nth-child(2) {margin:0 2.5%}
#mainCnt > .mcBottom > ul > li > h2 {
	padding:6px 20px;
	color:#fff;
	font-family: 'Oswald', sans-serif;
	font-size:17px;
	background:#717171;
}
#mainCnt > .mcBottom > ul > li > div {padding:25px 20px;border:1px solid #dddddd;min-height:395px}
#mainCnt > .mcBottom > ul > li > div .tit {
	display:block;
	color:#333;
	font-weight:bold;
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
#mainCnt > .mcBottom > ul > li > div ul li p,
#mainCnt > .mcBottom > ul > li > div > div p {
	display: -webkit-box;
	line-height:22px;
	height:44px;
	margin-bottom:10px;
	word-wrap:break-word; 
    -webkit-line-clamp:2; 
    -webkit-box-orient:vertical; 
    overflow:hidden; 
    text-overflow:ellipsis;
}
#mainCnt > .mcBottom > ul > li > div > div p {margin:0;padding:0 20px;}
#mainCnt > .mcBottom > ul > li > div > div {
	position: relative;
	padding-bottom:20px;
	margin-top:15px;
	background:#f0f0f0;
}
#mainCnt > .mcBottom > ul > li > div > div h2 {
	padding:6px 20px;
	color:#fff;
	font-size:17px;
	font-family: 'Oswald', sans-serif;
	background:#717171;
} 
#mainCnt > .mcBottom > ul > li > div > div .tit {padding:0 20px;margin-top:15px;color:#555;}
#mainCnt > .mcBottom .btnMore {
	position:absolute;
	display:inline-block;
	width:18px;
	height:18px;
	text-indent:-9999px;
	background:url('../images/common/btnMore.png') no-repeat;
}
#mainCnt > .mcBottom > ul > li > .btnMore {top:9px;right:20px;}
#mainCnt > .mcBottom > ul > li > div > div .btnMore {top:9px;right:20px;background:url('../images/common/btnMore.png') no-repeat;}
#mainCnt > .mcBottom .magazineList > li {padding-bottom: 20px;}
#mainCnt > .mcBottom .magazineList > li:last-child {padding-bottom:0;}
#mainCnt > .mcBottom .magazineList > li:after {display:block;content: '';clear:both;}
#mainCnt > .mcBottom .magazineList > li > a:first-child {
	display: block;
    float: left;
    width: 110px;
    height:140px;
    margin-right: 20px;
    border: 1px solid #dddddd;
    overflow: hidden;
}
#mainCnt > .mcBottom .magazineList > li > a:first-child img {width:100%;height:100%;}
#mainCnt > .mcBottom .magazineList > li > .tit {
	display: -webkit-box;
	line-height:22px;
	height:44px;
	padding-top:5px;
	margin-bottom:30px;
	word-wrap:break-word; 
    -webkit-line-clamp:2; 
	-webkit-box-orient:vertical; 
	white-space: normal;
}
#mainCnt > .mcBottom .magazineList p {
	display:block;
	height:auto;
	margin-bottom:5px;
	text-overflow: ellipsis; 
	white-space: nowrap; 
	overflow: hidden;
}
#mainCnt > .mcBottom .magazineList p:last-child {margin-bottom:0;}
#mainCnt > .mcBottom .magazineList .date {
	padding-top:10px;
	color:#0083cb;
	border-top:1px solid #dddddd;
}
@media screen and (max-width:1250px) {
	#mainCnt {margin-top:37.5vw;}
	#mainCnt > .mcTop > ul, #mainCnt > .mcBottom > ul {width:auto;padding:30px 15px;}
	#mainCnt > .mcTop > ul > li .imgBox > img {width:100%;}
	#mainCnt > .mcTop > ul > li > p {padding-bottom:10px;}
	#mainCnt > .mcTop > ul > li > p.tit {padding-bottom:0;}
	#mainCnt > .mcBottom > ul > li > div {min-height:416px;}
}
@media screen and (max-width:1023px) {
	#mainCnt > .mcBottom > ul > li {width:100%;margin-top:20px;}
	#mainCnt > .mcBottom > ul > li:nth-child(2) {margin:0; margin-top:20px;}
	#mainCnt > .mcBottom > ul > li:first-child {margin-top:0;}
	#mainCnt > .mcBottom > ul > li > div {min-height:auto;}
	#mainCnt > .mcBottom .magazineList > li > .tit {margin-bottom:10px;}
	#mainCnt > .mcBottom .magazineList .date {margin-bottom:0;}
}
@media screen and (max-width:799px) {
	#mainCnt > .mcBottom > ul > li > div {min-height:auto;}
}
@media screen and (max-width:768px) {
	#mainCnt {margin-top:37.5vw;}
	#mainCnt > .mcTop > ul > li {width:100%;margin-top:30px;padding-top:20px;border-top:1px solid #e3e3e3;}
	#mainCnt > .mcTop > ul > li:nth-child(2) {margin:0; margin-top:20px;}
	#mainCnt > .mcTop > ul > li:first-child {margin-top:0;padding-top:0;border-top:none;}
	#mainCnt > .mcTop > ul > li .imgBox {max-height:300px;}
	#mainCnt > .mcTop > ul > li .imgBox > img {width:auto;}
	#mainCnt > .mcTop > ul > li > p {text-align: center;}
}
@media screen and (max-width:425px) {
	#mainCnt > .mcTop > ul > li .imgBox > img {width:100%;}
}