@charset "euc-kr";

/* ***************************** Àüü ·¹À̾ƿô ±¸¼º ½ÃÀÛ ***************************** */
.wrap{width: 100%;}
#main legend{border-bottom: 0;}
#header{width: 100%;}
#contents{width: 100%;}


/* ***************************** °³º° ¿µ¿ª ±¸¼º ½ÃÀÛ ***************************** */

/* ************ Section1 Area Start ************* */
#section1{
	width: 100%;
	padding: 50px 0;
	margin-bottom: 70px;
	background-size: cover;
}
#section1 .section-contents {
	width: 100%;
	height: 520px;
	position: relative;
}

.cate_prev {
	position: absolute;
	top: 0px;
	left: 0px;
	cursor: pointer;
}

.cate_next {
	position: absolute;
	top: 0px;
	right: 0px;
	cursor: pointer;
}


#section1 h2{
	width: 100%; color: #fff;
	font: 40px 'NanumSquareB', sans-serif;
	text-align: center;
	text-shadow: 0px 0px 5px #000;
}
#section1 h2 span{font-size: 17px; color: #fff; display: block; margin-top: 5px; letter-spacing: 0.2px}

#section1 .cate_box {
	width: 1170px;
	height: 400px;
	padding: 10px;
	margin-top: 50px;
	background: #fff;
	float: left;
	overflow: hidden;
}

#section1 .cate_box>div {
	float: left;
	overflow: hidden;
	width: 620px;
	height: 380px;
	position: relative;
}

#section1 h3 {
	font: 32px 'NanumSquareB', sans-serif;
	line-height: 45px;
	text-align: center;
	color: #000;
	margin: 10px 0;
}

#section1 .cate_box .cate_ul {
	width: 1860px;
	height: 315px;
	position: absolute;
	bottom: 0;
	left: -620px;
}

.cate_box ul {
	width: 620px;
	float: left;
}

#section1 a {
	display: inline-block;
	width: 100%;
	line-height: 35px;
	font-size: 17px;
	text-decoration: none;
	color: #777;
}

#section1 a:hover {color: #36f;}

.cate_box img {
	height: 380px;
	float: left;
	margin-right: 15px;
}


/* ************ Section2 / Section3 / Section4 Area Start ************* */
.section2, .section3, .section4{width: 100%; margin-bottom: 70px;}

.section-contents {font-size: 0;}
.section2 h2, .section3 h2, .section4 h2{
	width: 100%; margin-bottom: 20px; text-align: center;
	font: 30px 'NanumSquareB', sans-serif;
}

.section2 a, .section3 a {
	display: inline-block;
	width: 23.8%;
	margin: 0 1.6% 20px 0;
	line-height: 0;
}

.section4 a {
	display: inline-block;
	width: 226px;
	margin: 0 10px 20px 0;
	line-height: 0;
}

/* ¸ñ·Ï¸®½ºÆ® ·¹À̾ƿô ±¸¼º */
.section2 .col-xs-3, .section3 .col-xs-3, .section4 .col-xs-2{
	width: 100%;
	border: 1px solid #ddd;
	padding: 20px;
}

.col-xs-3:hover {
	border: 1px solid #999;
	box-shadow: 4px 4px 5px #777;
}
.col-xs-2:hover {border: 1px solid #999;}

.section2 a:nth-child(4n), .section3 a:nth-child(4n), .section4 a:nth-child(5n){margin-right: 0;}
.section4 .col-xs-2:nth-child(5n+1), .section4 .col-xs-2:nth-child(5n+1){margin-left: 0;}

/* ¸ñ·Ï¸®½ºÆ® ³»¿ë ±¸¼º */
.section2 .col-xs-3 .company-logo, .section3 .col-xs-3 .company-logo, .section4 .col-xs-2 .company-logo{
	width: 100%; height: 87px; margin-bottom: 20px; text-align: center;
}

.company-logo img {width: 100%;}

.section4 .col-xs-2 .company-logo{height: 60px;}

.section2 .col-xs-3 h3, .section3 .col-xs-3 h3, .section4 .col-xs-2 h3{
	font: bold 16px 'Nanum Gothic', sans-serif; margin-bottom: 15px; color: #555;
}
.section2 .col-xs-3 p, .section3 .col-xs-3 p, .section4 .col-xs-2 p{
	font: 14px '¸¼Àº °íµñ', sans-serif;
}


/* ***************************** ¹Ìµð¾îÄõ¸® ½ÃÀÛ ***************************** */

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

	.wrap, .wrap .container{width: 1170px !important;}

}