@charset "utf-8";

/*body {padding-top:95px;}*/
body.layerOpen {overflow:hidden;} /* 스크롤 제거 */

/* container */
#container {width:100%;display:inline-block; padding:200px 30px 50px 30px; background:#f1f1f1; box-sizing: border-box;}
#content {/*width:1150px;*/margin:0 auto;}


/* ===== header 영역 : S ===== */
body > header{position:fixed; width:100%; height:100px; border-bottom:1px solid rgba(255,255,255,.1); z-index:999; -webkit-transition:all .3s ease; transition: all .3s ease;}
body > header.scroll{position:fixed; top:0;}
header .header{width:100%; height:100%; display:flex; align-items:center; padding:20px 40px 20px 50px; box-sizing: border-box;}
header .header > div{width:auto; display:flex; align-items:center; height:auto;}
	
/* -- 왼쪽 영역 -- */
	header .header > div.left{text-align:left; flex:none;}
	header .header > div.left .home{width:143px; height:37px; flex:none; background:url('../../images/2019/logo.svg') center left / auto no-repeat !important; font-size:0; margin-right:50px; transition:0s all;}
	/* - 1뎁스 메뉴 */
	header .header > div.left .menu{width:auto; height:auto; display:flex; align-items:center; }
	header .header > div.left .menu > li{width:auto; height:100%; display:inline-block;}
	header .header > div.left .menu > li > a{font-family:'Noto Sans KR', sans-serif; font-weight:400; letter-spacing:-1px; color:#fff; font-size:17px; line-height:60px; margin-right:30px; padding-bottom:5px; position:relative; overflow:hidden;}
	header .header > div.left .menu > li > a:before{content:''; position:absolute; width:0; height:2px; background:#578ad5; bottom:0; left:0; }	
	header .header > div.left .menu > li > a.menuListOn:before{width:100%;-webkit-transition:all .5s ease; transition: all .5s ease;}
	header .header > div.left .menu > li > a.selectedMenuOn:before{width:100%;-webkit-transition:all .5s ease; transition: all .5s ease; background:#bbb;}
	header .header > div.left .menu > li > a.menuListOn:hover, 
	header .header > div.left .menu > li > a.menuListOn:focus,
	header .header > div.left .menu > li > a.menuListOn:active{color:#000;}
		/* ^ 마우스오버 했을때 드롭다운 2뎁스 메뉴 */
		.menuList{display:none; width:100%; height:auto; position:Absolute; top:100px; left:0; background:#fbfbfb; padding:0 12%; border-bottom:2px solid #888888;}
		.menuList .mlWrap{display:block; width:100%; height:100%; text-align:center; margin:0 auto; padding:0; position:relative;}
		.menuList .mlBG{position:absolute; left:0; top:0; width:100%; height:100%; display:flex; flex-wrap:wrap; text-align:center; margin:0 auto; padding:0; border-left:1px solid #ececec;}
		.menuList .mlBG > span{display:block; width:20%; height:100%; position:relative;}
		.menuList .mlBG > span:after{content:''; width:1px; height:100%; display:block; background:#ececec; right:0; top:0; position:absolute;}
		.menuList .mlCnt{width:100%; height:100%; display:flex; flex-wrap:wrap; text-align:center; margin:0 auto; padding:50px 0 0 0; border-left:1px solid #ececec;}
		.menuList .mlCnt > ul{width:20%; display:block;padding:0 2.3%; margin-bottom:45px; text-align:left; position:relative; z-index:99;}
		.menuList .mlCnt li > a{margin-right:0 !important;}
		.menuList .mlCnt li.depth02{position:relative; display:inline-block; font-family:'Noto Sans KR', sans-serif; font-weight:500; font-size:16px; color:#333333; padding-bottom:17px;}
		.menuList .mlCnt li.depth02:before{content:''; position:absolute; width:15px; height:1px; background:#a8a8a8; bottom:0; left:0;}
		.menuList .mlCnt li.depth03{padding-top:17px;}
		.menuList .mlCnt li.depth03 > a{position:relative; display:block; font-family:'Noto Sans KR', sans-serif; font-weight:400; font-size:15px; color:#838383; padding-bottom:1px;}
		.menuList .mlCnt li.depth03 > a:last-child{padding-bottom:0;}
		.menuList .mlCnt li.depth03 > a.hoverOn, 
		.menuList .mlCnt li.depth03 > a:focus{color:#578ad5;}
		/* 3뎁스 마우스 오버했을때 나오는 화살표 효과 
		.menuList .mlCnt li.depth03 > a.hoverOn:after{content:''; display:inline-block; vertical-align:middle; margin-left:8px; width:25px; height:15px;  background:url('../../images/2019/controls.png') 0 -96px  / auto no-repeat; -webkit-animation: hoverOn .5s ease-out; -moz-animation: hoverOn .5s ease-out; animation: hoverOn .5s ease-out; }
		*/
		.menuList .mlCnt li.depth03 > a.newTab > i{display:inline-block; vertical-align:top; margin-top:5px; width:14px; height:12px; margin-left:8px; background:url('../../images/2019/controls.png') -131px -59px  / auto no-repeat; }
		.menuList .mlCnt li.depth03 > a.newTab:hover > i, 
		.menuList .mlCnt li.depth03 > a.newTab:focus > i{background:url('../../images/2019/controls.png') -148px -59px  / auto no-repeat; }
		.menuList .mlCnt li.depth03 > a.newTab:after{display:none}
		.menu a.depth01 i{display:inline-block; margin-top:5px; width:14px; height:12px; margin-left:8px; background:url('../../images/2019/controls.png') -131px -59px  / auto no-repeat; }
		
/* -- 오른쪽 영역 -- */
	header .header > div.right{flex:auto; justify-content:flex-end;}
	/* - 보다나은정부 */
	header .header > div.right .gotoEng{color:#fff;margin-right:20px;}
	header .header > div.right .wording{width:132px;height:49px; font-size:0; }
	body.black header .header > div.right .wording,
	body.vsc-initialized header .header > div.right .wording,
	header.headerHover .header > div.right .wording,
	header#whiteSkin-scroll .header > div.right .wording {background:url('../../images/2022/header-wording_20220824.png') center right / auto no-repeat !important;}
	body.white header .header > div.right .wording{background:url('../../images/2022/header-wording_20220824.png') center right / auto no-repeat;}
	/* - 전체 메뉴 */
	header .header > div.right .allMenu{width:40px; height:41px; padding:10px; margin:10px 0 10px 10px; position:relative; overflow:hidden; z-index:9999;}
	header .header > div.right .allMenu > span{width:50%; height:1px; background:#fff; display:block; font-size:0;}
	header .header > div.right .allMenu:before{content:''; position:absolute; width:20px; height:1px; top:10px; background:#fff; display:block;}
	header .header > div.right .allMenu:after{content:''; position:absolute; width:20px; height:1px; bottom:10px; background:#fff; display:block;}
	header .header > div.right .allMenu:hover:before, header .header > div.right .allMenu:hover:after{-webkit-animation: allMenuBefore 1s ease-out; -moz-animation: allMenuBefore 1s ease-out; animation: allMenuBefore 1s ease-out; }
	header .header > div.right .allMenu:hover span{-webkit-animation: allMenuSpan 1s ease-out; -moz-animation: allMenuSpan 1s ease-out; animation: allMenuSpan 1s ease-out; }
	/* - 즐겨찾는 메뉴(아이콘) */
	header .header > div.right .popMenu{width:21px; height:21px; margin:0 10px 0 0; display:inline-block; position:relative; overflow:hidden;}
	header .header > div.right .popMenu > span{width:21px; height:10px; display:block;}
	header .header > div.right .popMenu > span > i{width:10px; height:10px; border:1px solid #fff; display:inline-block; vertical-align:top;}
	header .header > div.right .popMenu > span > i:nth-child(1){margin-right:1px; }
	header .header > div.right .popMenu > span:nth-child(1){margin-bottom:1px;}
		/* ^ 아이콘: 즐겨찾는 메뉴 */
		header .header > div.right .popMenu:hover > span > i.box-01{-webkit-animation: popMenuIcon 1s; animation: popMenuIcon 1s; }
		header .header > div.right .popMenu:hover > span > i.box-02{-webkit-animation: popMenuIcon 3s; animation: popMenuIcon 3s; }
		header .header > div.right .popMenu:hover > span > i.box-03{-webkit-animation: popMenuIcon 5s; animation: popMenuIcon 5s; }
		header .header > div.right .popMenu > span > i.plus{border:none !important; width:9px; height:9px; margin:1px 0 0 1px; text-align:right; position:relative;}
		header .header > div.right .popMenu > span > i.plus:before{content:''; position:absolute; width:9px; height:1px; background:#fff; right:0; bottom:4px;}
		header .header > div.right .popMenu > span > i.plus:after{content:''; position:absolute; width:1px; height:9px; background:#fff; right:4px; bottom:0;}
		header .header > div.right .popMenu:hover > span > i.plus:before, 
		header .header > div.right .popMenu:hover > span > i.plus:after{-webkit-animation: plusIcon 4s ease-out ; -moz-animation: plusIcon 4s ease-out ; animation: plusIcon 4s ease-out ; }
	/* - 검색바 (input) */
	.searchIcon_mobile{display:none ;}
	.search_mobile{display:inline-block; width:auto; height:auto;}
	#searchFrm{ overflow:hidden;}
	header .header > div.right .searchFrmWrap input[name="searchInput"]{width:260px; height:100%; background:rgba(255,255,255,.1); border:none; border-radius:18px;  padding:0 115px 0 15px; color:#fff; font-size:12px; -webkit-transition:all .3s ease; transition: all .3s ease;}
	header .header > div.right .searchFrmWrap input[name="searchInput"]:focus,
	header .header > div.right .searchFrmWrap input[name="searchInput"]:active{width:400px !important; border-radius:0 !important; }
	header .header > div.right .searchFrmWrap input::-webkit-input-placeholder{color:rgba(255,255,255,.8);}
	header .header > div.right .searchFrmWrap{ width:auto; height:36px; margin-right:10px; position:relative; display:inline-block; vertical-align:middle;}
	header .header > div.right .searchFrmWrap label{display:none;}
	header .header > div.right .searchFrmWrap input[name="searchInput"]::-ms-clear{display: none;}
	input[name="searchInput"]:-ms-clear{display: none;}
		/* ^ 아이콘(작성 검색어 삭제) */
		.schButton .searchClear{width:24px; height:24px; display:inline-block; margin-right:10px; }
		.schButton .searchClear span{height:100%; width:100%; display:block; position:relative; font-size:0;} 		
		.schButton .searchClear span:before, .schButton .searchClear span:after{content:''; display:block; position:absolute; top:0; left:50%; width:1px; height:100%; background:#999; -webkit-transition:all .3s ease; transition: all .3s ease; }
		.schButton .searchClear span:before{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);}
		.schButton .searchClear span:after{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);}
		.schButton .searchClear:hover span:before, .schButton .searchClear:hover span:after{background:#578ad5;}
		/* ^ 아이콘(검색하기) */
		.schButton{position:absolute; right:0; top:0; width:auto; height:100%; padding:6px 12px 6px 0;}
		.schButton .schButtonWrap{display:flex; align-items:center; justify-content:flex-end; margin:0;}
		.schButton .searchIcon{width:22px; height:22px; display:inline-block; font-size:0;}
		.schButton .searchIcon span{height:100%;width:100%;display:block;/* opacity: .7; */position:relative;} 
		.schButton .searchIcon span:before, .schButton .searchIcon span:after{content:''; display:block; position:absolute; top:0; left:0;  -webkit-transition:all .3s ease; transition: all .3s ease; }
		.schButton .searchIcon span:before{width:16px; height:16px; border:1px #fff solid; border-radius:100%;}
		.schButton .searchIcon span:after{width:1px; height:7px; background:#fff; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg); top:14px; left:17px;}
		.schButton .searchIcon.active{width:60px; font-family:'Noto Sans KR', sans-serif;}
		.schButton .searchIcon.active span:before{content:'검색'; width:60px; height:22px; border-radius:30px; background:#555; border:none !important; color:#fff; font-weight:300; font-size:12px; line-height:20px;}
		.schButton .searchIcon.active span:after{transform: scale(0);}		
		.schButton .searchIcon.active:hover span:before{background:#578ad5;}
		/* ^ 자동완성형 검색창 */
		#tbList{border-left:1px solid #eee;}
		.auto_complete {position:absolute;z-index:9999;width:626px;margin-top:0;background-color:#fff; box-shadow:0px 3px 5px rgba(0,0,0,.25); text-align:left; border-bottom:2px solid #888888; padding:10px; }
		.auto_complete > div {display:block;padding:5px;overflow:hidden;}
		.auto_complete > div:after {content:'';display:block;clear:left;visibility:hidden;height:0;}
		.auto_complete ul {display:inline-block;float:left;width:170px;height:auto;margin:8px;}
		.auto_complete li {font-size:13.5px;padding:5px 0;}
		.auto_complete li:first-child {padding-top:0;}
		.auto_complete dl {padding:0 10px;}
		.auto_complete dl dt {font-weight:600;font-size:13.5px;padding:5px 0;}
		.auto_complete dl dd {font-size:13px;color:#777;margin-bottom:10px;}
		.auto_complete a strong, .auto_complete .search_keyword {color:#ed1a3b;}
		.auto_complete .tbList {float:left;width:400px;}
		.auto_complete .auto_rlist { display:inline-block;float:left;width:390px;height:auto; border-left:1px solid #ccc;padding:0 10px;margin:8px;	}

/* -- 마우스 오버 -- */
	/* - 공통 */
	body > header.headerHover{background:#fff; border-bottom:1px solid #ddd;  }
	/* - 왼쪽 영역 */
	header.headerHover .header > div.left .home{background:url('../../images/2019/logo-dark.svg') center left / auto no-repeat !important;}
	header.headerHover .header > div.left .menu > li > a{color:#333;}
	/* - 오른쪽 영역 */
		header.headerHover .header > div.right .gotoEng{color:#333;}
		/* ^ 즐겨찾기 메뉴 */
		header.headerHover .header > div.right .popMenu > span > i{border:1px solid #555;}
		header.headerHover .header > div.right .popMenu > spa n > i.plus{border:none;}
		header.headerHover .header > div.right .popMenu > span > i.plus:before,
		header.headerHover .header > div.right .popMenu > span > i.plus:after{background:#578ad5; }
		/* ^ 전체메뉴 */
		header.headerHover .header > div.right .allMenu > span{background:#578ad5;}
		header.headerHover .header > div.right .allMenu:before{background:#555;}
		header.headerHover .header > div.right .allMenu:after{background:#555;}
		/* ^ 검색바 */
		header.headerHover .header > div.right .searchFrmWrap input[name="searchInput"]{background:rgba(0,0,0,.05); color:#333333;}
		header.headerHover .header > div.right .searchFrmWrap input::-webkit-input-placeholder{color:#333333;}
		header.headerHover .schButton .searchIcon span:before{border:1px #333 solid;}
		header.headerHover .schButton .searchIcon span:after{background:#333;}
		header.headerHover .schButton .searchIcon:hover span:before{border:1px #578ad5 solid; -webkit-transition:all .3s ease; transition: all .3s ease;}
		header.headerHover .schButton .searchIcon:hover span:after{background:#578ad5; -webkit-transition:all .3s ease; transition: all .3s ease;}

/* -- 테마 : black -- */
	/* - 공통 */
	body.black header{border-bottom:1px solid rgba(51,51,51,.1);  }
	/* - 왼쪽 영역 */
	body.black .header > div.left .home{background:url('../../images/2019/logo-dark.png') center right / auto no-repeat !important;}
	body.black .header > div.left .menu > li > a{color: rgba(0,0,0,.7);}
	/* - 오른쪽 영역 */
		/* ^ 즐겨찾기 메뉴 */
		body.black .header > div.right .popMenu > span > i{border: 1px solid rgba(0,0,0,.7);}
		body.black .header > div.right .popMenu > span > i.plus{border:none;}
		body.black .header > div.right .popMenu > span > i.plus:before,
		body.black .header > div.right .popMenu > span > i.plus:after{background:#578ad5; }
		/* ^ 전체 메뉴 */
		body.black .header > div.right .allMenu > span{background: rgba(87,138,213,.7);}
		body.black .header > div.right .allMenu:before{background: rgba(0,0,0,.7);}
		body.black .header > div.right .allMenu:after{background: rgba(0,0,0,.7);}
		/* ^ 검색바 */
		body.black .header > div.right .searchFrmWrap input[name="searchInput"]{background:rgba(0,0,0,.05); color:#333333;}
		body.black .header > div.right .searchFrmWrap input::-webkit-input-placeholder{font-family:'Nanum Gothic', sans-serif; color:#777;}
		body.black .schButton .searchIcon span:before{border: 1px rgba(0,0,0,.7) solid;}
		body.black .schButton .searchIcon span:after{background: rgba(0,0,0,.7);}
		body.black .schButton .searchIcon:hover span:before{border:1px #578ad5 solid; -webkit-transition:all .3s ease; transition: all .3s ease;}
		body.black .schButton .searchIcon:hover span:after{background:#578ad5; -webkit-transition:all .3s ease; transition: all .3s ease;}
		/* ^ 상단 SNS 채널(블로그,페이스북,트위터,유튜브) */
		body.black .gotoLink a:before{opacity:0.7;}
		body.black .gotoLink a.facebook:before{background:url('../../images/2019/controls.png') -92px -78px  / auto no-repeat;}
		body.black .gotoLink a.twitter:before{background:url('../../images/2019/controls.png') -101px -79px  / auto no-repeat;}
		body.black .gotoLink a.youtube:before{background:url('../../images/2019/controls.png') -119px -78px  / auto no-repeat;}
		body.black .gotoLink a.naverblog:before{background:url('../../images/2019/controls.png') -140px -78px  / auto no-repeat;}
		body.black .gotoLink a.instagram:before{background:url('../../images/2019/controls.png') -46px -96px  / auto no-repeat;}
		body.black .gotoLink a.english:before{background:url('../../images/2019/controls.png') -162px -78px  / auto no-repeat;}

/* -- 스크롤 했을 때 -- */
	/* - 공통 : 높이값을 100px에서 80px로 줄임 */
	body > header#whiteSkin-scroll{background:#fff !important; border-bottom:1px solid #ddd !important; height:80px !important; }
	header#whiteSkin-scroll .header{padding:10px 40px 10px 50px !important;}
	/* - 왼쪽 영역 */
	header#whiteSkin-scroll .header > div.left .home{background:url('../../images/2019/logo-dark.png') center right / auto no-repeat !important;}
	header#whiteSkin-scroll .header > div.left .menu > li > a{color:#333;}
	header#whiteSkin-scroll .menuList{width:100%; height:auto; position:Absolute; top:80px; left:0; background:#fbfbfb; padding:0 12%;}
	/* - 오른쪽 영역 */
		/* ^ 즐겨찾기 메뉴 */
		header#whiteSkin-scroll .header > div.right .popMenu > span > i{border:1px solid #555;}
		header#whiteSkin-scroll .header > div.right .popMenu > span > i.plus{border:none;}
		header#whiteSkin-scroll .header > div.right .popMenu > span > i.plus:before,
		header#whiteSkin-scroll .header > div.right .popMenu > span > i.plus:after{background:#578ad5; }
		/* ^ 전체 메뉴 */
		header#whiteSkin-scroll .header > div.right .allMenu > span{background:#578ad5;}
		header#whiteSkin-scroll .header > div.right .allMenu:before{background:#555;}
		header#whiteSkin-scroll .header > div.right .allMenu:after{background:#555;}
		/* ^ 검색바 */
		header#whiteSkin-scroll .header > div.right .searchFrmWrap input[name="searchInput"]{background:rgba(0,0,0,.05); color:#333333;}
		header#whiteSkin-scroll .header > div.right .searchFrmWrap input::-webkit-input-placeholder{color:#333333;}
		header#whiteSkin-scroll .schButton .searchIcon span:before{border:1px #333 solid;}
		header#whiteSkin-scroll .schButton .searchIcon span:after{background:#333;}
		header#whiteSkin-scroll .schButton .searchIcon:hover span:before{border:1px #578ad5 solid; -webkit-transition:all .3s ease; transition: all .3s ease;}
		header#whiteSkin-scroll .schButton .searchIcon:hover span:after{background:#578ad5; -webkit-transition:all .3s ease; transition: all .3s ease;}
/* ===== header 영역 : E ===== */

/* ===== footer 영역 : S ===== */
	footer{width:100%; height:auto; display:block;} 
	
/* -- footerBanner -- */
	.footerBanner{width:100%;height: auto;background:#f9f9f9;border-top:1px solid #ddd;padding:25px 50px;display: block;}
	.fbWrap{width:100%;height: auto;}/* footerBanner 감싸기 */
	.fbBox{width:100%;height: auto;display:flex;align-items: center;justify-content: flex-start;}/* footerBanner 콘텐츠 */
	/* - 배너 아이콘 : 국민의나라 정의로운 대한민국 */
	.mainSymbol{flex:none;height: auto;font-size:0;display: flex;align-items: center;justify-content: flex-start;}
	.mainSymbol:before{content:'';display:block;width:150px;height: 50px;background:url('../../images/2019/mainSymbol.png') 0 0 / auto no-repeat;}
	.mainSymbol:hover:before{background:url('../../images/2019/mainSymbol.png') 0 0px / auto no-repeat; transition:all .5s; -webkit-transition:all .5s;}
	/* - 배너 아이콘 : 국가상징 알아보기 */
	.mainFlag{flex:none;height: auto;font-size:0;}
	.mainFlag:before{float:right; content:''; display:block; width:124px; height:40px; margin:5px 0;  background:url('../../images/2019/mainFlag.png') 0 0 / auto no-repeat;}
	.mainFlag:hover:before{background:url('../../images/2019/mainFlag.png') 0 0px / auto no-repeat; transition:all .5s; -webkit-transition:all .5s;}
	/* - 배너 슬라이드 */
	.rbWrap{width:100%;height: auto;display:flex;}
	.rollBanner{flex:auto; }
	.rollBanner .slide-wrapper{flex:auto;height: 50px;margin: 0 auto;flex:9.6;vertical-align:top;position:relative;overflow:hidden;}
	.rollBanner .slide{width:120%;height: auto;display:block;position:absolute;}
	.rollBanner .slide li{  text-align: center;  font-size: 18px; float:left;}
	.rollBanner .slide li a{height:50px; display: block;}
	.rollBanner .slide li a:focus {border:1px dotted #555;}
	.rollBanner .slick-slide img{height:200%;}
		/* ^ 버튼 : 좌우 슬라이드 */	
		.rollBanner button{position:relative;overflow: visible;width: auto;height: auto;flex:none;padding: 0 19px;font-size:0;-webkit-transition:all .5s ease;transition: all .5s ease;}
		.rollBanner button > span{position:relative; overflow: visible; display:block; width:12px; height:25px; font-size:0; text-align:center; margin:0 auto; -webkit-transition:all .5s ease; transition: all .5s ease;}
		.rollBanner button > span:before{content:''; position:absolute; top:0; left:40%; height:50%; width:1px; background:#888888; -webkit-transform:skew(135deg, 0deg); transform:skew(135deg, 0deg);}
		.rollBanner button > span:after{content:''; position:absolute; bottom:0; left:40%; height:50%; width:1px; background:#888888; -webkit-transform:skew(-135deg, 0deg); transform:skew(-135deg, 0deg);}
		.rollBanner button.rollBanner-next{ transform:rotate(180deg);	-webkit-transform:rotate(180deg);}
		.rollBanner button:hover span{width:70px;}
		.rollBanner button:hover span:before, .rollBanner button:hover span:after{background:#578ad5; left:10%;}
		.rollBanner button > span > i{display:block; position:absolute; left:2px; top:12.5px; width:0; height:1px; background:#578ad5;  }
		.rollBanner button:hover > span > i{width:100%;}
		.rollBanner .slick-slide{margin-right:10px;}
		/* - 재생·정지 아이콘 */
		.rbWrap{padding: 0 20px;}
		.rbWrap > button.slide-controls{display: inline-flex;align-items: center;justify-content: center;font-size:0;text-align: center;vertical-align:top;margin: 0 auto;padding: 0 17px;}
		.rbWrap > button.slide-controls > i{display:block; width:17px; height:25px; position:relative; font-size:0;}
			/* ^ 정지 */
			.rbWrap > button.slide-pause i:before, .rbWrap > button.slide-pause i:after{content:''; display:block; position:absolute; background:#999; width:1px; height:100%; top:0;}
			.rbWrap > button.slide-pause i:before{left:0;}
			.rbWrap > button.slide-pause i:after{right:0;}
			.rbWrap > button.slide-pause:hover i:before, .rbWrap > button.slide-pause:hover i:after{background:#578ad5;  transition: all 1s;}
			/* ^ 재생 */
			.rbWrap > button.slide-play{display:none;}
			.rbWrap > button.slide-play i:before{content:''; display:block; position:absolute; top:0; left:0; border-top:12px solid transparent; border-left:15.5px solid #999; border-bottom:12px solid transparent}
			.rbWrap > button.slide-play:hover i:before{ border-left:15.5px solid #578ad5; transition: all 1s;}
		.rbWrap .slick-dots{display:none !important;}

/* -- footerContent -- */
.fbmobile {display:none;} /* 모바일에서만 나오도록 처리함 */
.footerContent{width:100%; height:auto; background:#444444;}
.fcWrap{width:100%; height:100%; display:flex; flex-wrap:wrap;}/* footerContent 감싸기 */
.fcWrap > div:after{content:''; position:absolute; right:0; top:50px; bottom:50px; width:1px; height:auto; display:block; background:#565656;}
.fcWrap > div:last-child:after{display:none;}
.footCnt{width:25%; height:280px; display:block; padding:70px 50px; position:relative;}/* footerContent 콘텐츠 */
.fcWrap > div:last-child{padding:70px 50px 50px 50px;}/* footerContent 콘텐츠 */
.footCnt .cntHead{font-size:20px; color:#d0d0d0; font-family:'Noto Sans KR', sans-serif; font-weight:500; padding-bottom:30px;}
	/* - 이용안내 */
	.siteInfo .cntBox{width:100%; display:flex; flex-wrap:wrap;}
	.siteInfo .cntBox li{ width:33.33%; display:block; padding-bottom:13px;}
	.siteInfo .cntBox li a{font-size:14px; color:#999999; font-family:'Noto Sans KR', sans-serif; font-weight:400;}
	.siteInfo .cntBox li a:hover{color:#fff !important;}
	.siteInfo .cntBox li:nth-child(2) a{color:#578ad5;}
	.siteInfo .cntBox li:last-child{padding-bottom:0; flex:auto;}
	/* - 오시는길 */
	.homeInfo .cntBox{width:100%; display:block;}
	.homeInfo .cntBox li{position:relative; font-size:14px; color:#999999; font-family:'Noto Sans KR', sans-serif; font-weight:400; width:100%; display:block; padding-bottom:13px; padding-left:21px; }
	.homeInfo .cntBox li:before{content:''; display:inline-block; width:10px; height:13px; position:Absolute; left:0;}
	.homeInfo .cntBox li:nth-child(1):before{background:url('../../images/2019/controls.png') 0 -61px / auto no-repeat; top:5px;}
	.homeInfo .cntBox li:nth-child(2):before{width:13px; background:url('../../images/2019/controls.png') -24px -61px / auto no-repeat; top:5px;}
	.homeInfo .cntBox li:nth-child(3):before{width:13px; background:url('../../images/2019/controls.png') -11px -61px / auto no-repeat; top:5px;}
	/* - 사이트 바로가기 */
	.goSite .cntBox{width:100%; display:block;}
	.goSite .cntBox li{font-size:14px; color:#999999; font-family:'Noto Sans KR', sans-serif; font-weight:500; width:100%; display:block; padding-bottom:20px;}
	.goSite .cntBox{width:100%; display:flex;}
	.goSite .cntBox li{position:relative; font-size:14px; color:#999999; font-family:'Noto Sans KR', sans-serif; font-weight:400; width:auto;}
	.goSite .cntBox li:first-child{flex:6}
	.goSite .cntBox li:last-child{flex:4;}
	.goSite .cntBox li a, .goSite .cntBox li button{display:block; font-size:14px; color:#999999; font-family:'Noto Sans KR', sans-serif; font-weight:400; padding-top:1px;}
	.goSite .cntBox li a:focus, .goSite .cntBox li button:focus {border:1px dotted #fff;}
	.goSite .cntBox li span{width:100%; display:block; padding-bottom:13px; position:relative;  padding-left:22px; }
	.goSite .cntBox li span:hover button{color:#fff;}
	.goSite .cntBox li span:before{content:''; display:inline-block; width:13px; height:13px; position:Absolute; left:0;}
	.goSite .cntBox li span.pop:before{ background:url('../../images/2019/controls.png') -38px -60px / auto no-repeat; top:5px;}
	.goSite .cntBox li span.pop:hover:before{ background:url('../../images/2019/controls.png') -85px -59px / auto no-repeat; top:5px;}
	.goSite .cntBox li span.kids:before{ background:url('../../images/2019/controls.png') -53px -60px / auto no-repeat; top:5px;}
	.goSite .cntBox li span.kids:hover:before{ background:url('../../images/2019/controls.png') -100px -59px / auto no-repeat; top:5px;}
	.goSite .cntBox li span.kids:hover a{color:#f1d729;}
	.goSite .cntBox li span.eng:before{  width:14px; height:14px; background:url('../../images/2019/controls.png') -68px -59px / auto no-repeat; top:5px;}
	.goSite .cntBox li span.eng:hover:before{  width:14px; height:14px; background:url('../../images/2019/controls.png') -115px -59px / auto no-repeat; top:5px;}
	.goSite .cntBox li span.eng:hover a{color:#fb802d;}
	/* - 사이트 마크 */
	.markInfo{width:100%; height:100%; display:block; position:relative;}
	.markInfo .cntBox{width:100%; display:flex;}
	.markInfo p{font-size:14px; color:#999; font-family:'Noto Sans KR', sans-serif; font-weight:400;}
	.markInfo .cntBox{position:Absolute; height:auto; width:100%; bottom:0; left:0; }
	.markInfo .cntBox li{position:relative; width:auto; display:flex; }
	/* - sns 바로가기 */
	.markInfo .cntBox li.sns{flex:5.8;}
	.markInfo .cntBox li.sns a{width:38px; height:38px; display:block; float:left; flex-wrap:wrap; text-align:center; margin-right:10px; background:#3d3d3d; border-radius:100%; font-size:0;}
	.markInfo .cntBox li.sns a:before{content:''; display:inline-block; opacity:.5;}
	.markInfo .cntBox li.sns a.facebook:before{width:7px; height:15px; margin-top:11px; background:url('../../images/2019/controls.png') 0 -78px  / auto no-repeat;}
	.markInfo .cntBox li.sns a.twitter:before{width:15px; height:13px; margin-top:13px; background:url('../../images/2019/controls.png') -9px -79px  / auto no-repeat;}
	.markInfo .cntBox li.sns a.youtube:before{width:19px; height:14px; margin-top:12px; background:url('../../images/2019/controls.png') -26px -78px  / auto no-repeat;}
	.markInfo .cntBox li.sns a.naverblog:before{width:19px; height:15px; margin-top:12px; background:url('../../images/2019/controls.png') -47px -78px  / auto no-repeat;}
	.markInfo .cntBox li.sns a.instagram:before{width:15px; height:15px; margin-top:8px; background:url('../../images/2019/controls.png') -26px -96px  / auto no-repeat;}
	.markInfo .cntBox li.sns a:hover:before{opacity:1;}
	/* - 웹와치 & 오픈누리 */
	.markInfo .cntBox li.lisence{flex:4.2}
	.markInfo .cntBox li.lisence a{font-size:0; display:block;}
	.markInfo .cntBox li.lisence a.webWatch{margin-right:15px; width:59px; height:38px; background:url('../../images/2019/ico-webWatch.png') center center  / auto no-repeat; }
	.markInfo .cntBox li.lisence a.openNuri{margin-top:4px; width:71px; height:30px; background:url('../../images/2019/ico-openNuri.png') center center  / auto no-repeat; }
	.markInfo .cntBox li a span{font-size:0;}

/* ===== footer 영역 : E ===== */

/* ===== breadScrumb 영역 : S ===== */

.breadScrumb{display:flex; align-items:flex-end;}
.breadScrumb .bsHome{font-size:0; display:block; width:12px; height:11px;  background:url('../../images/2019/bsHome.png') center center  / auto no-repeat;}
.breadScrumb > ul{display:flex; align-items:center; margin-left:auto; margin-bottom:5px; flex:none;}
.breadScrumb > ul > li{display:flex; align-items:center; font-size:12px; color:#888888; line-height:1.5em;}
.breadScrumb > ul > li > a{color:#888;}
.breadScrumb > ul > li > a:hover{cursor:pointer;}
.breadScrumb > ul > li:last-child > a{color:#444;}
.breadScrumb > ul > li:after{content:''; width:1px; height:12px; margin:0 13px 0 15px; transform:rotate(30deg); display:block; background:#bbbbbb; }
.breadScrumb > ul > li:last-child:after{display:none;}
/* ===== breadScrumb 영역 : E ===== */

@-ms-keyframes allMenuBefore {
	0% {width:20px;}
	50% { width:0px;}
	100% { width:20px;}
}
@keyframes allMenuBefore {
	0% {width:20px;}
	50% { width:0px;}
	100% { width:20px;}
}

@-ms-keyframes allMenuSpan {
	0% {width:50%;}
	50% { width:20px;}
	100% { width:50%;}
}
@keyframes allMenuSpan {
	0% {width:50%;}
	50% { width:20px;}
	100% { width:50%;}
}

@-ms-keyframes plusIcon {
	0% {transform:rotate(0deg);}
	50% { transform:rotate(360deg);}
	100% { transform:rotate(0deg);}
}
@keyframes plusIcon {
	0% {transform:rotate(0deg);}
	50% { transform:rotate(360deg);}
	100% { transform:rotate(0deg);}
}

@-ms-keyframes popMenuIcon {
	0% {background:transparent;}
	50% { background:rgba(87,138,213,.3);}
	100% { background:transparent;}
}
@keyframes popMenuIcon {
	0% {background:transparent;}
	50% { background:rgba(87,138,213,.3);}
	100% { background:transparent;}
}

@-ms-keyframes hoverOn {
	0% {width:0;}
	50% { width:25px; margin-left:15px;}
	100% { width:25px; margin-left:8px}
}
@keyframes hoverOn {
	0% {width:0;}
	50% { width:25px; margin-left:15px;}
	100% { width:25px; margin-left:8px}
}

/* 상단 SNS 채널(블로그,페이스북,트위터,유튜브)  및 영문 홈페이지 링크 추가 : 20190925 */
.gotoLink {display:flex; align-items:center; padding:0 10px;}
.gotoLink a{width:30px; height:30px; display:block; float:left; flex-wrap:wrap; text-align:center; margin-right:5px; border-radius:100%; font-size:0; -webkit-transition:all .5s ease; transition: all .5s ease;}
.gotoLink a:before{content:''; display:inline-block; opacity:.9;}
.gotoLink a.facebook:before{width:7px; height:15px; margin-top:8px; background:url('../../images/2019/controls.png') 0 -78px  / auto no-repeat;}
.gotoLink a.twitter:before{width:15px; height:13px; margin-top:9px; background:url('../../images/2019/controls.png') -9px -79px  / auto no-repeat;}
.gotoLink a.youtube:before{width:19px; height:14px; margin-top:8px; background:url('../../images/2019/controls.png') -26px -78px  / auto no-repeat;}
.gotoLink a.naverblog:before{width:19px; height:15px; margin-top:8px; background:url('../../images/2019/controls.png') -47px -78px  / auto no-repeat;}
.gotoLink a.instagram:before{width:15px; height:15px; margin-top:7px; background:url('../../images/2019/controls.png') -26px -96px  / auto no-repeat;}
.gotoLink a.english:before{width:19px; height:15px; margin-top:9px; background:url('../../images/2019/controls.png') -70px -78px  / auto no-repeat;}
.gotoLink a:hover:before{opacity:1;}
	/* 마우스 오버 */
	header.headerHover .header .gotoLink a.facebook:before{background:url('../../images/2019/controls.png') 0 -78px / auto no-repeat !important;}
	header.headerHover .header .gotoLink a.twitter:before{background:url('../../images/2019/controls.png') -9px -79px / auto no-repeat !important;}
	header.headerHover .header .gotoLink a.youtube:before{background:url('../../images/2019/controls.png') -26px -78px / auto no-repeat !important;}
	header.headerHover .header .gotoLink a.naverblog:before{background:url('../../images/2019/controls.png') -47px -78px / auto no-repeat !important;}
	header.headerHover .header .gotoLink a.instagram:before{background:url('../../images/2019/controls.png') -26px -96px / auto no-repeat !important;}
	header.headerHover .header .gotoLink a.english:before{background:url('../../images/2019/controls.png') -70px -78px / auto no-repeat !important;}
	header.headerHover .header .gotoLink a {background-color:#929292; -webkit-transition:all .5s ease; transition: all .5s ease;}
	header.headerHover .header .gotoLink a:hover {background-color:#559def; -webkit-transition:all .5s ease; transition: all .5s ease;}
	/* 스크롤 했을 경우 */
	header#whiteSkin-scroll .header .gotoLink a {background-color:#929292;}
	header#whiteSkin-scroll .header .gotoLink a:hover {background-color:#559def;}
	header#whiteSkin-scroll .header .gotoLink a:before{opacity:.9 !important;}
	header#whiteSkin-scroll .header .gotoLink a:hover:before{opacity:1 !important;}
	header#whiteSkin-scroll .header .gotoLink a.facebook:before{background:url('../../images/2019/controls.png') 0 -78px  / auto no-repeat !important;}
	header#whiteSkin-scroll .header .gotoLink a.twitter:before{background:url('../../images/2019/controls.png') -9px -79px  / auto no-repeat !important;}
	header#whiteSkin-scroll .header .gotoLink a.youtube:before{background:url('../../images/2019/controls.png') -26px -78px  / auto no-repeat !important;}
	header#whiteSkin-scroll .header .gotoLink a.naverblog:before{background:url('../../images/2019/controls.png') -47px -78px  / auto no-repeat !important;}
	header#whiteSkin-scroll .header .gotoLink a.instagram:before{background:url('../../images/2019/controls.png') -26px -96px  / auto no-repeat !important;}
	header#whiteSkin-scroll .header .gotoLink a.english:before{background:url('../../images/2019/controls.png') -70px -78px  / auto no-repeat !important;}
	
/* ie에서 유튜브 지원안내 내용 표기 : 20200306 */
.ytbNotice{background:#f5d562; color:#333; font-size:15px; padding:11px 0; display:block; text-align:center; margin:0 auto;}
.ytbNotice > span{display:block; margin:0 auto;}


/* 상단팝업 20200311 */
/*.top-popup.openPopup{display:block;} */
.top-popup{font-family:'Noto Sans KR', sans-serif; margin:0 auto;display:none;text-align:center;background-color:#f7e0ca; z-index:999;}
.top-popup .topContainer{display:flex; align-items:Center; max-width:85%; width:100%;margin:0 auto;}
.top-popup .leftpop{flex:auto; height:80px;display:flex;justify-content:center;align-items:center;overflow:hidden;}
.top-popup .leftpop .popimgpc{padding-top:0;}
.top-popup .leftpop .popimgm{display:none;}

.top-popup .leftpop .Shortcuts{flex:none; display:flex; padding:0px 20px 0px 25px;cursor:pointer;}
.top-popup .leftpop .Shortcuts a{background-color:#b99d8b;align-items:center; display:flex; border-radius:20px;text-align:left;font-size:16px;line-height:21px;letter-spacing:0px;color:#ffffff;padding:5px 8px 5px 10px;margin:0 10px;}
.top-popup .leftpop .Shortcuts a span{content:'';display:block;position:relative;border-radius:20px;background:#816e62;width:20px;height:20px;float:right;margin-left:10px;}

.top-popup .leftpop .Shortcuts span::after{content:'';background:#fff;width:1px;height:8px;display:block;position:absolute;transform:rotate(135deg);left:10px;top:3px;}
.top-popup .leftpop .Shortcuts span::before{content:'';background:#fff;width:1px;height:8px;display:block;position:absolute;transform:rotate(-135deg);left:10px;top:8px;}

.top-popup .rightpop{flex:none; height:80px;display:flex;justify-content:center;align-items:center;font-size:14px;}
.top-popup .rightpop .topclose {display:flex; align-items:center; justify-content:center; color:#555; background:rgba(255,255,255,.8);border-radius:20px;width:70px;padding:5px 0 5px 0; margin-left:15px;text-align:center;line-height:1;cursor:pointer;}
.top-popup .rightpop .todayclose{display:flex; align-items:center;}
.top-popup .rightpop .todayclose label{width:max-content;cursor:pointer;letter-spacing:0;}
.top-popup .rightpop .todayclose input{cursor:pointer; margin-right:5px;}


.bgbg{height:500px;margin:0 auto;background-color:darkgoldenrod;}


/* ==== 1400px 이하 일때 (뷰포트 1400px 기준) ==== */
@media only screen and (max-width:1400px){
	.top-popup .topContainer{max-width:100%; padding:0 30px;}
    .top-popup .rightpop .todayclose{padding-left:5px;}
    .top-popup .leftpop .popimgpc{padding-top:8px; width:57%;}
    .top-popup .leftpop .Shortcuts a{margin: 0px 6px;}
}

/* ==== 1200px 이하 일때 ==== */ 
@media only screen and (max-width:1200px) {
	.top-popup .topContainer{padding:0;}
    .top-popup{flex-direction: column;padding:0px;}
	.top-popup .topContainer{flex-direction: column;}
    .top-popup .leftpop{width:100%; padding:0 24px 0 30px;}
    .top-popup .leftpop .Shortcuts{flex:auto; justify-content:flex-end; padding:0px 0px 0px 15px;}
    .top-popup .rightpop{height:40px;width:100%;background-color:#816e62;color:#fff;justify-content:flex-end;padding-right:30px;}
    .top-popup .rightpop .topclose{background-color: #9a8b81;  color:#fff;}
}
/* ==== 1000px 이하 일때 ==== */ 
@media only screen and (max-width:1100px) {
    .top-popup .leftpop {height: 73px; padding:0 14px 0 20px;}
    .top-popup .leftpop .popimgpc{flex:auto; width:53.5vw;}
    .top-popup .leftpop .Shortcuts{flex:none;}
    .top-popup .rightpop{padding-right:20px;}
}
/* ==== 900px 이하 일때 ==== */ 
@media only screen and (max-width:900px) {
.top-popup .leftpop {width:100%;height:90px; padding:0; flex-direction:column;}
.top-popup .leftpop .popimgpc{display:none;}
.top-popup .leftpop .popimgm{display:block;}
.top-popup .leftpop .Shortcuts{display:flex; padding:10px 0px 0px 0px;}
.top-popup .rightpop{justify-content:center;padding:0px;}
}
/* ==== 900px 이하 일때 ==== */ 
@media only screen and (max-width:450px) {
    .top-popup .leftpop .Shortcuts a{font-size:3.556vw; /* font-size:16px; */}	
}
/* ==== 900px 이하 일때 ==== */ 
@media only screen and (max-width:350px) {
.top-popup .leftpop .Shortcuts a{font-size:12px;}
}