@charset "utf-8";

#sideBar,
#topSpacer{display:none;}
#ctWrap{width:100%;max-width:100%;margin:0 auto !important;}
#hd{background:#363839}
@media all and (max-width:980px)
{
	#hd,
	#hd #tnb,
	#hd #gnb{background:#363839;}
	#topSpacer{display:block;}
}


.mainVisualImage{width:100% !important;background:#efefef;height:auto;overflow:hidden;position:relative;z-index:1;padding:0px;margin:0px;}
.mainVisualImage .bx-wrapper{margin-bottom:0px;}
.mainVisualImage .bx-wrapper ul{width:100% ;padding:0px;margin:0px;}
.mainVisualImage .bx-wrapper ul > li{width:100% ;background:#efefef;position:relative; text-align:center;}
.mainVisualImage .bx-wrapper ul > li img{width:100%;display:block;height:auto;}

.mainVisualImage .bx-wrapper .bx-pager{position:absolute !important; width:100%; left:0px; bottom:30px;z-index:9; text-align:center;}
.mainVisualImage .bx-wrapper .bx-pager a{-moz-border-radius:10px !important;-webkit-border-radius:10px !important;border-radius:10px !important; width:12px !important; height:12px !important; background:rgba(0,0,0,.4) !important;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;}
.mainVisualImage .bx-wrapper .bx-pager.bx-default-pager a:focus,
.mainVisualImage .bx-wrapper .bx-pager.bx-default-pager a:hover{background:RGBA(255,255,255,0.8) !important;}
.mainVisualImage .bx-wrapper .bx-pager.bx-default-pager a.active{width:40px !important;background:RGBA(4,4,4,.8) !important; -webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;}

.mvTit00 {position:absolute; top:30%; left:40%; right:40%;}
.mvTit00 img {width:auto !important;}
.mvTit01{font-size:60px; color:#fff;display:block;position:absolute; left:10%;right:10%; bottom:50%; margin-top:-10px;text-overflow:ellipsis;white-space:nowrap;-webkit-transition-duration: 0.3s;-webkit-transition-timing-function: ease;transition-duration: 0.3s;transition-timing-function: ease;}
.mvTit02{display:block;position:absolute; left:10%;right:10%; top:55%; margin-bottom:-20px; text-decoration:none;-webkit-transition-duration: 0.4s;-webkit-transition-timing-function: ease;transition-duration: 0.4s;transition-timing-function: ease;}
.mvTit02 .mvTit02txt{font-size:30px; color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mvTit02 .mvLink{width:200px; display:block;font-size:14px; color:#fff; margin:20px auto; text-decoration:none; padding:10px; border-radius:50px;background:#6666ff;border:1px solid rgba(255,255,255,.3);color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;}
.mvTit02 a:hover.mvLink{border:1px solid #3333ff;background:#0066ff; -webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;}

.mvTit01,
.mvTit02 .mvTit02txt{font-family: 'Nanum Myeongjo', serif; letter-spacing:-0.05em; text-shadow: rgba(0,0,0,0.8) 0px 0px 10px;text-shadow: rgba(0,0,0,0.8) 0px 0px 10px 10px;filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=180,strength=5);}



@media all and (max-width:1200px)
{
	.mvTit00 {top:35%;}
	.mvTit00 img {}
	.mvTit01{font-size:45px; bottom:45%;}
	.mvTit02 {top:60%;}
	.mvTit02 .mvTit02txt{font-size:24px;}
}

@media all and (max-width:900px)
{
	.mvTit01{font-size:40px;}
	.mvTit02 .mvTit02txt{font-size:24px;}
}

@media all and (max-width:800px)
{
	.mainVisualImage .bx-wrapper .bx-pager{bottom:10px !important;}
	.mainVisualImage .bx-wrapper .bx-pager a{width:10px;height:10px !important; margin:0 2px;}
	.mainVisualImage .bx-wrapper .bx-pager.bx-default-pager a.active{width:20px !important;}

	.mainVisualImage .bx-wrapper ul > li{width:100%; overflow:hidden;}
	.mainVisualImage .bx-wrapper ul > li img{width:160%; max-width:160% !important; margin-left:-30%;}

	.mvTit00 {top: 37%;}
	.mvTit01{font-size:28px; bottom:45% !important;}
	.mvTit02 {top:60% !important;}
	.mvTit02 .mvTit02txt{font-size:16px;}
	.mvTit02 .mvLink{width:120px;padding:5px;font-size:11px;font-weight:normal;}

}

@media all and (max-width:500px)
{
	.mvTit01{font-size:20px;}
	.mvTit02 .mvTit02txt{font-size:12px;}
}




/* ���� ������ ���̾ƿ� */

.mainContents{width:100%; max-width:1200px; margin:0 auto; overflow:hidden;clear:both; padding:50px 0;}

.mainContentsW100{width:100%;clear:both;overflow:hidden;}


/* 2�ܷ��̾ƿ� */
.mainTwoLatArea{width:100%;margin:0 auto; overflow:hidden;}
.mainTwoLatArea .MTLA01,
.mainTwoLatArea .MTLA02{width:50%;float:left;margin-left:-1px;}

@media all and (max-width:850px)
{
	.mainTwoLatArea{padding:0 15px;}
	.mainTwoLatArea .MTLA01,
	.mainTwoLatArea .MTLA02{width:100%;float:none;}
}

/* 3�ܷ��̾ƿ� */
.mainThreeLatArea{width:100%;margin:0 auto; overflow:hidden;}
.mainThreeLatArea .MTLA01,
.mainThreeLatArea .MTLA02,
.mainThreeLatArea .MTLA03{width:30.3%;float:left;margin-left:-1px; margin:0% 1.5%;}
.mainThreeLatArea .MTLA02{/*margin:0 5%;*/}

@media all and (max-width:850px)
{
	.mainThreeLatArea{padding:0px;}
	.mainThreeLatArea .MTLA01,
	.mainThreeLatArea .MTLA02,
	.mainThreeLatArea .MTLA03{/*width:100%; float:none;*/}
	.mainThreeLatArea .MTLA02{margin:0 0;}
}

@media all and (max-width:600px)
{
	.mainThreeLatArea .MTLA01,
	.mainThreeLatArea .MTLA02,
	.mainThreeLatArea .MTLA03{/*width:100%; float:none;*/}
}


/* 4�� ���̾ƿ� */
.mainFourLatArea{width:100%;margin:0 auto; overflow:hidden;}
.mainFourLatArea .MTLA01,
.mainFourLatArea .MTLA02,
.mainFourLatArea .MTLA03,
.mainFourLatArea .MTLA04{width:25%;float:left;margin-left:-1px;}


@media all and (max-width:980px)
{
	.mainFourLatArea .MTLA01,
	.mainFourLatArea .MTLA02,
	.mainFourLatArea .MTLA03,
	.mainFourLatArea .MTLA04{width:50%;float:left;}
}

@media all and (max-width:650px)
{
	.mainFourLatArea .MTLA01,
	.mainFourLatArea .MTLA02,
	.mainFourLatArea .MTLA03,
	.mainFourLatArea .MTLA04{width:100%;float:none;margin-left:0px;}
}


/* ���������� �� */
.centerBar{width:80px;height:5px;background:#ddd;margin:30px auto;}
.centerBar_txt {width:80px;height:5px;background:#ddd;margin:20px auto;}


.mainBasicCont01{width:100%;padding:100px 20px;text-align:center; background:#fff;}
.mainBasicCont01 h2{color:#000; font-size:30px;font-family:'Century Gothic','Noto Sans Korean','Malgun Gothic';}
.mainBasicCont01 h3{color:#999; font-size:16px;}
.mainBasicCont01 .MBC01txt{font-size:14px;color:#666;line-height:1.5em;}

@media all and (max-width:700px)
{
	.mainBasicCont01{width:100%;padding:50px 20px;}
	.mainBasicCont01 h2{font-size:18px;}
	.mainBasicCont01 h3{font-size:13px; font-weight:normal;}
	.mainBasicCont01 .MBC01txt{text-align:center; font-size:12px;}
}

/* ������ �� */
.background-dark{position:relative; 
    background:#222222;
}
.background-dark .webzLatTit a,
.background-dark .basicLatTit a,
.background-dark .qnaLatTit a{color:#fff;}
.background-dark ul li{}
.background-dark ul li a{color:#ddd;}


/* ��������� �� */
.background-light{background:#faf8fb;}



/* ���� 4�� ������ */
.main_figure_list{width:100%;overflow:hidden;padding:30px 0;}
.main_figure_list li{width:25%; float:left; text-align:center;border-bottom:0px;}
.main_figure_list li i{display:block;margin:10px auto; width:100px; height:100px; line-height:100px; border-radius:50%;background:#fff; font-size:3em;-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;}
.main_figure_list li:hover i{background:#000;  color:#fff;transform: rotate(360deg);-webkit-transition-duration: 0.2s;-webkit-transition-timing-function: ease;transition-duration: 0.2s;transition-timing-function: ease;}
.main_figure_list li strong{display:block; font-size:20px; color:#fff; margin:5px;}
.main_figure_list li span{display:block; font-size:13px; color:#999; margin:5px;}



@media all and (max-width:650px)
{
	.main_figure_list li{width:50%; float:left; text-align:center;}
	.main_figure_list li i{display:block;margin:10px auto; width:100px; height:100px; line-height:100px; border-radius:50%;background:#ddd; font-size:3em;}
	.main_figure_list li strong{font-size:16px;}
	.main_figure_list li span{font-size:11px;}
	
}



.maincontents {width:100%; position:relative; z-index:2;}

#contents {width:100%; display:inline-block;}

#contents ul.main_service { display:inline-block; width:100%; height:600px; margin-top:-100px;}
#contents ul.main_service li {width:1200px; margin:0 auto;}

#contents ul.main_service li.service_menu { padding:30px 0; display:block; overflow:hidden;}
#contents ul.main_service li.service_menu a.btn {position:relative; width:30.3%; float:left; text-align:center; margin:0% 1.5%; overflow:hidden;}
#contents ul.main_service li.service_menu a.btn span {display:inline-block; width:100%; text-shadow: rgba(0,0,0,0.8) 0px 0px 10px;text-shadow: rgba(0,0,0,0.8) 0px 0px 10px 10px;filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=180,strength=5);}
#contents ul.main_service li.service_menu a.btn span.img_over {display:none;position:absolute; top:0; left:0;}
#contents ul.main_service li.service_menu a:hover.btn span.img_over {display:block;}
#contents ul.main_service li.service_menu a.btn span.s_title {position:absolute; top:30%; left:0; font-size:40px; font-weight:bold; color:#fff; float:left; text-transform:uppercase; line-height:120%;}
#contents ul.main_service li.service_menu a.btn span.s_info {position:absolute; bottom:30%; left:0; font-size:20px; font-weight:normal; margin-top:20px; color:#fff; line-height:140%;}
#contents ul.main_service li.service_menu a.btn span.arrow {position: absolute; bottom:5%; left: 0;}



@media all and (max-width:1200px)
{

	#contents ul.main_service { display:inline-block; width:100%; height:auto; margin-top:0;}
	#contents ul.main_service li {width:100%; margin:0 auto;}
	#contents ul.main_service li.title {text-align:center; margin:50px auto 30px auto;}
	#contents ul.main_service li.title span.text1 {font-size:22px; display:inline-block; width:100%; margin-top:0;}
	#contents ul.main_service li.title span.text2 {font-size:14px; }

	#contents ul.main_service li.service_menu {padding:70px 0;}
	#contents ul.main_service li.service_menu a.btn {}
	#contents ul.main_service li.service_menu a.btn span { display:inline-block; width:100%;}
	#contents ul.main_service li.service_menu a.btn span.img {margin-top:-20%;}
	#contents ul.main_service li.service_menu a.btn span.img_over {}
	#contents ul.main_service li.service_menu a.btn span.s_title {font-size:24px;}
	#contents ul.main_service li.service_menu a.btn span.s_info {font-size:13px; font-weight:normal;}
	#contents ul.main_service li.service_menu a.btn span.arrow {bottom:10%;}

}



@media all and (max-width:700px)
{
	#contents ul.main_service li.service_menu {padding:70px 0px 120px;}
	#contents ul.main_service li.service_menu a.service01 {background:url('../img/service_img1.jpg'); background-size:100%;}
	#contents ul.main_service li.service_menu a.service02 {background:url('../img/service_img2.jpg'); background-size:100%;}
	#contents ul.main_service li.service_menu a.service03 {background:url('../img/service_img3.jpg'); background-size:100%;}
	#contents ul.main_service li.service_menu a.btn {height:145px; overflow:visible;}
	#contents ul.main_service li.service_menu a.btn span.img {display:none;}
	#contents ul.main_service li.service_menu a.btn span.img_over {overflow:hidden; height:150px;}
	#contents ul.main_service li.service_menu a.btn span.s_title {top:20%; font-size:18px;}
	#contents ul.main_service li.service_menu a.btn span.s_info {font-size:11px; position:relative; bottom:-100%; color:#646464; text-shadow:0px 0px 0px;}
}



#contents .mainProduct {padding:80px 0px;}
#contents .mainProduct .MTLA01, #contents .mainProduct .MTLA02, #contents .mainProduct .MTLA03 {text-align:center; text-transform: uppercase;}
#contents .mainProduct h2.PDTit {font-size:35px; color:#26ab39; display: inline-block; position: relative; margin: 0 auto; padding:0px; text-align: center; font-family: 'Nanum Myeongjo', serif;}
#contents .mainProduct span.PD_sTit {display:block; padding:10px; color:#a5a5a5; font-size:13px;}
#contents .mainProduct p.PDText {font-size:16px; padding:10px 0px;}
#contents .mainProduct a.More {clear: both; width:163px; font-size: 16px; font-weight: bold; display:inline-block; padding: 10px 30px; color:#26ab39; border-radius:15px; text-align:center; margin: 20px auto 0; border:1px solid #26ab39; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease;}
#contents .mainProduct a:hover.More {background:#26ab39; color:#fff;}



@media all and (max-width:1200px)
{
	#contents .mainProduct {height:auto;}
	#contents .mainProduct p.PDText {font-size:14px; word-break: keep-all;    min-height: 105px;}
}



@media all and (max-width:700px)
{
	#contents .mainProduct h2.PDTit {font-size:20px;}
	#contents .mainProduct span.PD_sTit {height: 58px; padding:10px 3px;}
	#contents .mainProduct p.PDText {font-size:11px;}
	#contents .mainProduct a.More {width:100%;}
}


#contents .mainHistory {text-align:center; color:#26ab39;}
#contents .mainHistory em.His_small {font-family: 'Nanum Myeongjo', serif; font-style:normal; font-weight:bold; font-size:20px; letter-spacing:-0.03em; padding:25px 0px; display:block;}
#contents .mainHistory h2.His_Tit {font-size:50px; line-height:120%; letter-spacing:-0.03em;}
#contents .mainHistory h2.His_Tit span {display:block; text-transform: uppercase;}
#contents .mainHistory h2.His_Tit em {font-size:30px; font-weight:normal; font-style:normal; display:inline-block; margin-top:-12px; vertical-align:middle;}
#contents .mainHistory h3.His_sTit {font-size:20px; text-transform: uppercase; letter-spacing:0.8em; font-weight:normal; margin:20px 0px;}
#contents .mainHistory p.His_Text {font-size:16px; color:#686868; letter-spacing:-0.03em;}
#contents .mainHistory a.More {clear: both; width: 162px; font-size: 16px; font-weight:normal; display: inline-block; padding:8px 0px; color: #26ab39; border-radius: 15px; text-align: center; margin:80px 0px 25px; border: 1px solid #26ab39; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; text-transform: uppercase;}
#contents .mainHistory a:hover.More {background:#26ab39; color:#fff;}

.mainHistory_img {margin-bottom:75px;}
.mainHistoryM_img {display:none;}



@media all and (max-width:1200px)
{

}



@media all and (max-width:700px)
{
	#contents .mainHistory em.His_small {font-size:17px;}
	#contents .mainHistory h2.His_Tit {font-size:31px;}
	#contents .mainHistory h2.His_Tit em {font-size:20px;}
	#contents .mainHistory h3.His_sTit {font-size:16px;}
	#contents .mainHistory p.His_Text {font-size:13px;}
	#contents .mainHistory a.More {margin:0px;}

	.mainHistory_img {display:none;}
	.mainHistoryM_img {display:block; margin:50px 0px;}
	.mainHistoryM_img img {width:100%;}
}



#contents ul.main_Banner { display:inline-block; width:100%;}
#contents ul.main_Banner li {width:1200px; margin:0 auto;}
#contents ul.main_Banner li.Banner { padding:60px 0; display:block; overflow:hidden;}
#contents ul.main_Banner li.Banner a.btn {position:relative; width:23%; margin:0% 1%; float:left; text-align:center;}
#contents ul.main_Banner li.Banner a.btn span {display:inline-block; width:100%; text-shadow: rgba(0,0,0,0.8) 0px 0px 10px;text-shadow: rgba(0,0,0,0.8) 0px 0px 10px 10px;filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=180,strength=5);}
#contents ul.main_Banner li.Banner a.btn span.s_title {position:absolute; top:25%; left:0; font-size:18px; color:#fff; float:left; text-transform:uppercase; line-height:120%;}
#contents ul.main_Banner li.Banner a.btn span.s_title span.img {}
#contents ul.main_Banner li.Banner a.btn span.s_title span.text {}



@media all and (max-width:1200px)
{
	#contents ul.main_Banner li {width:100%;}
}



@media all and (max-width:900px)
{
	#contents ul.main_Banner li {width:100%;}
	#contents ul.main_Banner li.Banner {padding:6%;}
	#contents ul.main_Banner li.Banner a.btn {width:46%; margin:2%;}
	#contents ul.main_Banner li.Banner a.btn span.img img {width:100%;}
	#contents ul.main_Banner li.Banner a.btn span.s_title span.img {width:25%;}
}