﻿@charset "utf-8";
#topMenu {width: 100%; background:#2a2a2d; display:block;}
#topMenu .lnbWrap{width: 1400px; margin: 0 auto; position:relative;}
#topMenu .lnbWrap::after{display: block; content: ""; clear: both;}
#topMenu .lnbHome{float: left; border-right: 1px solid #6a6a6c; border-left: 1px solid #6a6a6c; padding: 1rem 1.5rem;}
#topMenu .lnb {float: left; position:relative;}
#topMenu .lnb::after{display: block; content: ""; clear: both;}
#topMenu .lnb > li {position:relative; float:left; border-right: 1px solid #6a6a6c;}
#topMenu .lnb > li.menu1{background:#2a2a2d;}
#topMenu .lnb > li.menu2{background:#2a2a2d;}
#topMenu .lnb > li > a {position:relative; display:block; color:#fff; padding: 1rem 5rem 1rem 2rem}
#topMenu .lnb > li.dep > a::before{content:""; position:absolute; top:50%; right:15px; width:21px; height:21px; margin-top:-10px; background:url('/images/org/web/junglebook/sub/btn_lnbArr.png') no-repeat center;}
#topMenu .lnb > li.dep > a.open::before{transform:rotate(180deg); -ms-transform:rotate(180deg); -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg);}
#topMenu .lnb a{-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; transition:all 0.3s ease;}

/* 3차메뉴 */
#topMenu .subLnb {display:none; position:absolute; left:0; top:3.5rem; width:100%; background:#fff; border:1px solid #ccc; border-top:0; overflow:hidden; z-index:10;}
#topMenu .subLnb li a {position:relative; display:block; font-size:14px; padding:10px 20px; line-height:21px; border-top:1px solid #ccc;}
#topMenu .subLnb li:first-child a{border-top:0;}

/* sns */ 
/* .snsBox { background:#2a2a2d; transition:all 0.2s ease; position: absolute; right: 0;}
.snsBox > button {float:left; cursor:pointer;}
.snsBox > button:hover{background:rgba(0,0,0,0.9);}
.snsBox button {display:inline-block; width:25px; height:25px; overflow:hidden; background:url("/images/org/web/junglebook/sub/btnSns.png") no-repeat 0 0}
.snsBox button > span {text-indent:-10000em; font-size:0; line-height:0;}
.snsBox .btnShare {background: none; height: auto; padding: 1.1rem 0; width: 3rem;}
.snsBox .btnPrint {background: none; height: auto; padding: 1.1rem 0; width: 3rem;}
.snsBox .btnBlog { background-position:-232px 0;}
.snsBox .btnFbook { background-position:-29px 0;}
.snsBox .btnTwt { background-position:-58px 0;}
.snsBox .btnYtb { background-position:-261px 0;}
.snsBox .btnInstar { background-position:-290px 0;}
.snsBox .btnBkmk { background-position:-319px 0;}
.snsBox .sns_more {display:none; position:absolute; top:3.5rem; right:0; white-space:nowrap; border:1px solid #bbb; border-radius:2px; padding:10px; z-index:30; background-color:#fff}
.snsBox .sns_more button{margin:0 2px;} */


/* 새창 아이콘 */
#topMenu .lnb a[target='_blank']:after {content:""; background:url('/images/org/web/junglebook/common/icon_blank.png') no-repeat; display:inline-block; width:11px; height:11px; margin-left:10px;}


/* 왼쪽메뉴 */
#menu { position:relative; float:left; width:16.5rem; } 
#menu h1 {padding: 2.5rem 0; letter-spacing:-2px; text-align:center; font-size:26px; border: 1px solid #d3d7dd;}
#menu .lnb { border:1px solid #d3d7dd; border-top:0 }
#menu .lnb > li{ position:relative; border-top:1px solid #d3d7dd }
#menu .lnb > li:first-child{ border-top:0 }
#menu .lnb > li > a {display:block; width: 100%; padding: 1rem; color:#333; box-sizing: border-box;}
#menu .lnb > li > a:hover{background: #3e6328; color: #fff;}
#menu .lnb > li.on > a{color:#008000; background:#dff8c0; font-family:'NotoM'; text-decoration:none;}


/* subLnb */
#menu .subLnb {display:none; border-top:1px solid #d3d7dd; background-color:#eeeff2; padding:8px 18px; }
#menu .subLnb li a {display:block; color:#333; padding:0.5rem 1rem; font-size:0.9rem; background:url('/images/org/web/junglebook/sub/bgSideNaviSub.gif') no-repeat 0 1.1rem}
#menu .subLnb li.on a {color:#008000;}
#menu .subLnb li.on a:hover {text-decoration:none}
#menu .subLnb li a:hover{ text-decoration:underline} 
#menu .lnb > li.row > a:after{display:block; position:absolute; content:'';}
#menu .lnb > li.row > a:after{background:url('/images/org/web/junglebook/sub/arrow_b.png') no-repeat; width:10px; height:10px; right:18px; top:1.3rem; transition: 0.3s;}
#menu .lnb > li.on.row > a:after{transform: rotate(90deg); -webkit-transform: rotate(90deg);}
#menu .lnb a[target='_blank']:after  {content:""; background:url('/images/org/web/junglebook/common/icon_blank.png') no-repeat; display:inline-block; width:11px; height:11px; margin-left:10px;}


/* /////////////콘텐츠시작////////////// */

/* content */
#sub_container_wrap {position:relative; background:#fff}
#sub_container_wrap:after {content:""; display:block; clear:both;}


.sub_content_wrap {position:relative; width:1400px; margin:5rem auto; min-height:680px;} 
.sub_content_wrap:after {content:""; display:block; clear:both;} 

#sub_content{ float:left; width:Calc(100% - 20.5rem); margin-left: 4rem;} 
.subCntBody{ position:relative; padding-bottom: 2rem; padding-top: 2rem;}


/* 히스토리 */
.lh{line-height: 1.7rem;}
.hisTit{font-size: 2rem;}
.hisVisual{width: 100%;height: 370px;background: url(/images/org/web/junglebook/sub/img_historyVisual.png) no-repeat center;}
.greenTit{color: #3e6328; font-size: 1.3rem; padding: 0.5rem 0; position: relative; padding-left: 1.3rem;}
.greenTit::before{display: block; content: ""; width: 15px; height: 5px; background: #3e6328; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.hisBox:after{display: block; content: ""; clear: both;}
.hisBox dl{width: 50%; float: left; position: relative;}
.hisBox dl:nth-of-type(1)::after{display: block; content: ""; width: 30px; height: 30px; background: url(/images/org/web/junglebook/sub/img_historyPlus.png) no-repeat center; background-size: cover; position: absolute; top: 50%; right: -15px; transform: translateY(-50%); z-index: 10;}
.hisBox dl dt{background: #ffdc01; padding: 1rem 0;}
.hisBox dl:nth-of-type(2) dt{background: #a6ce39;}
.hisBox dl dd{background: #faf7e2; padding: 3rem; box-sizing: border-box; height: 620px;}
.hisBox dl:nth-of-type(2) dd{background: #edf1e4;}
.hisBox dl dd img{display: block; margin: 0 auto; max-width: 100%;}
.hisList:after{display: block; content: ""; clear: both;}
.hisList li{width: 48%; margin-right: 4%; float: left; margin-bottom: 2rem;}
.hisList li:nth-of-type(2n){margin-right: 0;}
.hisList li div{width: 100%; height: 250px; background: #ccc;}
.hisList li p{text-align: center; padding: 0.5rem 0;}


/* sub 타이틀 */
#sub_content .title_area{ position:relative; overflow:hidden; padding:47px 0 0; height:51px; border-bottom:1px solid #e5e5e5}
#sub_content .title_area:after { content:""; display:block; clear:both;}  /* 180828 수정*/
.title_area .location { position:absolute; top:18px; right:0; font-size:13px; line-height:18px;}
.title_area .location span, 
.title_area .location strong {display:inline-block; *display:inline; zoom:1; padding-left:16px; background:url('/images/org/web/cwedu/sub/icon_location_arrow.gif') no-repeat 5px 6px; color:#777}
.title_area .location strong { font-weight:normal}
.title_area .location a.home img {vertical-align:middle}
.title_area .pageTitle{ font-weight:bold; letter-spacing:-2px; font-size:30px; color:#222; line-height:36px}

/* sns */ 
.snsBox { position:absolute; top:59px; right:0;}
.snsBox:after { content:""; display:block; clear:both;}
.snsBox button { float:left; margin-left:7px; width:28px; height:28px; overflow:hidden; background:url("/images/org/web/cwedu/sub/btnSns.png") no-repeat 0 0}
.snsBox button > span {text-indent:-1140px; font-size:0; line-height:0}
.snsBox .btnPrint { background-position:0 0; }
.snsBox .btnFbook { background-position:-31px 0; }
.snsBox .btnTwt { background-position:-62px 0; }
.snsBox .btnKko { background-position:-93px 0; }
.snsBox .btnKkot { background-position:-124px 0; }
.snsBox .btnBand{ background-position:-155px 0; }
.snsBox .btnDaum{ background-position:-186px 0; }
.snsBox .btnShare{ background-position:-217px 0; }
.snsBox .snsClose{ background-position:-248px 0; margin-left:-133px;}
.snsBox .sns_more{display:none; position:absolute; right:-105px; top:0; text-align:left}
.snsBox.on{ right:105px}
.snsBox.on .sns_more{ display:block;}

.greetbox {padding: 0 30px;}
.greetbox .greetimg {position: absolute;bottom: 20%;right: 3%;}/*220105 수정*/
.greetbox .sign {font-size: 17px; font-weight: bold; padding-left: 5px;}

@media (max-width:1440px) {

	.sub_content_wrap, #sub_content, .subCntBody, #menu h1 {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}

	#topMenu .lnbWrap{width: 100%;}
	
	/* content */
	#sub_content{padding: 2rem 1rem 0; box-sizing: border-box; width:Calc(100% - 18.5rem); margin-left: 2rem;}
	#sub_container_wrap, .sub_content_wrap {width:100%;}	
	.sub_content_wrap {margin:0 auto;}
	.subCntBody {width:100%;}

	/* 히스토리 */
	.hisTit{margin-top: 2rem;}

}

@media (max-width:1280px) {
	#header{position: relative;}

	/* 왼쪽메뉴 */
	#menu { width:100%; margin:0; padding:0; float: none;}
	#menu h1 {width:100%; height:auto; line-height:150%; padding: 1rem 0; cursor:pointer; font-size:20px; background:#3e6328; color: #fff; border: none;}
    #menu nav{display:none}
    #menu nav{position:relative;}
	#menu .lnb{ border:0}
	#menu .lnb{border: none;}
	#menu .lnb li:last-child{border-bottom: 1px solid #d3d7dd;}
	#menu .lnb > li > a:hover{background: #7ca863;}
	#menu .subLnb li:last-child{border-bottom: none;}
	
	
	/* 콘텐츠 */
	#sub_content{ float:none; width:100%; margin-left: 0;} 

	/* 히스토리 */
	
	.hisTit{margin-top: 0;}
	.hisBox dl dd{height: 650px;}
	
}

@media (max-width:1020px) {
	.sub_content_wrap {margin-top: -80px;} /* 20251204 추가 */
}

@media (max-width:900px){
    
    /* 210121 인사말 */
    .greetbox {padding: 0 0;}
    .greetbox .greetimg {position: relative; text-align: center; display: block;}
    .greetbox .greetimg img {max-width: 100%;}
    
}

@media (max-width:800px) {
	
	.subCntBody{padding:25px 0 40px}
	
	/* sub 타이틀 */
	#sub_content .title_area{ height:auto; overflow:visible; padding:0 0 0; border-bottom:0;}
	#sub_content{padding: 0 1rem;}
	
	.title_area .location { position:relative; top:auto; right:auto; text-align:center; margin:20px 0 10px}
	.title_area .pageTitle{ border-bottom:1px solid #e5e5e5; padding-bottom:22px; text-align:center; line-height:130%;}
	/* sns */ 
	.snsBox { position:relative; float:right; top:auto; right:auto; z-index:1; margin-top:10px} /* 180828 수정 */		

	/* 상단메뉴 */
	#topMenu .lnb > li > a {padding: 1rem 4rem 1rem 1.5rem;}

	/* 히스토리 */
	.lh br{display: none;}
	.hisBox dl{width: 100%; float: none;}
	.hisBox dl:nth-of-type(1):after{right: 50%; top: 100%; transform: translate(50%,-15px);}
	.hisBox dl dd{height: auto;}
	
}

@media (max-width:600px) {
 	#sub_content {margin-top: -145px;} /* 20251204 추가 */
	#wrap.no_langs #sub_content {margin-top: -120px;} /* 20251204 추가 */
}

@media (max-width:580px) {
	/* 상단메뉴 */
	#topMenu .lnbHome{padding:0.8rem 1rem;}
	#topMenu .lnb > li > a{padding:0.8rem 6rem 0.8rem 1rem;}
	#topMenu .lnb > li.menu1{display: none;}
	#topMenu .subLnb{top: 3.2rem;}
	
	.sub_content_wrap {margin-top: -60px;} /* 20251204 추가 */
	#sub_content {margin-top: -100px;} /* 20251204 추가 */
	#wrap.no_langs #sub_content {margin-top: -100px;} /* 20251204 추가 */

	/* sub 타이틀 */
	.title_area .location {margin:16px 0 8px}
	.title_area .pageTitle{ font-size:24px; letter-spacing:-1px; padding-bottom:18px;}

	/* 히스토리 */
	.hisVisual{height: 280px;}
	.hisList li{width: 100%; margin-right: 0; float: none;}
	.hisBox dl dd{padding: 1rem;}
	.hisBox dl dd p{margin-top: 1rem !important;}
}

@media (max-width:480px) {
	
	/* 왼쪽메뉴 */
	#menu h1 {background-position:96% 50%}
	
	/* 상단메뉴 */
	#topMenu .lnb > li > a{padding:0.8rem 5rem 0.8rem 1rem;}

	/* 히스토리 */
	.hisVisual{height: 260px; margin-top: 1rem !important;}
}

@media (max-width:380px) {

	
}