@charset "utf-8";
/* CSS Document */

.inner1200 {width:1200px; margin:0 auto; position:relative;}
.inner1200:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}


.inner1400 {width:1400px; margin:0 auto; position:relative;}
.inner1400:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}

.wrap_All {width:100%; height:100%; /* overflow:hidden; */ position:relative;}


@media all and (max-width:1200px){	
	.inner1200 {width:100%; padding-right:10px; padding-left:10px} 
}

@media all and (max-width:1200px){	
	.inner1400 {width:100%; padding-right:10px; padding-left:10px} 
}



/* 헤더 */
#topHeader { position:absolute; top:0; left:0; z-index:10000; width:100%;}

.mainTopHeader {width:100%; height:103px; background-color:rgba(0,0,0,0.7);}
.mainTopHeader .logoBox {float:left; width:20%; padding-top:30px;}
.mainTopHeader .mainMenuBox {float:left; width:60%; padding-top:40px;}
.mainTopHeader .rightBox {float:left; width:20%; padding-top:35px; text-align:right;}

.prDownBtn {display:inline-block; vertical-align:middle;}
.prDownBtn a {display:block; color:#fff; font-size:14px; border:1px solid #fff; border-radius:15px; line-height:1.2; padding:5px 15px;}
.prDownBtn a:hover {
	background-color:#fff;
	color:#333;	
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.prDownBtn a span {font-weight:bold; padding-right:5px; letter-spacing:0 !important; font-family:"Open Sans Bold",'notokr',"Malgun Gothic",sans-serif;}
.menuSDBtn {display:inline-block; padding:2px 0 0 10px; vertical-align:middle;}

.mainMenuUl {width:100%; padding:0 5%;}
.mainMenuUl li {float:left; width:25%; text-align:center;}
.mainMenuUl li a {font-size:16px; color:#fff;}
.mainMenuUl li:hover a {font-weight:500;}

.subMainMenuWrap {display:none; width:100%; background-color:#f9fafb; border-bottom:2px solid #2a5caa; box-shadow:3px 0 5px rgba(0,0,0,0.5); height:285px;}
.subMainMenuWrap .inner1200 {height:100%;}

.subMenuUl {margin-left:20%; float:left; width:60%; padding:0 3%; height:100%;}
.subMenuUl:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.subMenuUl > li {float:left; width:25%; height:100%; text-align:center;}
.subMenuUl > li:hover {background-color:#f2f2f3; border-right:1px solid #ddd; border-left:1px solid #ddd;}
.subMenuUl li.action {background-color:#1217b9; border-right:1px solid #ddd; border-left:1px solid #ddd;}

.subInnerMenu {width:100%; padding:10px 0;}
.subInnerMenu li {padding:8px 5px;}
.subInnerMenu li a {font-size:15px; color:#555655; font-weight:500; font-family:"Open Sans Bold",'notokr',"Malgun Gothic",sans-serif;}
.subInnerMenu li:hover a {color:#4b5eaa;}
.subInnerMenu li .active {color:#4b5eaa;}

.subMainMenuWrap .subMenuPicBox {float:left; width:20%; text-align:right; padding-top:30px;}
.subMainMenuWrap .subMenuPicBox .picBox {margin-bottom:13px;}
.subMainMenuWrap .subMenuPicBox h4 {font-size:13px; line-height:1.2; }

/*모바일 헤더*/
#topMobileHeader {display:none;  position:absolute; top:0; left:0; z-index:1000; width:100%;}
.m-topHeader_01 {width:100%; height:70px; background-color:rgba(0,0,0,0.7); padding:20px 20px;}
.m-topHeader_01 .m-logoBox {float:left; }
.m-topHeader_01 .m-logoBox img {width:170px;}
.m-topHeader_01 .m-menu-btnBox {float:right; padding:2px 10px 0 0; }

.m-menuWrap {display:none; width:100%; position:absolute; top:70px; left:0; z-index:10000; background-color:rgba(249,250,251,0.95); border-bottom:2px solid #2a5caa; box-shadow:3px 0 5px rgba(0,0,0,0.5); padding:5px 0px 0px;}
.m-mainMenu-ul {width:100%;}
.m-mainMenu-ul > li {width:100%;}
.m-mainMenu-ul > li:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.m-mainMenu-ul > li > a { width:100%; display:block; padding:14px 10px 14px 15px; border-top:1px solid #ddd;}
.m-mainMenu-ul > li > a .letter {font-size:15px; font-weight:500; color:#333;}
.m-mainMenu-ul > li > a .arrow {font-size:20px; float:right; margin-right:10px;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.m-mainMenu-ul > li:first-of-type > a {border-top:none;}

.m-mainMenu-ul > li.active > a .letter { color:#4b5eaa;}
.m-mainMenu-ul > li.active > a .arrow { transform:rotate(180deg);}

.m-subMenu-ul {display:none; padding:8px 10px 8px 23px; background-color:#767676b3;}
.m-subMenu-ul > li {padding:8px 0;}
.m-subMenu-ul > li > a {font-size:13px; color:#eee; font-weight:500;}

.m-blackBox {display:none; width:100%; height:100%; position:absolute; top:70px; left:0; background-color:rgba(0,0,0,0.6); z-index:999;}

@media all and (max-width:999px){	
	#topHeader {display:none;}
	#topMobileHeader {display:block;}
	
}




/* 푸터 */
#mainFooter {width:100%; background-color:#282c35; height:130px;}
.mainFooterBox {height:100%;}
.mainFooterBox .inner1200 {padding:30px 0 35px;}
.mainFooterBox .footerLogoBox {float:left; padding-right:27px;}
.mainFooterBox .addressBox {float:left;}
.mainFooterBox .addressBox address {color:#d1d3d4; letter-spacing:-0.02em;}
.mainFooterBox .addressBox address a {color:#d1d3d4;}
.mainFooterBox .addressBox address span {display:block; color:#a7a9ac; font-size:12px; padding-top:10px; letter-spacing:-0.02em;}
.mainFooterBox .rightBtnBox {float:right;}
.mainFooterBox .btnFooter {font-size:14px; font-weight:500; color:#efefef; border:1px solid #efefef; padding:10px 20px; margin-left:2px;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.mainFooterBox .btnFooter:hover {color:#282c35; background-color:#fff; font-weight:700;}

@media all and (max-width:999px){	
	
	#mainFooter {height:auto;}
	.mainFooterBox {}
	.mainFooterBox .inner1200 {padding:20px 20px 25px;}
	.mainFooterBox .footerLogoBox {float:none; width:100%; padding-right:0px; margin-bottom:15px;}
	.mainFooterBox .footerLogoBox img {width:190px;}
	.mainFooterBox .addressBox {float:none; width:100%;}
	.mainFooterBox .addressBox address {font-size:13px;}
	.mainFooterBox .rightBtnBox {float:none; margin-top:15px;}
	.mainFooterBox .btnFooter {font-size:12px; padding:5px 10px; font-weight:400;}
}

/*이메일무단수집거부, 저작권정책*/
.popUp-footer-con {display:none; position:fixed; top:50%; left:30%; width:40%; transform:translateY(-50%); background-color:#fff; z-index:6000; border:1px solid #ddd; border-top:3px solid #0c77b9; border-bottom:1px solid #555; box-shadow:3px 3px 3px rgba(0,0,0,0.3); }
.popUp-footer-con .inner {padding:35px 25px 20px;}
.popUp-footer-con .titleBox {width:100%; margin-bottom:20px; text-align:center;}
.popUp-footer-con .titleBox h2 {font-size:30px; font-weight:500; color:#222; line-height:1;}
.popUp-footer-con .conBox {width:100%; margin-bottom:20px; text-align:justify;}
.popUp-footer-con .conBox p {font-size:15px; line-height:1.6; font-weight:500; color:#666;}
.popUp-footer-con .btnBox {width:100%; text-align:center; padding:15px 10px 0; border-top:1px solid #e5e5e5;}
.pop-CloseBtn {padding:9px 35px; border-radius:20px; border:1px solid #0c77b9; color:#0c77b9; font-size:16px; font-weight:500;}
.pop-CloseBtn:hover {background-color:#0c77b9; color:#fff;}


@media all and (max-width:999px){	
	
	.popUp-footer-con {position:fixed; top:20%; left:5%; width:90%;  transform:translateY(0); max-height:60vh; overflow:scroll-y;}
	.popUp-footer-con .inner {padding:25px 20px 20px;}
	.popUp-footer-con .titleBox {margin-bottom:15px;}
	.popUp-footer-con .titleBox h2 {font-size:25px;}
	.popUp-footer-con .conBox { margin-bottom:15px;}
	.popUp-footer-con .conBox p {font-size:13px; }
	.popUp-footer-con .btnBox {padding:10px 10px 0;}
	.pop-CloseBtn {padding:8px 35px; font-size:14px;}
}





/* 서브탑 */
#sub-Top-Content {width:100%;}
.s-Top-Content-bg {width:100%; height:392px; background:#fff url(/img/sub/layout/img_subTopBg_01.jpg) no-repeat 50% 50%; background-size:cover; padding-top:1px;}
.s-Top-Content-bg .s-Top-Title {width:100%; margin-top:220px; text-align:center;}
.s-Top-Content-bg .s-Top-Title h2 {font-size:45px; font-weight:600; color:#fff; font-family:'Montserrat', sans-serif; line-height:1; margin-bottom:5px; text-shadow:3px 0 5px rgba(0,0,0,0.4);}
.s-Top-Content-bg .s-Top-Title h5 {font-size:15px; font-weight:500; color:#fff; text-shadow:3px 0 3px rgba(0,0,0,0.4);}

.s-Top-bg-busi {background-image:url(/img/sub/layout/img_subTopBg_01.jpg);} /*회사소개*/
.s-Top-bg-skill {background-image:url(/img/sub/layout/img_subTopBg_02.jpg);} /*기술정보*/
.s-Top-bg-intro {background-image:url(/img/sub/layout/img_subTopBg_03.jpg);} /*사업소개*/
.s-Top-bg-communi {background-image:url(/img/sub/layout/img_subTopBg_04.jpg);} /*커뮤니티*/

/*서브네비*/
.s-Top-nav-Wrap {width:100%; border-top:1px solid #ddd; border-bottom:1px solid #ddd; height:60px;}
.s-Top-nav-Wrap .inner1200 {height:100%;}
.s-top-nav-ul {width:100%; height:100%;}
.s-top-nav-ul:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.s-top-nav-ul > li {float:left; height:100%; border-left:1px solid #ddd; position:relative;}
.s-top-nav-ul > li:last-of-type {border-right:1px solid #ddd;}
.s-top-nav-ul > li > a {line-height:60px; display:block; padding:0 22px; min-width:250px;}
.s-top-nav-ul > li.home > a {min-width:auto; color:#777;}
.s-top-nav-ul > li > a .letter {font-size:15px; font-weight:500; color:#444;}
.s-top-nav-ul > li > a .arrow {float:right;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.s-top-nav-ul > li.active > a .arrow { transform:rotate(-180deg);}
.s-top-nav-ul > li.active > a .letter { font-weight:bold;}

.s-top-nav-SubUl {display:none; position:absolute; top:58px; left:-1px;  width:calc(100% + 2px); background-color:#fff; z-index:1000; padding:0px 0px; border:1px solid #ddd; border-bottom:1px solid #4b5eaa;}
.s-top-nav-SubUl li {padding:15px 20px; border-top:1px solid #ddd;}
.s-top-nav-SubUl li:first-of-type {border-top:none;}
.s-top-nav-SubUl li > a {font-size:14px; color:#444; display:block;}
.s-top-nav-SubUl li.active > a {color:#4b5eaa; font-weight:500;}
.s-top-nav-SubUl li > a:hover {color:#4b5eaa; font-weight:500;}


/*서브 내용*/
#sub-Content {width:100%; padding:80px 0 100px;}
.sub-con-title {width:100%; text-align:center; margin-bottom:45px;}
.sub-con-title h2 {font-size:42px; color:#222; line-height:1; font-weight:500; font-family:"Open Sans Bold",'notokr',"Malgun Gothic",sans-serif;}
.sub-con-title .board-detail {font-size:36px; text-align:left; margin-bottom:-20px;}

.bullet-title-box {width:100%; margin-bottom:16px;}
.bullet-title-box .word {font-size:20px; color:#333; line-height:1; font-weight:500;}
.bullet-title-box .word2 {font-size:20px; margin-left: 10px; color: #105baa; display: inline-block; border-bottom: 1px solid #105baa;}
.bullet-title-box .word2 b {font-size: 1.3em; font-weight:500;}
.bullet01 {vertical-align:top; display:inline-block; width:17px; height:19px; background:url(/img/icon/icon_bullet_01.png) no-repeat left top; background-size:cover; margin-right:8px;}

@media all and (max-width:999px){		
	
	/* 서브탑 */
	.s-Top-Content-bg {height:250px;}
	.s-Top-Content-bg .s-Top-Title {margin-top:120px; padding:0 20px;}
	.s-Top-Content-bg .s-Top-Title h2 {font-size:30px;}
	.s-Top-Content-bg .s-Top-Title h5 {font-size:14px; font-weight:400;}
	
	/*서브네비*/
	.s-Top-nav-Wrap {height:45px;}
	.s-Top-nav-Wrap .inner1200 {padding:0;}
	.s-top-nav-ul > li {}
	.s-top-nav-ul > li:first-of-type {border-left:none;}
	.s-top-nav-ul > li > a {line-height:45px; padding:0 15px; min-width:120px;}
	.s-top-nav-ul > li > a .letter {font-size:13px; margin-right:7px;}
	
	.s-top-nav-SubUl {top:43px;}
	.s-top-nav-SubUl li {padding:10px 15px;}
	.s-top-nav-SubUl li > a {font-size:13px;}
	
	/*서브 내용*/
	#sub-Content {padding:25px 10px 40px;}
		
	/*타이틀*/
	.sub-con-title {width:100%; margin-bottom:25px;}
	.sub-con-title h2 {font-size:25px;}
	.sub-con-title h4 {font-size:17px;}
	.sub-con-title .board-detail {font-size:22px; text-align:left; margin-bottom:-10px;}
		
	.bullet-title-box {margin-bottom:13px;}
    .bullet-title-box .word {font-size:15px;}
    .bullet-title-box .word2 {font-size:15px; margin-left: 5px;}
	.bullet01 {width:14px; height:16px; margin-right:4px;}
}

/*테이블*/
.tbl-de {width:100%;}
.tbl-de th {padding:10px 5px; font-size:17px; font-weight:500; color:#222;}
.tbl-de td {padding:10px 5px; font-size:15px;}
.tbl-de tr {border-top:1px solid #ddd; background-color:#fff;}

.tbl-sprite {text-align:center;}
.tbl-sprite th {border-left:1px solid #ddd;}
.tbl-sprite td { border-left:1px solid #ddd;}
.tbl-sprite tr {}
.tbl-sprite tr:nth-of-type(2n-1) {background-color:#f4f6fa;}
.tbl-sprite tr:last-of-type {border-bottom:1px solid #ddd;}
.tbl-sprite tr th:first-of-type {border-left:none;}
.tbl-sprite tr td:first-of-type {border-left:none;}

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

	.tbl-de th {padding:8px 3px; font-size:15px;}
	.tbl-de td {padding:8px 3px; font-size:13px;}

}



/*탭*/
.tab-box {width:100%; margin-bottom:40px;}
.tab-ul {width:100%;}
.tab-ul:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.tab-ul li {float:left; width:33.33%; margin-left:-1px; margin-top:-1px; border:1px solid #d6d7d7; text-align:center;}
.tab-ul li a {display:block; padding:16px 5px 14px; font-size:19px; font-weight:500; font-family:"Open Sans Bold",'notokr',"Malgun Gothic",sans-serif; line-height:1.1;}
.tab-ul li.active {background-color:#105baa; border-color:#105baa;}
.tab-ul li.active a {color:#fff;}

.tab-two li {width:50%;}
.tab-three li {width:16.7%;}
.tab-four li {width:25%;}
.tab-five li {width:16.751%;}

.tab-con {width:100%;}

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

	.tab-box {margin-bottom:20px;}
    .tab-ul li a {padding:10px 5px 9px; font-size:15px;}

    .tab-five li {width:50%;}	
}



/* 사이트맵 */
.subTopTitleBox h2 {text-align:center; font-size:42px; color:#444444; margin:28px 0 60px;} /* 큰 타이틀 */
.subTitle_SiteMap {text-align:center; font-size:17px; margin-bottom:50px;}

.siteMapWrap {width:100%;}
.siteMapWrap:after { visibility: hidden;display:block;font-size: 0;content:".";clear: both;height: 0;*zoom:1;}
.siteMapWrap .col {float:left; width:16.66%; padding:0 1.5%;}
.siteMapWrap .col h2 {font-size:20px; font-weight:500; color:#555; padding:10px 5px 15px; border-bottom:2px solid #005add; text-align:center; margin-bottom:10px;}
.siteMapWrap .col .mainSiteMap {width:100%;}
.siteMapWrap .col .mainSiteMap > li {border-bottom:1px dotted #ddd; padding:16px 5px 16px 15px; line-height:1.4;}
.siteMapWrap .col .mainSiteMap > li:last-of-type {border-bottom:none;}
.siteMapWrap .col .mainSiteMap > li > a {font-size:18px; word-break:keep-all; color:#777;}
.siteMapWrap .col .mainSiteMap > li:hover > a {font-weight:500; color:#444;}
.siteMapWrap .col .mainSiteMap > li .subSiteMap {width:100%; padding-left:5px; margin-top:10px;}
.siteMapWrap .col .mainSiteMap > li .subSiteMap li {position:relative; padding-left:13px; margin:10px 0;}
.siteMapWrap .col .mainSiteMap > li .subSiteMap li:last-of-type {margin-bottom:0;}
.siteMapWrap .col .mainSiteMap > li .subSiteMap li:before {content:""; position:absolute; left:0; top:9px; width:4px; height:4px; border-radius:50%; background-color:#444;}
.siteMapWrap .col .mainSiteMap > li .subSiteMap li a {font-size:15px; color:#999; word-break:keep-all;}
.siteMapWrap .col .mainSiteMap > li .subSiteMap li:hover a {font-weight:500; color:#666;}



@media all and (max-width:920px){
	
	/* 사이트맵 */
	.subTitle_SiteMap {font-size:14px; margin-bottom:20px;}
	
	.siteMapWrap .col {float:none; width:100%; padding:0 2%; margin-bottom:20px;}
	.siteMapWrap .col h2 {font-size:16px; padding:7px 5px 8px; }
	.siteMapWrap .col .mainSiteMap > li {padding:10px 5px 10px 10px;}
	.siteMapWrap .col .mainSiteMap > li > a {font-size:15px;}
	.siteMapWrap .col .mainSiteMap > li .subSiteMap {width:100%; padding-left:5px; margin-top:10px;}
	.siteMapWrap .col .mainSiteMap > li .subSiteMap li {position:relative; padding-left:13px; margin:10px 0;}
	.siteMapWrap .col .mainSiteMap > li .subSiteMap li:before {top:7px; width:3px; height:3px; top:11px;}
	.siteMapWrap .col .mainSiteMap > li .subSiteMap li a {font-size:13px;}

}




.s-top-nav-ul > li > a i {line-height: 60px;}