@charset "utf-8";
/*=================================================================================================
// 명    칭 :공통 레이아웃 스타일쉬트 - 768px 이상
// 처리내용 :
// 작 성 자 :2018-05-28 김진후 
//=================================================================================================*/

body{}

.PC{display:block;}
.TABLET{display:none;}
.MOBILE{display:none;}

.PC_TABLET_SHOW{display:block;}
.MOBILE_SHOW{display:none;}

.PC_SHOW{display:block;}
.TABLET_MOBILE_SHOW{display:none;}


#diWrap{position:relative; width:100%;}

#diHeader{width:100%; height:auto; z-index:999;}
#diHeader .dcHDTopWrap > div{border-bottom:solid 1px #ddd;}

#diHeader.sticky,
#diHeader.active{box-shadow:0 0 10px rgba(0,0,0,0.3); background:#fff;}
#diHeader.sticky .dcHDTopWrap,
#diHeader.active .dcHDTopWrap{}
#diHeader.sticky .dcHDTopWrap:before,
#diHeader.active .dcHDTopWrap:before{background-color:#ddd;}
#diHeader.sticky .dcHDTopWrap .dcTopWrap ul li:after,
#diHeader.active .dcHDTopWrap .dcTopWrap ul li:after{background-color:#ccc;}
#diHeader.sticky .dcHDTopWrap .dcTopWrap ul li:last-child,
#diHeader.active .dcHDTopWrap .dcTopWrap ul li:last-child{background:url(../img/common/btn_search_hover.png) no-repeat 100% 50%;}
#diHeader.sticky .dcHDTopWrap .dcTopWrap ul li a,
#diHeader.active .dcHDTopWrap .dcTopWrap ul li a{color:#222;}
#diHeader.sticky h1#diLogo a,
#diHeader.active h1#diLogo a{background:url(../img/common/logo.png) no-repeat 50% 50%; background-size:100%;}
#diHeader.sticky nav.dcTopMenuWrap ol > li > a,
#diHeader.active nav.dcTopMenuWrap ol > li > a{color:#222;}
#diHeader.sticky nav.dcTopMenuWrap ol > li.selected > a,
#diHeader.active nav.dcTopMenuWrap ol > li.selected > a,
#diHeader.sticky nav.dcTopMenuWrap ol > li:hover > a,
#diHeader.active nav.dcTopMenuWrap ol > li:hover > a{color:#008a3e !important; color:#008a3e;}
#diHeader.sticky nav.dcTopMenuWrap ol > li:hover:before,
#diHeader.active nav.dcTopMenuWrap ol > li:hover:before{background-color:#008a3e;}

#diHeader.sticky .dcHDTopWrap .dcAllMenuWrap #diBtnAllMenu .Navibar,
#diHeader.active .dcHDTopWrap .dcAllMenuWrap #diBtnAllMenu .Navibar{background-color:#222;}
#diHeader.sticky .dcHDTopWrap .dcAllMenuWrap #diBtnAllMenu .Navibar:before,
#diHeader.active .dcHDTopWrap .dcAllMenuWrap #diBtnAllMenu .Navibar:before{background-color:#222;}
#diHeader.sticky .dcHDTopWrap .dcAllMenuWrap #diBtnAllMenu .Navibar:after,
#diHeader.active .dcHDTopWrap .dcAllMenuWrap #diBtnAllMenu .Navibar:after{background-color:#222;}

.dcHDTopWrap{position:relative; height:100px; overflow:hidden;}
.dcHDTopWrap.on{background:#fff; height:300px;}
.dcHDTopWrap > div{position:relative; height:100px;}
.dcHDTopWrap h1#diLogo{float:left; position:relative; width:28%; z-index:999;}
.dcHDTopWrap h1#diLogo a{max-width:458px; height:100px; background:url(../img/common/logo.png) no-repeat 50% 50%; background-size: 100%; text-indent:-9999px}
.dcHDTopWrap h1#diLogo a.hover{background:url(../img/common/logo.png) no-repeat 50% 50%; background-size: 100%;}

nav.dcTopMenuWrap{float:left; position:relative; width:50%; padding:0 7%;}
nav.dcTopMenuWrap ol{}
nav.dcTopMenuWrap ol > li{float:left; position:relative; text-align:center;}
nav.dcTopMenuWrap ol > li:nth-child(1){width:24%;}
nav.dcTopMenuWrap ol > li:nth-child(2){width:19%;}
nav.dcTopMenuWrap ol > li:nth-child(3){width:19%;}
nav.dcTopMenuWrap ol > li:nth-child(4){width:19%;}
nav.dcTopMenuWrap ol > li:nth-child(5){width:19%;}
nav.dcTopMenuWrap ol > li > a{display:block; position:relative; line-height:100px; font-size:20px; font-weight:700; color:#000; text-align:center;}
nav.dcTopMenuWrap ol > li:before{content:""; display:block; position:absolute; top:97px; left:0; width:100%; height:3px; background-color:#008a3e; transform:scaleX(0); transition:transform 250ms ease-in-out;}
nav.dcTopMenuWrap ol > li:hover:before{transform:scaleX(1)}
nav.dcTopMenuWrap ol > li:hover > a,
nav.dcTopMenuWrap ol > li.selected > a{color:#008a3e !important; font-weight: 700 !important;}
nav.dcTopMenuWrap ol > li > .dc2depthWrap{width:100%; height:200px; z-index:110; padding:20px 0;}
nav.dcTopMenuWrap ol > li > .dc2depthWrap > li{margin:0 0 10px 0;}
nav.dcTopMenuWrap ol > li > .dc2depthWrap > li:last-child{margin:0;}
nav.dcTopMenuWrap ol > li > .dc2depthWrap > li > a{font-size:18px; line-height:25px; color:#555; font-weight:400;}
nav.dcTopMenuWrap ol > li > .dc2depthWrap > li > a:hover,
nav.dcTopMenuWrap ol > li > .dc2depthWrap > li > a.on{color:#008a3e; font-weight: 700;}

.loginWrap{float:left; position:relative; width:20%; padding:33px 1% 0 0; overflow:hidden;}
.loginWrap a{float:left; display:flex; justify-content: center; width:49%; margin:0 2% 0 0; text-align:center;  background-color:#008A3E; border:solid 1px #008A3E; border-radius:5px; padding:0 2%; overflow:hidden;}
.loginWrap a i{float:left; font-size:16px; line-height:28px; color:#fff; margin:0 5% 0 0;}
.loginWrap a p{float:left; font-size:16px; line-height:28px; font-weight:400; color:#fff;}
.loginWrap a:last-child{margin:0;}
.loginWrap a:hover{background-color:#fff; border:solid 1px #008A3E;}
.loginWrap a:hover i{color:#008A3E;}
.loginWrap a:hover p{color:#008A3E;}

.dcAllMenuWrap{float:right; position:relative; width:2%; max-width: 30px; padding: 36px 0 0 0; z-index:1000;}
.dcAllMenuWrap #diBtnAllMenu{display:block; width:100%; height:24px; position:relative; text-indent:-9999px; z-index:999;}
.dcAllMenuWrap #diBtnAllMenu .Navibar{position:absolute; top:50%; right:0; margin-top:-2px; width:100%; height:3px; background-color:#000; transition:all 0.3s ease; border-radius:0;}
.dcAllMenuWrap #diBtnAllMenu .Navibar:before{position:absolute; content:''; display:block; width:100%; height:3px; background-color:#000; border-radius:0; top:-10px; right:0; transition:all 0.3s ease;}
.dcAllMenuWrap #diBtnAllMenu .Navibar:after{position:absolute; content:''; display:block; width:100%; height:3px; background-color:#000; border-radius:0; top:10px; right:0; transition:all 0.3s ease;}
.dcAllMenuWrap.onBg #diBtnAllMenu .Navibar{background-color:#333; border-radius:0;}
.dcAllMenuWrap.onBg #diBtnAllMenu .Navibar:before{background-color:#333; border-radius:0;}
.dcAllMenuWrap.onBg #diBtnAllMenu .Navibar:after{background-color:#333; border-radius:0;}
.dcAllMenuWrap #diBtnAllMenu .trans{background-color:transparent; transition:all 0.3s ease; border-radius:0;}
.dcAllMenuWrap #diBtnAllMenu .trans:before{display:block; content:''; position:absolute; top:0px; left:0px; transform:rotate(-45deg); transition:all 0.3s ease; transition:all 0.3s ease; background-color:#000; border-radius:0;}
.dcAllMenuWrap #diBtnAllMenu .trans:after{display:block; content:''; position:absolute; top:0; left:0px; transform:rotate(45deg); transition:all 0.3s ease; transition:all 0.3s ease; background-color:#000; border-radius:0;}
.dcAllMenuWrap .dcSiteMapBox{display:none;}

.dcSiteMapWrap{display:none; position:fixed; left:0; top:0; width:100%; height:100%; z-index:998;}
.dcSiteMapWrap .bgAllmenu{position:fixed; background-color:#fff; opacity:0.9; width:100%; height:100%;}
.dcSiteMapWrap .dcSiteMapLi{width:100%; top:0; left:0; transform:translate(0,0); z-index:999; position:relative; padding:110px 0 0;}
.dcSiteMapWrap .dcSiteMapLi ol{overflow:hidden;}
.dcSiteMapWrap .dcSiteMapLi ol > li{width:100%; min-height:auto;}
.dcSiteMapWrap .dcSiteMapLi ol > li.selected{background-color:#000;}
.dcSiteMapWrap .dcSiteMapLi ol > li.selected > a{color:#fff;}
.dcSiteMapWrap .dcSiteMapLi ol > li.selected > ul{display:block;}
.dcSiteMapWrap .dcSiteMapLi ol > li > a{display:block; width:100%; font-size:20px; font-weight:600; color:#000; padding:10px 5%; text-align:left;}
.dcSiteMapWrap .dcSiteMapLi ol > li > ul{display:none; background-color:#666; padding:5px 0;}
.dcSiteMapWrap .dcSiteMapLi ol > li > ul > li{float:none; width:100%;}
.dcSiteMapWrap .dcSiteMapLi ol > li > ul > li:last-child{margin:0;}
.dcSiteMapWrap .dcSiteMapLi ol > li > ul > li > a{font-size:20px; font-weight:300; color:#fff; text-align:left; width:100%; padding:5px 0 5px 6%;}
.dcSiteMapWrap .dcSiteMapLi ol > a{display:block; width:100%; font-size:20px; font-weight:300; color:#fff; padding:10px;}
.dcSiteMapWrap .dcSiteMapLi ul > li > a{display:block; width:100%; font-size:20px; font-weight:600; color:#000; padding:10px 20px;}

#diFooter{padding:100px 0; background-color:#000;}
#diFooter .inner{width:90%; margin:0 auto;}
#diFooter .top{margin:0 0 50px 0;}
#diFooter .top ul{overflow:hidden;}
#diFooter .top ul li{float:left; padding:0 30px 0 0;}
#diFooter .top ul li:last-child{padding:0;}
#diFooter .top ul li a{font-size:18px; font-weight:200; color:#fff; }
#diFooter .top ul li a.strong{color:#e4ff00; font-weight:400;}
#diFooter .copyright{}
#diFooter .copyright .copy01{margin:0 0 50px 0;}
#diFooter .copyright .copy01 p{font-size:18px; font-weight:200; color:#fff; }
#diFooter .copyright .copy01 p.pText01{}
#diFooter .copyright .copy01 p.pText02{display:inline-block; margin:0 20px 0 0;}
#diFooter .copyright .copy01 p.pText03{display:inline-block;}
#diFooter .copyright .copy01 p.pText03 a{display:inline-block; color:#fff; }
#diFooter .copyright .copy02{}
#diFooter .copyright .copy02 p.pText01{font-family:'Montserrat', sans-serif; font-size:16px; font-weight:300; color:#fff; }
#diFooter .copyright .copy02 p.pText01 span{font-weight:700;}

.dcSubVisualWrap{position:relative;}
.dcSubVisualWrap .dcSubTitleWrap{position:relative; height:500px; padding:100px 0 0 0;}
.dcSubVisualWrap .dcSubTitleWrap h3.dcSubTitle{text-align:center; font-size:60px; color:#fff; font-weight:600; line-height:400px;}

.BgSub01{background:url(../img/subTitle/sub01.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub10{background:url(../img/subTitle/sub10.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub20{background:url(../img/subTitle/sub20.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub30{background:url(../img/subTitle/sub30.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub40{background:url(../img/subTitle/sub40.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub50{background:url(../img/subTitle/sub50.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub60{background:url(../img/subTitle/sub60.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub70{background:url(../img/subTitle/sub70.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub80{background:url(../img/subTitle/sub80.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub90{background:url(../img/subTitle/sub90.jpg) no-repeat 50% 50%; background-size:cover;}
.BgSub99{background:url(../img/subTitle/sub90.jpg) no-repeat 50% 50%; background-size:cover;}

#diNavicationWrap{width:100%; padding:10px 3%; margin:0 auto; font-size:14px; font-weight:400; color:#666;}
#diNavicationWrap span{display:inline-block; font-size:14px; font-weight:400; color:#666;}
#diNavicationWrap span.dcHome{}

#SUBMENU{position:relative; width:100%; height:120px; margin:0 0 0 0; background-color:#fff; z-index:80; border-bottom:solid 1px #d2d2d2; transition: 0.3s;}
#SUBMENU .nav_box{position:relative; width:100%; margin:0 auto;}
#SUBMENU .nav_box ul.sub_menu1{float:left; width:20%;}
#SUBMENU .nav_box ul.sub_menu1 > li{position:relative; width:100%; color:#000; line-height:120px; padding:0 10% 0 0; cursor: pointer; background: url(../img/subTitle/btnArrowDown.png) no-repeat 100% 50%; font-weight:700; font-size:30px;}
#SUBMENU .nav_box ul.sub_menu1 > li .sub_menu{position:absolute; top:119px; left:0; width:100%;  text-align:left; z-index:997;padding: 0 0 0 0; border:solid 1px #ddd; border-top:0;}
#SUBMENU .nav_box ul.sub_menu1 > li .sub_menu li{color:#000; background-color:#fff; border-bottom:solid 1px #fff;}
#SUBMENU .nav_box ul.sub_menu1 > li .sub_menu li:hover{background-color:#f1f1f1;}
#SUBMENU .nav_box ul.sub_menu1 > li .sub_menu li a{display:block; font-size:22px; color:#000; padding:20px 10%; line-height:30px; font-weight:700;}
#SUBMENU .nav_box ul.sub_menu1 > li .sub_menu li:last-child{border:0;}
#SUBMENU .nav_box ul.sub_menu2{float:left; width:80%; text-align:right; font-size:0;}
#SUBMENU .nav_box ul.sub_menu2 li{display:inline-block; margin:0 0 0 3%;}
#SUBMENU .nav_box ul.sub_menu2 li a{font-size:24px; line-height:120px; font-weight:700; color:#000;}
#SUBMENU .nav_box ul.sub_menu2 li.active a{color:#008A3E; text-decoration:underline;}

#SUBMENU.positionFixed{position:fixed; top:0px; left:0px; height:80px;}
#SUBMENU.positionFixed .nav_box ul.sub_menu1 > li{line-height:80px;}
#SUBMENU.positionFixed .nav_box ul.sub_menu1 > li .sub_menu{top:79px;}
#SUBMENU.positionFixed .nav_box ul.sub_menu2 li a{line-height:80px;}

.dcSubVisualWrap .dcSub2depthWrap{width:100%; height:45px; position:relative; background:linear-gradient( 45deg, #666, #333, #666, #333 );}
.dcSubVisualWrap .dcSub2depthWrap ul.dc2depthList{width:1400px; margin:0 auto; position:relative; z-index:1; text-align:center; font-size:0; }
.dcSubVisualWrap .dcSub2depthWrap ul.dc2depthList.transform0{transform:none !important;}
.dcSubVisualWrap .dcSub2depthWrap ul.dc2depthList li{position:relative; display:inline-block; margin:0 1%;}
.dcSubVisualWrap .dcSub2depthWrap ul.dc2depthList li a{position:relative; text-align:center; font-size:18px; font-weight:600; color:#ccc; line-height:45px;}
.dcSubVisualWrap .dcSub2depthWrap ul.dc2depthList li:hover a,
.dcSubVisualWrap .dcSub2depthWrap ul.dc2depthList li.active a{color:#ffe000; font-weight:600;}

.loginWrap_m{display:none;}

/*태블릿 css*/
@media(max-width:1399px){

	.PC{display:none;}
	.TABLET{display:block;}
	.MOBILE{display:none;}

	.PC_TABLET_SHOW{display:block;}
	.MOBILE_SHOW{display:none;}

	.PC_SHOW{display:none;}
	.TABLET_MOBILE_SHOW{display:block;}

	.dcHDTopWrap > div{width:90%;}
	.dcHDTopWrap h1#diLogo{width:62%;}	
	.dcHDTopWrap h1#diLogo a{max-width:400px;}

	nav.dcTopMenuWrap{display:none;}

	.loginWrap{display:block; width:33%; padding:36px 2% 0;}
	.loginWrap a{width:49%; margin:0 2% 0 0; padding:0 5%;}
	.loginWrap a i{font-size:14px; line-height:25px; margin:0 10% 0 0;}
	.loginWrap a p{font-size:14px; line-height:25px;}

	.dcAllMenuWrap{width:10%; max-width: 30px; }

	#diFooter .top{text-align:center;}
	#diFooter .top ul{display:inline-block;}
	#diFooter .top ul li a{font-size:18px;}
	#diFooter .copyright .copy01 p{text-align:center; font-size:18px;}
	#diFooter .copyright .copy01 p.pText02{display:block;}
	#diFooter .copyright .copy01 p.pText03{display:block;}
	#diFooter .copyright .copy02 p.pText01{text-align:center; font-size:18px;}

	.dcSub2depthWrap.positionFixed{position:fixed; top:0px; left:0px; height:80px;}
	.dcSub2depthWrap.positionFixed ul.dc2depthList li{height:80px; line-height:80px;}
	.dcSub2depthWrap.positionFixed ul.dc2depthList li:after{height:4px;}

	.dcSub2depthWrap{position:relative; width:100%; overflow:hidden; height:60px; background-color:#000; z-index:50;}
	.dcSub2depthWrap ul.dc2depthList{font-size:0; text-align:center; width:auto; white-space:nowrap; overflow:initial; padding:0;}
	.dcSub2depthWrap ul.dc2depthList.transform0{transform:none;}
	.dcSub2depthWrap ul.dc2depthList li{position:relative; height:60px; line-height:60px; width:auto; margin:0 2%; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center;}
	.dcSub2depthWrap ul.dc2depthList li a{text-align:center; font-size:22px; font-weight:400; color:#555; white-space:nowrap;}
	.dcSub2depthWrap ul.dc2depthList li:after{content:''; display:block; position:absolute; bottom:0; left:0; width:100%; height:2px; background-color:#fbff00; transform:scaleX(0); transition:transform 250ms ease-in-out;}
	.dcSub2depthWrap ul.dc2depthList li:hover:after,
	.dcSub2depthWrap ul.dc2depthList li.active:after{transform:scaleX(1)}
	.dcSub2depthWrap ul.dc2depthList li:hover a,
	.dcSub2depthWrap ul.dc2depthList li.active a{color:#fbff00; font-weight:800; background-color:transparent;}

	.dcSubVisualWrap .dcSubTitleWrap{height:300px; padding:100px 0 0 0;}
	.dcSubVisualWrap .dcSubTitleWrap h3.dcSubTitle{font-size:40px; line-height:200px;}

	.dcSubVisualWrap #SUB10 ul.dc2depthList li{width:auto;}
	.dcSubVisualWrap #SUB20 ul.dc2depthList li{width:auto;}
	.dcSubVisualWrap #SUB30 ul.dc2depthList li{width:auto;}
	.dcSubVisualWrap #SUB40 ul.dc2depthList li{width:auto;}
	.dcSubVisualWrap #SUB50 ul.dc2depthList li{width:auto;}
	.dcSubVisualWrap #SUB60 ul.dc2depthList li{width:auto;}

	.loginWrap_m{display:none;}

}





/*모바일 css*/
@media(max-width:767px){

	.PC{display:none;}
	.TABLET{display:none;}
	.MOBILE{display:block;}

	.PC_TABLET_SHOW{display:none;}
	.MOBILE_SHOW{display:block;}

	.PC_SHOW{display:none;}
	.TABLET_MOBILE_SHOW{display:block;}

	.basicWrapCenter{width:100%; margin:0 auto;}

	.dcHDTopWrap{height:80px;}
	.dcHDTopWrap > div{height:80px;}
	.dcHDTopWrap h1#diLogo{width:92%;}	
	.dcHDTopWrap h1#diLogo a{max-width:278px; height:80px;}
	
	.dcSiteMapWrap .dcSiteMapLi{padding:90px 0 0;}
	.dcSiteMapWrap .dcSiteMapLi ol > li > a{font-size:16px;}
	.dcSiteMapWrap .dcSiteMapLi ol > li > ul > li > a{font-size:16px;}
	
	nav.dcTopMenuWrap{display:none;}

	.loginWrap{display:none;}

	.dcAllMenuWrap{width:8%; max-width: 30px; padding: 29px 0 0 0; }

	#diFooter{padding:50px 0 100px;}
	#diFooter .top ul li{padding:0 20px 0 0;}
	#diFooter .top ul li a{font-size:14px;}
	#diFooter .copyright .copy01 p{font-size:14px;}
	#diFooter .copyright .copy01 p.pText02{margin:0;}
	#diFooter .copyright .copy02 p.pText01{font-size:14px;}

	.dcSub2depthWrap.positionFixed{height:60px;}
	.dcSub2depthWrap.positionFixed ul.dc2depthList li{height:60px; line-height:60px;}
	.dcSub2depthWrap.positionFixed ul.dc2depthList li:after{height:4px;}

	.dcSubVisualWrap .dcSubTitleWrap{height:200px; padding:80px 0 0 0;}
	.dcSubVisualWrap .dcSubTitleWrap h3.dcSubTitle{font-size:30px; line-height: 120px;}

	.dcSub2depthWrap{height:50px; }
	.dcSub2depthWrap ul.dc2depthList li{height:50px; line-height:50px; margin:0 3%;}
	.dcSub2depthWrap ul.dc2depthList li a{font-size:16px;}

	.loginWrap_m{display:block; position:fixed; bottom:0px; left:0; width:100%; z-index:990;}
	.loginWrap_m a{float:left; display:flex; justify-content: center; width:calc(100%/3); padding: 7px 0; text-align:center; font-size:14px; color:#fff; background-color:#495f79;}
	.loginWrap_m a i{float:left; font-size:14px; line-height:25px; margin:0 5% 0 0;}
	.loginWrap_m a p{float:left; font-size:14px; line-height:25px;}
	.loginWrap_m a.dcBtnTop{background-color:#008A3E;}












}