@charset "utf-8";



  
 #POPUPBOX{
	position:absolute;
	left:50px;
	top:110px;
	z-index:101;
	max-width:100%;
 }
 #divpop111{
	background:#fff;
	position:relative;
	display:inline-block;
	left:0;
	top:0px;
	z-index:101;
	visibility:hidden;
	border:0px solid #fff;
	max-width:100%;
	 
 }
  #divpop222{
	display:inline-block;
	margin-top:10px;
	background:#fff;
	position:relative;
	left:0;
	top:0px;
	z-index:100;
	visibility:hidden;
	border:0px solid #fff;
	max-width:100%;
	 
 }
 #divpop111 .popbox,
 #divpop111 .popbox{
	background:#fff;
	text-align:center;
	padding-bottom:0px;
	position:relative;
 }
 #divpop111 .popbox img,
 #divpop222 .popbox img{display:block;max-width:100%;}

.popuparea .pop-close{text-align:right;padding:5px;background:#333}
.popuparea .pop-close a{color:#f7f7f7;}
 
  
@media(max-width:900px){

	#POPUPBOX{
		position:absolute;
		left:0;
	 }
}


/* 메인 :: 비주얼 */

.mainVisual{width: 100%; height:840px; position: relative; overflow: hidden;}

/* -------------메인--------------- */

.slide_wrap{width: 300%; height:100%; position: absolute; top: 0; left: 0;}
.img_wrap{width: 100%; height:840px; position: relative;}
.banner1{background-image: url(../image/main1.jpg); background-size: cover; background-position: center; background-repeat: no-repeat;}
.banner2{background-image: url(../image/main2.jpg); background-size: cover; background-position: center; background-repeat: no-repeat;}
.banner3{background-image: url(../image/main3.jpg); background-size: cover; background-position: center; background-repeat: no-repeat;}
.mainVisual .title{width: 100%; color: white; height: auto; position: absolute; text-align: center; top: 45%; transform: translateY(-50%); padding:0 24px;box-sizing:border-box;}
.mainVisual .title>h1{letter-spacing: 2px; font-size:47px; font-weight:400; margin-bottom: 15px; text-align: center;}
.mainVisual .title>h4{font-size:47px; font-weight: 400;letter-spacing: 2px;}
.mainVisual .title>h4 span {font-size:50px; font-weight:700;}

.owl-nav>button{outline:none; width:4vw; position: absolute; top: 44%; margin-top: -50px; z-index: 5; opacity: 0.6;}
.owl-prev{left:70px;}
.owl-next{right:70px;}
.owl-theme .owl-nav button:hover{background:none !important; opacity:1;}
.scroll{width: 72px; height: auto; position: absolute; z-index: 5; bottom: 45px; left: 50%;
    margin-left: -36px; animation: scroll 0.5s infinite alternate; text-align:center;}
.scroll span{display:block; color:#fff; font-weight:300; font-size:10px; opacity:0.75;filter:Alpha(opacity=75); margin-bottom:15px;}

@keyframes scroll{
    from{
        bottom: 50px;
    }to{
        bottom: 35px;
    }
}


#mainVisual .scroll-icon{position:absolute; bottom:32px; left:50%; width:72px; margin-left:-36px; text-align:center;}
#mainVisual .scroll-icon span{display:block; color:#fff; font-weight:300; font-size:10px; opacity:0.75;filter:Alpha(opacity=75); margin-bottom:15px;}


@media all and (max-width:1220px){
	
	.owl-nav>button{ width:7vw; top: 44%; margin-top: -50px; }
	.owl-prev{left:20px;}
	.owl-next{right:20px;}
	.owl-nav>button img { max-width:100%;}
	
}

@media all and (max-width:1024px){
	
	.mainVisual{ height: 70vh}
   
    .mainVisual .title{top:35%;}
    .mainVisual .title>h1{font-size:40px;}
    .mainVisual .title>h4{font-size:40px;}
	.mainVisual .title>h4 span {font-size:43px;}
    
}

@media all and (max-width:1000px){
	
	
	.mainVisual .title{top:25%;}
	
}

@media all and (max-width:768px){
	
	.banner1{background-size:350%;background-position:top; }
	.banner2{background-size:350%;background-position:top;}
	.banner3{background-size:350%;background-position:top;}
	
    .mainVisual .title>h1{font-size:28px;}
    .mainVisual .title>h4{font-size:28px;}
	.mainVisual .title>h4 span {font-size:31px;}
	.owl-nav{display: none;}
	
}

@media all and (max-width:640px){
	
	#mainVisual .scroll-icon {bottom:10px;}
	
}

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


/* 메인 컨텐츠 공통 */
#mainContent{padding:0px 0 0 0; background:#fff; }
.content-tit{color:#1c1a1a; padding-bottom:36px; letter-spacing:-0.5px; font-size:28px; font-weight:200; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.content-tit strong{font-weight:400;}


/* 함께하는 기관 */
#mainTogetherCon {/*max-width:1750px;*/ margin:0 auto; background:url(../image/m_together_bg.jpg) no-repeat;background-attachment:fixed; background-size:cover;}

#TogetherList {max-width:1200px; margin:0 auto; height:100%; overflow:hidden; padding:100px 0;}
#TogetherList .together_txt {float:left; width:48%; background:url(../image/m_together_sai.png) repeat-y right; padding:2% 0 8% 0}
#TogetherList .together_txt h1 {color:#fff; font-size:43px; font-weight:600; margin:0 0 30px 0; letter-spacing:-1px;}
#TogetherList .together_txt h4{ color:#f6f6f6; font-size:20px; font-weight:300; padding:0 35% 0 0}

#TogetherList .together_icon {float:right; width:50%; padding:2% 0 0 0}
#TogetherList .together_icon li {float:left; width:33%; text-align:center;}
#TogetherList .together_icon li span {display:block; color:#fff; font-size:20px; font-weight:500; padding:0 5%; margin:30px 0 0 0; letter-spacing:-0.5px;}

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

@media all and (max-width:1024px){
	#mainTogetherCon { background-position:center top; background-size:cover;}
	
	#TogetherList .together_txt{float:none; width:100%; background:none; text-align:center;}
	#TogetherList .together_txt h4 {padding:0 10%}
	#TogetherList .together_icon {float:none; width:100%; }
    #TogetherList .together_icon li span {font-size:18px;padding:0 10%;}
}

@media all and (max-width:768px){
	#TogetherList{ padding:50px 0;}
	
	#TogetherList .together_txt h1{font-size:32px;margin:0 0 30px 0;}
	#TogetherList .together_txt h4{font-size:16px;}
	
}

@media all and (max-width:640px){
	#TogetherList .together_icon {width:90%; margin:0 auto;padding:5% 0 0 0;background:url(../image/m_together_sai.png) repeat-x top;}
	#TogetherList .together_icon li {float:none; width:100%; text-align:center;margin:0px 0 0px 0;background:url(../image/m_together_sai.png) repeat-x bottom; padding:10% 0 10% 0}
	#TogetherList .together_icon li img {width:120px;}
	#TogetherList .together_icon li span{font-size:16px;padding:0 25%;margin:10px 0 0px 0;}
}

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


/* 메인 :: 사업 소개 */
#mainBusinessCon {/*max-width:1750px;*/ margin:0 auto; background:#f4f4f2 url(../image/m_business_bg.gif) repeat; padding:80px 0;}
#mainBusinessCon .content-tit{ font-size:39px;  font-weight:600; color:#313131;text-align:center; background:url(../image/m_con_txt_bg.gif) no-repeat 50% bottom; padding-bottom:90px;}
#mainBusinessCon .content-tit span {display:block; font-size:18px; font-weight:300; color:#454545; margin:15px;} 

#businessList  { max-width:1200px; margin:0 auto; height:100%; overflow:hidden; text-align:center;} 
#businessList .businessbox  { display:inline-block; width:30%; margin:0 1.5%;  padding-bottom:20px;}
#businessList .businessbox ul {background:#fff;box-shadow: 1px 3px 10px 0px #d7d7d7; margin:-61px 0 0 0; text-align:center; padding:22% 10% 12% 10%  }
#businessList .businessbox ul h2 { color:#3c3c3c; font-size:20px; font-weight:500; padding:0px 0 0 10px 0;}
#businessList .businessbox ul li { margin:20px 0  0 0;font-size:15px; color:#888888; line-height:130%;}
#businessList .businessbox ul li.mmore a{display:inline-block; padding:8px 20px; color:#414141; border:1px solid #6c6c6c; font-size:12px;}
#businessList .businessbox ul li.mmore a:hover {background:#1c4b94; color:#fff; border:1px solid #12366f;}

#businessList .businessicon { text-align:center;}


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

@media all and (max-width:1024px){
	
	#businessList  { width:96%;} 
	#businessList .businessbox  { float:right; display:block; width:85%; margin:0 3%;  padding-bottom:20px;}
	#businessList .businessbox ul { margin:0px 0 0 0; text-align:left; padding:5% 10% 5% 15%;  }
	#businessList .businessbox ul h2 { font-size:20px;  padding:0px 0 0 5px 0;}
	#businessList .businessbox ul li { margin:10px 0  0 0;font-size:15px;}
	
	#businessList .businessicon { float:left;  margin:3% 0 0 -61px;}

}

@media all and (max-width:768px){
	#mainBusinessCon {padding:50px 0;}
	
	#businessList .businessbox  { float:none;  width:85%; margin:0  auto;  padding-bottom:40px;}
	#businessList .businessbox ul { margin:-51px 0 0 0; text-align:center; padding:22% 10% 12% 10%  }
	#businessList .businessbox ul h2 { font-size:18px;  padding:0px 0 0 5px 0;}
	#businessList .businessbox ul li { margin:20px 0  0 0;font-size:14px;}
	
	#businessList .businessicon { float:none;  margin:0% 0 0 0px;}
	#businessList .businessicon img {width:100px;}
	
	#businessList .businessbox ul li.mmore a{padding:5px 15px; font-size:11px;}
	
}

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

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



/* 메인 :: 고객지원 */
#mainSupportCon {/*max-width:1750px;*/ margin:0px auto 0 auto;  z-index:2; border-bottom:1px solid #d9d9d9; padding:0px 0; height:100%; overflow:hidden; }
#mainSupportCon .content-tit{ display:inline-block; font-size:24px;  font-weight:600; color:#3c3c3c;text-align:center;  padding:0px 0 3px 0; line-height:140%; margin:0 auto 5% auto;}
#mainSupportCon .content-tit span { border-bottom:2px solid #bdbdbd;} 
#mainSupportCon .content-tit span.blue01 { border-bottom:2px solid #1c4b94;} 
#mainSupportCon .content-tit a{ font-size:24px;  font-weight:600; color:#3c3c3c;}


#supportList .s_notice {float:left; width:33%; text-align:center;height:100%; overflow:hidden; padding:80px 0; }
#supportList .s_notice .s_notice_box {margin:0 3%;height:100%; overflow:hidden;}
#supportList .s_notice .s_notice_box .sboximg {float:left; width:34%; margin:2%;}
#supportList .s_notice .s_notice_box .sboximg img { border:1px solid #d9d9d9; max-width:100%; min-height:90px;}
#supportList .s_notice .s_notice_box .sboxtxt {float:right; width:58%; text-align:left; }
#supportList .s_notice .s_notice_box .sboxtxt ul {margin:10px 0;}
#supportList .s_notice .s_notice_box .sboxtxt  li {color:#323232; font-size:15px; font-weight:500;}
#supportList .s_notice .s_notice_box .sboxtxt  li a{color:#323232; font-size:15px; font-weight:500;}
#supportList .s_notice .s_notice_box .sboxtxt  li span { display:block;color:#7b7b7b; font-size:14px; font-weight:300; margin:10px 0 0 0}
#supportList .sline {height:1px; background:#d9d9d9; margin:2% auto}


#supportList .s_movie {float:left; width:34%; text-align:center;height:100%; overflow:hidden; background:#e9e9e9; padding:80px 0; }
#supportList .s_movie .s_movie_box {margin:5%;height:100%; overflow:hidden;}

#supportList .s_contribute {float:left; width:33%; text-align:center;height:100%; overflow:hidden;  padding:80px 0 60px 0; }
#supportList .s_contribute h2 {font-size:24px; color:#3c3c3c; font-weight:700; margin:5% 0}
#supportList .s_contribute .s_contribute_box {margin:0 10%;height:100%; overflow:hidden;}
#supportList .s_contribute .s_contribute_box img {max-width:100%;}


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

@media all and (max-width:1024px){
	#mainSupportCon .content-tit {clear:both;display:block; text-align:left;}
	
	#supportList .s_notice {clear:both;float:none; width:90%; padding:80px 0; margin:0 auto; vertical-align:top; }
	#supportList .s_notice .s_notice_box { float:left; width:48%; margin:0 1%; border-right:1px solid #d9d9d9; padding:0 5%;box-sizing:border-box;}
	#supportList .s_notice .s_notice_box:last-child {border-right:0px solid #d9d9d9;}
	#supportList .s_notice .s_notice_box .sboximg {float:none; width:100%; margin:0%;}
	#supportList .s_notice .s_notice_box .sboxtxt {float:none; width:100%; text-align:left; }
	
	
	
	#supportList .sline { display:none;}
	
	
	#supportList .s_movie {width:50%; border-top:1px solid #d9d9d9; padding:80px 5%;box-sizing:border-box;}
	#supportList .s_movie .s_movie_box {margin:0%;}
	
	#supportList .s_contribute {width:50%; border-top:1px solid #d9d9d9; padding:80px 5% 40px 5%;box-sizing:border-box;}
	

}

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

@media all and (max-width:640px){
	#mainSupportCon .content-tit{ font-size:20px; }
	
	
	#supportList .s_notice{ padding:50px 0;}
	
	#supportList .s_notice .s_notice_box { float:none; width:100%;margin:0 0%;border-right:0px solid #d9d9d9;}
	#supportList .s_notice .s_notice_box .sboximg {float:left; width:34%; margin:1%;}
	#supportList .s_notice .s_notice_box .sboximg img { border:1px solid #d9d9d9; max-width:100%;}
	#supportList .s_notice .s_notice_box .sboxtxt {float:right; width:58%; text-align:left; }
	#supportList .s_notice .s_notice_box .sboxtxt ul {margin:5px 0;}
	#supportList .s_notice .s_notice_box .sboxtxt  li { font-size:14px; line-height:110%;}
	#supportList .s_notice .s_notice_box .sboxtxt  li span { font-size:13px; margin:5px 0 0 0}
	

	#supportList .sline { display:block;height:1px; background:#d9d9d9; margin:2% auto}

	#supportList .s_movie { float:none;width:100%; padding:50px 5%;}
	
	#supportList .s_contribute { float:none;width:100%; padding:50px 5%;}


}

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



/* 메인 :: 시공사례 */
#mainPartnerCon{overflow:hidden; position:relative; width:100%; padding:50px 0; z-index:150;}
#partnerList{padding-bottom:0px; max-width:1200px; margin:0 auto; text-align:center;}
#partnerList .content-tit{ display:inline-block; font-size:24px;  font-weight:600; color:#3c3c3c;text-align:center;  padding:0px 0 3px 0; line-height:140%; margin:0 auto 5% auto;}
#partnerList .content-tit span { border-bottom:2px solid #bdbdbd;} 
#partnerList .content-tit span.blue01 { border-bottom:2px solid #1c4b94;} 

.list_carousel { clear:both; height:100vh; overflow:hidden;	}
.list_carousel ul { float:left;margin: 0 auto;padding: 0;list-style: none;z-index:105;}
.list_carousel li {text-align:center;/*width:172px;*/ width:9vw; height:51px;  padding:0px;margin:0px 5px;display:block;float:left; box-sizing:border-box;border:1px solid #d9d9d9;	}
.list_carousel li img {width:100%;height:100%;}
.list_carousel.responsive {width:100%; height:100%; 	}

.prev { top:0;float: left;margin-left:0px; background:#e9e9e9; border:1px solid #d9d9d9; padding:16px 5px;box-sizing:border-box;}
.prev a {display:block;}
div.next_box { z-index:80; width:130px;top:0px;margin:0; left:5px; text-align:left;}
.next {top:0;z-index:80;float: right;margin-right:0px;background:#e9e9e9; border:1px solid #d9d9d9; padding:16px 5px;box-sizing:border-box;}
.next a {display:block;}


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

@media all and (max-width:1024px){
	.list_carousel li {/*width:172px;*/ width:18vw;}
	.prev { padding:16px 2px;}
	.prev img {width:5px;}
	.next { padding:16px 2px;}
	.next img {width:5px;}
}

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

@media all and (max-width:640px){
	#partnerList .content-tit {font-size:20px; }
	.list_carousel li {/*width:172px;*/ width:35vw;}
	.prev { width:2%;}
	.next{ width:2%;}
	
}

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