@charset "utf-8";

/* content */
#sub_container_wrap {position:relative; padding-top:130px;}
.sub_content_wrap {position:relative; width:1200px; margin:0 auto 30px; overflow:hidden; min-height:700px}
#sub_content{width:910px; float:right;}
.subCntBody {position:relative; padding:30px 0 0; color:#555; font-size:14px; line-height:1.4;}
.subCntBody p {line-height:1.4;}

/* 왼쪽메뉴 */
#menu {position:relative; float:left; width:230px; height:100%; font-family:'NotoR'; }
#menu h2 {height:34px; padding:43px 10px; font-family:'NotoM'; color:#fff; font-size:24px; line-height:34px; text-align:center; background:#292c2f;}
#menu .lnb > li.on .subLnb {display:block;}
#menu .lnb > li > a {display:block; height:22px; padding:13px 10px 13px; font-size:16px; line-height:22px; font-family:'NotoM'; color:#333; border:1px solid #dedede; border-top:none; background:url("/images/web/coe/sub/lnb_off.png") no-repeat right 50%;}
#menu .lnb > li > a.on {color:#0095d6; background:url('/images/web/coe/sub/lnb_off.png') no-repeat 19px 14px}
#menu .lnb > li.on > a, 
#menu .lnb > li > a:hover, 
#menu .lnb > li > a:focus, 
#menu .lnb > li > a:active {color:#fff; font-family:'NotoM'; text-decoration:none; border:1px solid #0095d6; border-top:none; background:url("/images/web/coe/sub/lnb_on.png") no-repeat right 50% #0095d6; }
#menu .subLnb {display:none; padding:10px 0; border:1px solid #dedede; border-top:none; background:#fafafa;}
#menu .subLnb li a {display:block; color:#333; padding:7px 10px 7px 29px; font-size:15px;  font-family:'NotoR'; background:url('/images/web/coe/sub/lnb_2off.png') no-repeat 19px 14px;}
#menu .subLnb li a:hover, 
#menu .subLnb li a:focus, 
#menu .subLnb li a:active, 
#menu .subLnb li.on a {color:#0095d6; background:url('/images/web/coe/sub/lnb_2on.png') no-repeat 19px 14px}

/* 새창 아이콘 181004 추가 */
#menu nav > .lnb > li > a[target='_blank']:after{display:inline-block; vertical-align:middle; position:relative; content:''; background:url('/images/web/coe/common/icon_new_WG.png') no-repeat; width:11px; height:11px; margin:-3px 0 0 8px;}
#menu nav > .lnb > li > a:hover[target='_blank']:after, #menu nav > .lnb > li.on > a[target='_blank']:after, #menu nav > .lnb > li.on > a:hover[target='_blank']:after {display:inline-block; vertical-align:middle; position:relative; content:''; background:url('/images/web/coe/common/icon_new_WW2.png') no-repeat; width:11px; height:11px; margin:-3px 0 0 8px;}
#menu nav > .lnb > li > ul > li > a[target='_blank']:after{display:inline-block; vertical-align:middle; position:relative; content:''; background:url('/images/web/coe/common/icon_new_WG.png') no-repeat; width:11px; height:11px; margin:-4px 0 0 8px;}

/* sub 타이틀 */
#sub_content .title_area {position:relative; height:119px; border-bottom:1px solid #ddd;}
.title_area .pageTitle {padding-top:28px; line-height:1.4; font-size:26px; letter-spacing:-1px; color:#111}
.title_area .location {text-align:left; font-family:'NotoR'; margin:10px 0 0}
.title_area .location span, 
.title_area .location strong {padding-left:18px; background:url('/images/web/coe/sub/bgLocation.png') no-repeat 6px center; font-size:14px; color:#666}
.title_area .location strong {color:#222;  font-family:'NotoM'; font-weight:normal}
.title_area .location a.home {display:inline-block; width:14px; height:16px; text-indent:-99999em; background:url('/images/web/coe/sub/ico_home.png') no-repeat left center;}

/* sns */ 
.snsBox { position:absolute; top:60px; right:0; text-align:right}
.snsBox button { display:inline-block; *display:inline; zoom:1; width:26px; height:26px; overflow:hidden; margin-left:3px; background:url("/images/web/coe/sub/btnSns.gif") no-repeat 0 0}
.snsBox button > span {text-indent:-1140px; font-size:0; line-height:0}
.snsBox .btnPrint {width:40px; height:40px; background:url("/images/web/coe/sub/btn_print.png") no-repeat 0 0}
.snsBox .btnShare{width:40px; height:40px; background:url("/images/web/coe/sub/btn_sns.png") no-repeat 0 0}
.snsBox .btnFbook { background-position:-29px 0; }
.snsBox .btnTwt { background-position:-58px 0; }
.snsBox .btnBlog { background-position:-87px 0; }
.snsBox .btnYtb { background-position:-116px 0; }
.snsBox .btnInstar{ background-position:-145px 0; }
.snsBox  .sns_more{display:none; position:absolute; top:45px; right:0; width:165px; *width:145px; border:1px solid #bbb; border-radius:2px; padding:10px 10px 10px 7px; z-index:30; background-color:#fff}


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

	#sub_container_wrap,
	.sub_content_wrap,
	#sub_content,
	.subCntBody {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	
	/* content */
	#sub_container_wrap,
	.sub_content_wrap {width:100%}	
	#sub_container_wrap { padding-top:110px}

	#sub_content{margin:0; width:100%; min-height:0; padding:0 10px 20px}

	/* sub 타이틀 */	
	#sub_content .title_area {height:auto; padding-bottom:15px;}
	.title_area .pageTitle {padding:15px 70px 0 0;}

	/* etc : sns*/ 
	.snsBox {top:20px}
	.snsBox .btnPrint {width:30px; height:30px; background-size:30px;}
	.snsBox .btnShare{width:30px; height:30px; background-size:30px;}
	
	.subCntBody{width:100%; float:none; padding:25px 0}
	
	/* common */
	.img_auto { width:100%; height:auto}

	/* 왼쪽메뉴 */
	#menu {position:static; width:auto; float:none;}

	#menu h2 {position:relative; width:100%; height:50px; line-height:26px; box-sizing:border-box; padding:12px 0 12px 20px; margin-bottom:0; color:#fff; cursor:pointer; font-size:17px; background:url("/images/web/coe/sub/bgLnbDepth.png") no-repeat 95% 50% #434e5f;}
	#menu h2.on {background:url("/images/web/coe/sub/bgLnbDepthOn.png") no-repeat 95% 50% #434e5f;}
	
    #menu nav{display:none}
    #menu nav{position:relative;border-bottom:2px solid #0a326c}

	#menu .lnb > li {margin:0;}
    #menu .lnb > li > a {padding:10px 10px 10px 20px; font-size:15px; border-top:none;}
    #menu .lnb > li.on >a,
	#menu .lnb > li > a:hover,
	#menu .lnb > li > a:focus,
	#menu .lnb > li > a:active {border:1px solid #0095d6; border-top:none; background-color:#0095d6; color:#fff}
    #menu .subLnb{background-color:#fff}
				
}

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

	
}


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


	

	
}

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

	
	/* sub 타이틀 */	
	.title_area .pageTitle {padding:15px 70px 0 0; font-size:20px;}
	/* etc : sns*/ 
	.snsBox {top:15px}

	.subCntBody{padding:30px 0 40px}	
	
	#menu h2 {padding-right:60px; text-align:left;}
	
	
	

	
}

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

	
}

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