@charset "utf-8";


/* ==== 1600px 이하 일때 ==== */@media screen and (max-width:1600px) {
	
	body{ -webkit-transition:all .5s ease; transition: all .5s ease;}
	.whiteSpace40{padding: 0 1.563vw}
	header > .container{width:224px;}
	.topHead{padding: 0 4.010vw 0 224px; }
	footer{margin: 0 4.010vw 0 224px; }
	.subContainer{margin: 4.531vw 4.010vw 0 224px; }
	
	/* 팝업 */
	.daily-popup .popImg{width:14.063vw; max-height:18.688vw; /* width:225px; height:299px; */}
	.daily-popup .popupWrap{max-width: 37.500vw;/* max-width: 600px;(viewport:1600px) */}

} /* 1600px : end */


/* ==== 1400px 이하 일때 ==== */ @media screen and (max-width:1400px) {
	.whiteSpace40{padding:0 20px;}
	.subContainer{margin: 61px 0 0 196px; border-right:0;}
	/* -- header -- */
	header > .container{width:196px;}
	header.menuOpen .menuList .sub > li > a{line-height:28px;}
	header.menuOpen .menuList > li > i.bar{top:77px;}
		.homeLogo{ height:61px;}
		/* - 왼쪽메뉴 */
		.menuList .title{font-size:10px;}
		.menuList > li{padding-top:13px;}
		/* - 주요메뉴 */
		.division .list > li{margin-bottom:23px;}
		/* - copyright */
		.copyright{line-height:10px;}

	/* -- topHead -- */
	.topHead{padding: 0 0 0 196px; }
	footer{margin: 0 0 0 196px; }
	.topHead{height:61px;}
		/* - 검색바 */
		.searchFrmWrap input[name="searchTerm"]{font-size:10px;}
		.searchFrmWrap.active input[name="searchTerm"]:active{width:13.021vw; /* width:250px; */ }
			/* ^ 아이콘 */
			.searchIcon{padding-right:10px;}
			.searchIcon span{width:14px; height:14px;}
			.searchIcon span:before{width:9px; height:9px;}
			.searchIcon span:after{height:5px; top:8px; left:11px;}
		/* - quickMenu */
		.quickMenu{width:auto;height:60px;display:flex;align-items:center;padding: 0 20px 0 0;transition: 0s all;}
			/* ^ 한국어 사이트 바로가기 */
			.goKor{width:auto; height:auto; border:none; margin-left:10px;}
			/* ^ 페이지 공유 */
			.localNav{margin:0; display:flex; align-items:center; width:auto; margin-left:10px;}
			.localNav > li{margin:0; display:flex; flex-direction: row;}
			.localNav > li:first-child{margin-right:10px;}
			.localNav .share{width:auto;}
			.localNav .share > .cnt{flex-direction: row; padding:5px 2px 5px 7px;}
			.localNav > li > a{width:36px;}
			.localNav .share > a:before{display:block;}
			.localNav .share.active{width:auto;}
			.localNav .share.active > .cnt{width:auto; padding-bottom:0 ; margin-left: -3px;}
			.localNav .share > .cnt > li{margin:auto 5px auto auto}
		/* - 스크롤 맨위로 */
		.pageTop{display:none;}
	/* - 국가상징  */
	.nationalSymbols{margin-right: 224px;}
	/* -- footer -- */
	footer{border-right:0}
	footer .local-site-link{width:164px;}
	.local-site-link .current, .local-gov-link .link a{font-size:10px; letter-spacing:0.4px;}
	.local-gov-link{padding:0 20px;}

} /* 1400px : end */


/* ==== 1200px 이하 일때 ==== */ @media screen and (max-width:1200px) {

	*{outline:none;}
	.topHead, footer{margin: 0; }
	.subContainer{margin: 112px 0 0 0;padding: 7.167vw 0 0 0;/* padding:80px 0 0 0; */border-right:0;min-height:auto;}
	.tabVer{display:block;}

	/* -- header(모바일용) -- */
	header{width:100%; height:auto; }
	header > .container, .division, .menuOther{display:none;}
	.mobile-header{position:relative; width:100%; height:61px; z-index:99; display:flex; align-items:center; background:#fff; border-bottom:1px solid #e1e1e1;  padding:0 6px 0 16px;}
		/* -- 로고 */
		.mHomeLogo{width:160px; height:35px; margin-right:auto;}
		.mHomeLogo > a{width:100%; max-width:100%; height:100%; display:block; font-size:0; background:url('../../images/2019/logo.svg') center center / contain no-repeat;}
		/* -- Btn (공통) */
		.mobile-button{flex:auto; text-align:right; margin:0;}
		.mBtn{display:block; width:auto; height:100%;}
		/* -- 메뉴 */
			/* - Btn */
			.mMenuBtn{width:42px; height:42px; text-align:center; margin:0 auto; z-index:9999; margin:0; }
			.mMenuBtn span{width:22px; height:22px; position:relative; overflow:hidden; display:flex; font-size:0; align-items:center; margin:0 auto;}
			.mMenuBtn span:before, .mMenuBtn span:after{content:''; position:absolute; width:100%; height:1px; left:0; display:block; background:#777; -webkit-transition:all .3s ease; transition: all .3s ease;}
			.mMenuBtn span:before{top:0;}
			.mMenuBtn span:after{bottom:0;}
			.mMenuBtn span > i{width:50%; height:1px; background:#1da1f2; display:block; }
				/* ^  메뉴 닫기 */
				.mMenuBtn.close span > i{background-color: transparent; transform: scale(0);}
				.mMenuBtn.close span{width:30px; height:30px; }
				.mMenuBtn.close span:before{top:50%; border:none; background:#777; transform:rotate(225deg);-webkit-transform:rotate(225deg);}
				.mMenuBtn.close span:after{top:50%; left:0;transform:rotate(-225deg);-webkit-transform:rotate(-225deg);}
			/* - List */
			.mobile-menu{display:none; position:fixed; width:100%; height:calc(100%); /* min-height:100vh; */ top:0; left:0; background:rgba(255,255,255,.95); z-index:998;}
			.mMenu{width:100%; padding:68px 30px 0 30px; }
			.mMenu .menuList{overflow:hidden;}
			.mMenu .menuList > li{padding-top:30px;}
			.menuList .title{font-size:14px;}
			.mMenu .menuList .title{flex:auto; display:flex; align-items:center; color:#222;}
/* 			.mMenu .menuList .title:before{content:''; display:block; width:0; height:11px;  background:url('../../images/2019/controls.png') 0 -44px / auto no-repeat;  -webkit-transition:all .3s ease; transition: all .3s ease;} */
			.mMenu .menuList .sub{width:0; height:0; visibility:hidden;}
				/* ^ 클릭 */
				.mMenu.open .menuList .active .sub{width:100%; height:auto; visibility:visible;}
				.mMenu.open .menuList .sub > li{visibility: visible;  max-height:22px; margin-bottom:13px; -webkit-transition:all .5s ease; transition: all .5s ease;}
				.mMenu.open .menuList .active .title{padding-bottom:6px; margin-bottom:30px;}
				.mMenu.open .menuList .active .title > span.tabVer{display:inline-flex;align-items:center;justify-content:flex-start;margin-right: 16px;width: 35px;position: relative;}
				.mMenu.open .menuList .active .title > span.tabVer:after{content:'';position:absolute;top:5px;left: 1px;width: 30px;height:1px;display:block;background: #888;}
				.mMenu.open .menuList .active .title > span.tabVer:before{content:'';position:absolute;top: 1px;right: 0;width: 9px;height: 9px;display:block;background: #e4e4e4;border-radius:100%;}
				
				.mMenu.open .menuList .active .title > span.tabVer > i{position:relative;width: 7px;height: 11px;}
				.mMenu.open .menuList .active .title > span.tabVer > i:before,
				.mMenu.open .menuList .active .title > span.tabVer > i:after{content:'';width:1px;height:7px;background: #888;display:block;position:absolute;left: 3px;}
				.mMenu.open .menuList .active .title > span.tabVer > i:before{top: 0;transform:rotate(45deg);}
				.mMenu.open .menuList .active .title > span.tabVer > i:after{top: 4px;transform:rotate(-45deg);}
				.mMenu.open .menuList .active .title:before{width:35px; margin-right:16px;}
				.mMenu.open .menuList .active .title:after{width:100%; bottom:0; top:inherit; }
				.mMenu.open .menuList .sub > li > a{position:relative;color:#444;font-size: 18px;font-weight:400;letter-spacing: 0.5px;}
			/* - 이용안내 메뉴 */
			.mSiteInfo{position:absolute; bottom:0; width:100%; height:auto; padding:20px 15px;  display:flex; align-items:center; flex-wrap:wrap;}
			.mSiteInfo .info, .mSiteInfo .site{height:auto; display:flex; align-items:center;}
			.mSiteInfo .info{flex:auto; }
			.mSiteInfo .info > a{color:#999999;font-size: 13px;font-weight:400;letter-spacing:1px;display:flex;align-items:center;}
			.mSiteInfo .info > a:after{content:''; display:block; margin:0 9px; width:1px; height:7px; background:#bbb; }
			.mSiteInfo .info > a:last-child:after{display:none;}
			.mSiteInfo .site > a{width: 40px;height: 40px;display:flex;align-items:center;font-size:0;border-radius:100%;text-align:center;margin:0 auto;}
			.mSiteInfo .site > a > i{ display:block;  text-align:center; margin:0 auto;}
			.mSiteInfo .site .tweetSite{ background:#1da1f2; margin-right:5px;}
			.mSiteInfo .site .tweetSite > i{width: 15px;height: 13px;background: url('../../images/2019/icon-twitter.svg') center center / contain no-repeat;}
			.mSiteInfo .site .koreanSite{background:#656565;}
			.mSiteInfo .site .koreanSite > i{width: auto;height: auto;color: #fff;font-size: 11px;font-style: normal;text-align: center;line-height: 1;letter-spacing: 0.5px;/* background:url('../../images/2019/controls.png') -59px -44px / auto no-repeat; */font-family: 'Questrial';}
		
		/* -- 검색 */
		.searchFrmWrap, .searchFrmWrap input[name="searchTerm"]{width:100%; font-size:12px;}
		.searchFrmWrap.active input[name="searchTerm"]{width:100%;}
		.search{width:100%; height:100%; display:flex; align-items:center;}
		.searchBtn{display:none;}
		.searchFrm{margin-left:0;}
		.searchIcon span{width:24px; height:24px;}
		.searchIcon span:before{width:18px; height:18px;}
		.searchIcon span:after{height:8px; top:16px; left:19px;}
			/* - Btn */
			.mSearchBtn.searchIcon{width:42px; height:42px; padding-right:0;}
			.mSearchBtn.searchIcon span{width:24px; height:24px; margin:0 auto;}
			.mSearchBtn.searchIcon span:before{width:18px; height:18px; border:1px #777 solid;}
			.mSearchBtn.searchIcon span:after{height:9px; top:16px; left:19px; background:#777;}
				/* ^ Btn 닫기 */
				.mSearchBtn.close span{width:30px; height:30px; }
				.mSearchBtn.close span:before{width:1px; height:100%; left:50%; border:none; background:#777; transform:rotate(225deg);-webkit-transform:rotate(225deg);}
				.mSearchBtn.close span:after{width:1px; height:100%; top:0; left:50%;transform:rotate(-225deg);-webkit-transform:rotate(-225deg);}
		/* -- 국가상징  */
		.nationalSymbols{ display:none;}
	/* -- mobile-topHead -- */
	.mobile-topHead{display:block; width:100%; height:auto; padding:0 6px; background:#fff; border-bottom:1px solid #e1e1e1;}
	.mobile-topHead > .container{width:100%; height:51px; display:flex; align-items:center;}
	.mobile-topHead .shareBox{flex:auto; text-align:right; margin:0;}
	.mobile-topHead .share{display:flex; align-items:center;float:right;}
	.mobile-topHead .share > li{display:block; width:42px; height:42px;}
	.mobile-topHead .share > li > a{font-size:0; display:flex; align-items:center; text-align:center; margin:0 auto; width:100%; height:100%;}
	.mobile-topHead .share > li > a:before{content:'';width:22px;height:22px;display:block;margin:0 auto;/* background:url('../../images/2019/controls.png') no-repeat; */}
	.mobile-topHead .share > li:nth-child(1) > a:before{background: url('../../images/2019/icon-facebook.svg') center center / auto no-repeat;}
	.mobile-topHead .share > li:nth-child(2) > a:before{background: url('../../images/2019/icon-twitter-02.svg') center center / auto no-repeat;}
	.mobile-topHead .share > li:nth-child(3) > a:before{background: url('../../images/2019/icon-copyURL.svg') center center / auto no-repeat;}
	.mobile-topHead .share > li > a{font-size:0;}
	.mobile-topHead .backPage{font-size:0; display:flex; align-items:center; padding:10px;}
	.mobile-topHead .backPage i{position:relative; display:flex;align-items:center; width:32px; height:22px;}
	.mobile-topHead .backPage i:before,
	.mobile-topHead .backPage i:after{content:''; display:block; width:1px; height:11px; position:absolute; left:5px; background:#bbb;}
	.mobile-topHead .backPage i:before{transform:skew(135deg, 0deg);  top:0;}
	.mobile-topHead .backPage i:after{transform:skew(-135deg, 0deg);  bottom:0;}
	.mobile-topHead .backPage b{display:block; width:100%; height:1px; background:#bbb;  }
	
	/* -- topHead -- */
	.topHead{position:fixed; display:none; top:60px !important; z-index:999; right:0; width:100%; background:#fff; padding:0; transition:none; -webkit-transition:none;}
	.topHead > .left{display:none;}
	.topHead .right{border-left:0; border-right:0; border-top:1px solid #e1e1e1; background:#f9f9f9;}
	/* -- quickMenu -- */
	.quickMenu{display:none;}
	
	/* -- 팝업 -- */
	.daily-popup .popImg{width:20.833vw; max-height:27.667vw; /* width:250px; height:299px; */}
	.daily-popup .popupWrap{max-width: 50vw;/* max-width: 600px;(viewport:1200px) */}

} /* 1200px : end */


/* ==== 700px 이하 일때 (뷰포트 414px 기준) ==== */ @media screen and (max-width:700px) {
	.whiteSpace40{padding:0 6.039vw; /* padding:0 25px */}
	.subContainer{min-height:570px;}
	/* 팝업  */
	.daily-popup .popupWrap{flex-direction:column; align-items:flex-end;}
	/* .daily-popup .popupWrap{flex-direction:column-reverse; align-items:flex-end;} */
	.daily-popup .popupWrap > section{margin-bottom:10px;}
	/* -- header -- */
	header{width:100%; height:auto; }
	header:after{content:''; width:100%; height:2.415vw; /* height:10px; */ display:block; background:linear-gradient(rgba(0,0,0,.05) 0%, rgba(0,0,0,.0) 70% , rgba(0,0,0,.0) 100%);}

	/* -- 메뉴 -- */
	.menuList .title{font-size:2.899vw; /* font-size:12px; */}
	.mMenu{    padding: 21.256vw 6.039vw 0 6.039vw; /* padding: 88px 25px 0 25px;  */ }
	.mMenu .menuList > li{padding-top:8.454vw; /* padding-top:35px; */}
	.mMenu.open .menuList .sub > li{max-height:8.696vw; /* max-height:36px; */}
	.mMenu.open .menuList .sub > li > a{font-size:4.348vw; /* font-size:18px; */}
	.mSiteInfo{padding:4.831vw; /* padding:20px; */}
	.mSiteInfo .site > a{width:9.662vw; height:9.662vw; /* width:40px; height:40px; */}
	.mSiteInfo .site .koreanSite > i{font-size:10px;}
	.mSiteInfo .site .tweetSite{margin-right:1.449vw; /* margin-right:6px;  */}
	.mSiteInfo .site .tweetSite > i{width:3.623vw; height:3.140vw; /* width:15px; height:13px; */}
	.mSiteInfo .info > a{font-size:2.899vw; letter-spacing:0.242vw; /* font-size:12px; letter-spacing:1px; */}

	/* -- footer -- */
	footer .local-site-link, footer .local-gov-link{display:none;}
	footer{height:auto; display:flex; flex-direction:column; margin-top:-2.415vw; /* margin-top:-10px; */ background:transparent; } 
	footer:before{content:''; width:100%; height:2.415vw; /* height:10px; */ display:block; background:linear-gradient(rgba(0,0,0,.0) 0%,rgba(0,0,0,.05) 100%);}
	.mobile-footer{width:100%; height:auto; display:block;}
	.mFooterLink{width:100%; height:auto; display:flex; flex-direction:column; padding:6.039vw 0; /* padding:25px 0; */ background:#646464;}
	.mSubscribe{display:flex; align-items:center; width:100%; height:auto;}
	.subscribe{max-width:100%; border:0;  margin:0; padding:6.039vw ; /* padding:25px; */ background:#fcfcfc;}
	.subscribe > .container > .cnt{display:flex; align-items:center; }
	.subscribe h1{margin-bottom:0;flex:auto;text-align:left;letter-spacing: 0.8px;font-size:2.899vw;/* font-size:12px; */text-transform:uppercase;color:#444;position:Relative;display: inline-flex;align-items: center;justify-content: flex-start;margin-right: -12px;line-height: 1;}
	.subscribe h1:after{content:'';width: auto;/* width:100px; */flex: auto;height:1px;display:block;background:#ddd;margin-left: 5px;}
	.subscribe a{background:#1da1f2; width:32.609vw; font-size:2.899vw; /* width:135px; font-size:12px; */ padding:3px 0; margin:0;}
	.mLinkList{display:flex; flex-direction:column; width:auto; height:auto; text-align:center; margin:0 auto; padding-bottom:10px;}
	.mLinkList .mLink{display:inline-flex; align-items:center; justify-content:center; width:auto; height:auto; text-align:center; margin:0 auto; }
	.mLinkList .mLink a{display:flex; align-items:center; letter-spacing:0.1px; font-weight:400; color:#c1c1c1; font-size:3.140vw; /* font-size:13px; */}
	.mLinkList .mLink a:after{content:''; display:block; width:1px; height:6px; background:#bbb; margin:0 10px;}
	.mLinkList .mLink li:last-child a:after{display:none;}
	.mCopyRight{text-align:center; margin:0 auto; font-weight:400; font-size:10px; color:#939393; letter-spacing:0.5px; line-height:1.4;} 
	.mNationalSymbols{display:flex; align-items:center; }
	.mNationalSymbols:before{content:''; display:block; width:15px; height:10px; margin-right:6px; background:url('../../images/2019/nationalSymbols-mobile.png') center center / auto no-repeat; }

	/* -- 팝업 -- */
	.daily-popup .popImg{width:35.714vw; max-height:47.429vw; /* width:250px; height:332px; */}
	.daily-popup .popupWrap{max-width: 100%;/* max-width: 600px;(viewport:700px) */}

} /* 1050px : end */


/* ==== 400px 이하 일때  ==== */ @media screen and (max-width:450px) {
	
	.subContainer{margin-top: 96px;}
	.mobile-header, .mobile-topHead > .container{height:48px;}
	/* -- 로고 -- */
	.mHomeLogo{width:124px; height:27px; margin-right:auto; }
	.mHomeLogo > a{background:url('../../images/2019/logo.svg') center center / contain no-repeat;}

	/* -- 검색 -- */
	.mSearchBtn.searchIcon{width:37px; height:37px;}
	.mSearchBtn.searchIcon span{width:17px; height:17px;}
	.mSearchBtn.searchIcon span:before{width:13px; height:13px;}
	.mSearchBtn.searchIcon span:after{height:7px; top:12px; left:14px; }
		/* ^  검색바 : 닫기 버튼 */
		.mSearchBtn.close span{width:23px; height:23px; }
		.mSearchBtn.close span:before{width:1px; height:100%; left:50%; border:none; background:#777; transform:rotate(225deg);-webkit-transform:rotate(225deg);}
		.mSearchBtn.close span:after{width:1px; height:100%; top:0; left:50%;transform:rotate(-225deg);-webkit-transform:rotate(-225deg);}
	/* -- 메뉴 -- */
	.mMenuBtn{width:37px; height:37px; margin:0;  }
	.mMenuBtn span{width:17px; height:17px;}
		/* ^  검색바 : 닫기 버튼 */
		.mMenuBtn.close span{width:23px; height:23px; }
	.topHead{top:47px !important; height:48px;}
	
	/* -- mobile-topHead -- */
	.mobile-topHead .backPage i{width:27px; height:17px;}
	.mobile-topHead .backPage i:before,
	.mobile-topHead .backPage i:after{content:''; display:block; width:1px; height:8.5px; position:absolute; left:4px; background:#bbb;}
	
	.mobile-topHead .share > li{width:37px; height:37px;}
	.mobile-topHead .share > li > a:before{content:''; width:17px; height:17px;}
	.mobile-topHead .share > li:nth-child(2) > a:before{/* background-position:-53px -105px; */}
	.mobile-topHead .share > li:nth-child(3) > a:before{/* background-position:-70px -105px; */}
	
	/* -- 팝업 -- */
	.daily-popup{top:58px;}
	.daily-popup .popupWrap > .container.show{width: min-content;}
	.daily-popup .popImg{width:40vw; max-height:53.111vw; /* width:180px; height:239px; */}
	.daily-popup .popCnt{margin:2.222vw; /* margin:10px; */}
	.daily-popup .popupWrap > section:first-child,
	.daily-popup .popupWrap > section{margin-bottom:2.222vw; /* margin-bottom:10px; */}
	.daily-popup .closeBtn > span > b,
	.daily-popup .popBtn .pChkBox label{font-size:2.444vw; /* font-size:11px; */}
	.daily-popup .popBtn .pChkBox label:before{width:2.667vw; height:2.667vw; /* width:12px; height:12px; */}
	.daily-popup .close b{width:2.222vw; height:2.222vw; /* width:10px; height:10px; */}
	
	
}

