@charset "utf-8";

/* 푸터 */
footer { margin-top:15px; }
footer > [f-area] > div { height:100%; }

/* 푸터 - 협력 */
footer > [f-area=with] { padding:20px 0; background:#fff; overflow:hidden;}
footer > [f-area=with] > div { box-sizing:border-box; padding-left:10px; overflow:hidden; width:1000px; margin:0 auto;}
footer > [f-area=with] > div > ul { /*justify-content:space-around; align-items:center;*/ margin-top:8px; overflow:hidden;}
footer > [f-area=with] > div > ul:first-child { margin-top:0; }
footer > [f-area=with] > div > ul > li { width:13%; float:left; overflow:hidden; border:1px solid #ccc; margin-left:1%; transition:all 0.3s; margin-bottom:10px;}
footer > [f-area=with] > div > ul > li > a > img {width:100%;}
footer > [f-area=with] > div > ul > li:last-child { margin-right:0; }

/* 푸터 - 메뉴/SNS */
footer > [f-area=menu] { width:100%; padding:2%; background:#3e4245; overflow:hidden;}
footer > [f-area=menu] > div { width:1000px; margin:0 auto; overflow:hidden;}
footer > [f-area=menu] > div > [align] { height:100%; }
footer > [f-area=menu] > div > [align=left] { width:75%; float:left; overflow:hidden;}
footer > [f-area=menu] > div > [align=right] { width:25%; float:right; margin-top:10px;}
footer > [f-area=menu] > div > [align=right]::after { content:''; display:block; clear:both;}

footer > [f-area=menu] > div > [align=left] > ul { height:100%; display:block; }
footer > [f-area=menu] > div > [align=left] > ul > li { float:left; height:100%; transition:all 0.3s; margin-bottom:10px;}
footer > [f-area=menu] > div > [align=left] > ul > li > a { height:100%; display:flex; justify-content:center; align-items:center; color:#fff; font-size:16px; letter-spacing:-0.05em; padding:0 10px; transition:background 0.05s ease-in-out; }
footer > [f-area=menu] > div > [align=left] > ul > li > a:hover { background:#252729; }

footer > [f-area=menu] > div > [align=right] > ul { height:100%; overflow:hidden;}
footer > [f-area=menu] > div > [align=right] > ul > li {float:left; width:17%;}
footer > [f-area=menu] > div > [align=right] > ul > li[type=title] { color:#ccc; font-size:12px; letter-spacing:-0.025em; width:15%; text-align:center; }
footer > [f-area=menu] > div > [align=right] > ul > li > a { display:block; width:36px; height:36px; background:#fff no-repeat 50% 50%; border-radius:100px; transition:box-shadow 0.2s ease-in-out; }
footer > [f-area=menu] > div > [align=right] > ul > li > a:hover { box-shadow:0 0 15px rgba(255,255,255,0.5); }
footer > [f-area=menu] > div > [align=right] > ul > li > a[type=facebook] { background-image:url(/img/main/btn_sns_facebook.png); }
footer > [f-area=menu] > div > [align=right] > ul > li > a[type=twitter] { background-image:url(/img/main/btn_sns_twitter.png); }
footer > [f-area=menu] > div > [align=right] > ul > li > a[type=kakao] { background-image:url(/img/main/btn_sns_kakao.png); }
footer > [f-area=menu] > div > [align=right] > ul > li > a[type=insta] { background-image:url(/img/main/btn_sns_insta.png); }
footer > [f-area=menu] > div > [align=right] > ul > li > a[type=blog] { background-image:url(/img/main/btn_blog_naver.png); }

/* 푸터 - 정보 */
footer > [f-area=info] { padding:20px; background:#2e3133; overflow:hidden;}
footer > [f-area=info] > div { width:1000px; margin:0 auto; }
footer > [f-area=info] > div > [align] { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; height:100%; box-sizing:border-box; }
footer > [f-area=info] > div > [align=left] { padding-left:15px; }
footer > [f-area=info] > div > [align=right] { float:right; margin-top:10px; padding-right:10px; }

footer > [f-area=info] > div > [align=left] > dl { margin-top:15px; line-height:1.4;}
footer > [f-area=info] > div > [align=left] > dl:first-child { margin-top:0; }

footer > [f-area=info] > div > [align=left] > dl > dt { color:#ddd; font-size:16px; letter-spacing:-0.05em; margin:0 15px 0 15px; float:left;}
footer > [f-area=info] > div > [align=left] > dl > dd { color:#ddd; -webkit-text-fill-color:#ddd; font-size:16px; letter-spacing:-0.05em; float:left;}

footer > [f-area=info] > div > [align=left] > dl > dt:first-child { margin-left:0; }
/*footer > [f-area=info] > div > [align=left] > dl > dt::before { content:'/'; display:inline-block; margin-right:15px; }*/
footer > [f-area=info] > div > [align=left] > dl > dt:first-child::before { display:none; }

footer > [f-area=info] > div > [align=right] > strong { color:#ddd; font-size:14px; letter-spacing:-0.05em; font-weight:normal; margin-top:10px; }

	/*타블렛분기점, 스크린장치이며 최대크기가 1024이하이면*/
	@media screen and (max-width:1024px) {
		footer > [f-area=with] > div {width:auto; padding:0 20px 0 10px;}
		footer > [f-area=with] > div > ul {}
		footer > [f-area=with] > div > ul > li {width:15.4%; margin-bottom:10px;}
		footer > [f-area=with] > div > ul > li > a {width:15.4%;}
		footer > [f-area=with] > div > ul > li:last-child {margin-bottom:0;}

		footer > [f-area=menu] > div {width:auto;}
		footer > [f-area=menu] > div > [align=left] {width:auto;}
		footer > [f-area=menu] > div > [align=left] > ul > li { float:left; }
		
		footer > [f-area=menu] > div > [align=right] { width:35%; }

		footer > [f-area=info] > div {width:auto;}

	}

	@media screen and (max-width:900px) {
		footer > [f-area=with] > div > ul > li {width:18.7%;}
	}

	/*모바일 분기점, 스크린장치이며 최대크기가 763이하이면*/
	@media screen and (max-width:763px) {
		footer > [f-area=with] > div > ul > li {width:23.6%;}
	}

	/*모바일 분기점, 스크린장치이며 최대크기가 650이하이면*/
	@media screen and (max-width:650px) {
		footer > [f-area=with] > div > ul > li {width:31.6%;}
		footer > [f-area=info] > div > [align=left] > dl > dt[last] {float:none; margin-left:0;}
		footer > [f-area=menu] > div > [align=right] { width:50%; }
	}