/**
 * 이 파일은 모임즈 사이트템플릿의 일부입니다. (https://www.moimz.com)
 *
 * 모임즈 사이트템플릿 - 스타일시트
 * 
 * @file /modules/moimz/templets/default/styles/style.css.php
 * @author Arzz (arzz@arzz.com)
 * @license MIT License
 * @version 3.0.0
 * @modified 2019. 11. 5.
 */
* {-webkit-font-smoothing:antialiased;}
header {width:100%; background-size:cover; background-position:50% 50%; box-shadow:0px 1px 3px rgba(0,0,0,0.3); position:relative; z-index:100;}
header > div[data-role=visual] {transition:background 0.2s ease-in-out, box-shadow 0.2s ease-in-out; position:absolute; top:0; left:0; width:100%; height:80px; z-index:50; padding-top:40px;}
header > div[data-role=visual].hover {background:#10b8c3;}
header > div[data-role=visual].hover:before {position:absolute; width:100%; height:1px; background:rgba(255,255,255,0.3); top:120px; left:0; content:" ";}

/**
 * 다중 사이트 네비게이션 탭
 */
header > nav[data-role=global] {background:rgba(0,0,0,0.2); height:40px; position:absolute; top:0; left:0; width:100%; z-index:60;}
header > nav[data-role=global] > div.container > ul {list-style:none; height:40px; float:left; font-size:0;}
header > nav[data-role=global] > div.container > ul > li {font-size:14px; height:40px; display:inline-block; padding:0px 10px;}
header > nav[data-role=global] > div.container > ul > li:first-child {padding-left:0;}
header > nav[data-role=global] > div.container > ul > li > a {display:block; height:40px; line-height:40px; color:rgba(255,255,255,0.7); text-decoration:none; position:relative; transition:0.2s ease-in-out;}
header > nav[data-role=global] > div.container > ul > li > a:before {position:absolute; width:0; height:2px; background:#10b8c3; bottom:0; left:50%; content:" "; transition:0.2s ease-in-out;}
header > nav[data-role=global] > div.container > ul > li > a:hover {color:#fff;}
header > nav[data-role=global] > div.container > ul > li > a:hover:before {width:100%; left:0;}
header > nav[data-role=global] > div.container > div[data-role=widget] {float:right;}

header > div[data-role=visual] > nav[data-role=navigation] {height:80px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container {font-size:0;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 {display:inline-block; width:150px; height:50px; padding:15px 0px; vertical-align:middle;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 > a {display:block; width:100%; height:100%; background-size:contain; background-position:-8px 50%; background-repeat:no-repeat; font-size:0; color:transparent;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul {display:inline-block; width:calc(100% - 200px); height:80px; font-size:0; list-style:none; vertical-align:middle; text-align:center;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li {display:inline-block; height:80px; padding:0px; position:relative;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a {display:block; width:100%; height:80px; line-height:80px; font-size:18px; color:#fff; text-decoration:none; padding:0px 20px; box-sizing:border-box; position:relative; font-family:NanumSquare;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a:before {position:absolute; width:0; height:2px; bottom:-1px; left:50%; background:#fff; content:" "; transition:0.2s ease-in-out;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a:hover:before {width:calc(100% - 30px); left:15px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] {position:absolute; top:80px; width:auto; display:none; white-space:nowrap; overflow:hidden;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu].left {text-align:left; left:0; padding-left:10px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu].right {text-align:right; right:0; padding-right:10px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul {display:inline-block; list-style:none; vertical-align:top; width:200px; padding:20px 5px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li {display:block; height:30px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li > a {font-size:14px; color:rgba(255,255,255,0.8); height:30px; line-height:30px; text-decoration:none; border-bottom:1px solid transparent;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li > a:hover {border-color:#fff; color:#fff;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li > a.selected {color:#fff; border-color:#fff;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li.title {font-weight:bold;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li.group {padding-left:25px; position:relative;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li.group > a {font-size:12px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li.group:before {position:absolute; top:0; left:10px; border-left:1px solid rgba(255,255,255,0.4); width:10px; height:100%; content:" ";}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li.group:after {position:absolute; top:0; left:10px; border-bottom:1px solid rgba(255,255,255,0.4); width:10px; height:50%; content:" ";}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div[data-role=submenu] > ul > li.group-end:before {height:50%;}

header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] {width:50px; height:50px; border:0; position:relative; background:transparent; cursor:pointer; margin:15px 0px 15px 0px; box-sizing:border-box; vertical-align:middle;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] > span {display:block; position:absolute; height:2px; width:26px; background:#fff; opacity:1; left:12px; transform:rotate(0deg); transition:.25s ease-in-out;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] > span:nth-child(1) {top:16px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] > span:nth-child(2), header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] > span:nth-child(3) {top:24px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] > span:nth-child(4) {top:32px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap].opened:after {bottom:-15px; left:50%; border:solid transparent; content:" "; height:0; width:0; position:absolute; border-color:transparent; border-bottom-color:#10b8c3; border-width:8px; margin-left:-8px;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap].opened > span:nth-child(1) {top:18px; width:0%; left:50%;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap].opened > span:nth-child(2) {transform:rotate(45deg);}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap].opened > span:nth-child(3) {transform:rotate(-45deg);}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap].opened > span:nth-child(4) {top:18px; width:0%; left:50%;}

header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=slide] {width:50px; height:50px; margin:5px 0px; float:right; border:0; cursor:pointer; background:transparent; display:none; vertical-align:middle; position:relative;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=slide] > i {width:50px; height:50px; line-height:50px; font-size:36px; color:#fff;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=slide] > label {position:absolute; top:6px; right:4px; width:10px; height:10px; background:#F44336; font-size:0; border-radius:50%; border:1px solid #fff; box-shadow:0px 0px 0px 3px #10b8c3;}
header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=slide] > label:empty {display:none;}

header > div[data-role=carousel] {position:relative; height:180px; background:rgba(0,0,0,0.7); padding-top:121px;}
header > div[data-role=carousel]:after {position:absolute; top:120px; left:0; width:100%; height:1px; background:rgba(255,255,255,0.3); content:" ";}
header.index > div[data-role=carousel] {height:260px;}

header > div[data-role=carousel] > div.container {display:table; width:1100px; height:100%; table-layout:fixed; padding:0 0;}
header > div[data-role=carousel] > div.container > div.text {width:100%; height:100%; display:table-cell; vertical-align:middle;}
header > div[data-role=carousel] > div.container > div.text > h2 {display:block; font-weight:700; font-size:28px; color:#fff; font-family:NanumSquare;}
header > div[data-role=carousel] > div.container > div.text > small {display:block; padding:20px 0px; line-height:1.6; font-size:18px; color:rgba(255,255,255,0.6); font-family:NanumSquare;}
header > div[data-role=carousel] > div.container > div.text > ul {list-style:none; font-size:0;}
header > div[data-role=carousel] > div.container > div.text > ul > li {display:inline-block; padding-right:10px;}
header > div[data-role=carousel] > div.container > div.text > ul > li:last-child {padding-right:0;}
header > div[data-role=carousel] > div.container > div.text > ul > li > a {display:block; font-size:17px; height:48px; padding:0px 20px; line-height:46px; border:1px solid rgba(255,255,255,0.3); text-decoration:none; color:rgba(255,255,255,0.8); font-family:NanumSquare;}
header > div[data-role=carousel] > div.container > div.text > ul > li > a:hover {background:rgba(255,255,255,0.1); color:#fff;}
header > div[data-role=carousel] > div.container > div.text > ul > li > a.download {background:#2196f3; border-color:#2196f3; font-weight:bold;}
header > div[data-role=carousel] > div.container > div.text > ul > li > a.download > i {float:left; margin-right:10px;}
header > div[data-role=carousel] > div.container > div.text > ul > li > a.download:hover {background:#1e88e5; border-color:#1e88e5;}
header > div[data-role=carousel] > div.container > div.login {width:300px; height:100%; display:table-cell; vertical-align:middle;}

header > div[data-role=carousel] > div.container > div.title {width:100%; height:100%; display:table-cell; vertical-align:middle; text-align:center;}
header > div[data-role=carousel] > div.container > div.title > h2 {font-weight:400; font-size:24px; color:#fff; font-family:NanumSquare;}
header > div[data-role=carousel] > div.container > div.title > small {display:block; margin-top:20px; line-height:1.6; font-size:15px; color:rgba(255,255,255,0.6);}

/**
 * 전체 사이트맵 영역
 */
header > div[data-role=visual] > div[data-role=sitemap] {position:absolute; display:none; top:120px; right:0; z-index:50; width:100%; background:#fff; box-shadow:0px 10px 10px rgba(0,0,0,0.1); overflow:hidden; border-top:4px solid #10b8c3;}
header > div[data-role=visual] > div[data-role=sitemap].opened {display:block;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul {display:table; width:100%; border-right:1px solid #e6e6e6; table-layout:fixed; box-sizing:border-box;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li {display:table-cell; width:25%; border-left:1px solid #e6e6e6; vertical-align:top; padding:40px 0 40px 25px;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li > h4 {font-size:20px; color:#333; margin-bottom:20px;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li > h4 > a {color:inherit; text-decoration:none;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li > ul {list-style:none;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li > ul > li > a {display:block; min-height:20px; line-height:25px; font-size:14px; color:#666666; text-decoration:none; vertical-align:middle; margin:5px 0px; box-sizing:border-box; word-break:break-word; word-wrap:break-word; padding:0px 20px; position:relative;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li > ul > li > a > i {width:15px; height:25px; display:block; vertical-align:middle; text-align:center; position:absolute; top:0; left:0; line-height:24px;}
header > div[data-role=visual] > div[data-role=sitemap] > div.container > ul > li > ul > li > a:hover {color:#c59646;}

/**
 * 스크롤이 되어 메뉴가 고정되었을 때
 */
header.fixed > div[data-role=visual] > nav[data-role=navigation] {background-color:#10b8c3;}
header.fixed > div[data-role=visual] > div[data-role=sitemap] {position:fixed; top:60px; border-top:0;}
header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap].opened:after {border-bottom-color:#fff; bottom:-5px;}
header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > div[data-role=widget] > section {display:block;}

@media (min-width:992px) {
	header.fixed > div[data-role=visual] > nav[data-role=navigation] {position:fixed; top:-60px; left:0px; width:100%; height:60px; z-index:50; box-shadow:0px 2px 3px rgba(0,0,0,0.2); transition:top 0.3s; transition-timing-function:ease-out;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation].hover:before {position:fixed; width:100%; height:1px; background:rgba(255,255,255,0.3); top:60px; left:0; content:" ";}
	header.fixed > div[data-role=visual] > nav[data-role=navigation].slide {top:0px;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 {padding:5px 0px;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > ul {height:60px;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li {height:60px;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a {height:60px; line-height:60px; font-size:17px;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > div {top:60px;}
	header.fixed > div[data-role=visual] > nav[data-role=navigation] > div.container > button {margin:5px 0px;}
}

main.subpage {font-size:0;}
main.subpage > nav {height:50px; background:#fafafa; border-bottom:1px solid #ddd; box-sizing:border-box;}
main.subpage > nav > div.container {height:50px;}
main.subpage > nav > div.container > ul {display:block; list-style:none; text-align:center;}
main.subpage > nav > div.container > ul > li {padding:0px 10px; display:inline-block; vertical-align:middle;}
main.subpage > nav > div.container > ul > li > a {display:block; font-size:15px; padding:0px 10px; height:50px; line-height:49px; text-decoration:none; color:#444;}
main.subpage > nav > div.container > ul > li > a:hover {border-bottom:1px solid #10b8c3; height:49px;}
main.subpage > nav > div.container > ul > li > a > i.xi-external-link {float:right; height:48px; line-height:48px; margin-left:5px; font-size:12px;}
main.subpage > nav > div.container > ul > li.selected > a {height:48px; line-height:48px; border-bottom:2px solid #10b8c3;}

/**
 * 스크롤이 되어 메뉴가 고정되었을 때
 */
@media (min-width:768px) and (max-width:991px) {
	main.subpage.fixed {padding-top:51px;}
	main.subpage.fixed > nav {position:fixed; top:54px; left:0px; width:100%; z-index:50; box-shadow:0px 1px 2px rgba(0,0,0,0.2);}
}

@media (min-width:992px) {
	main.subpage.fixed {padding-top:51px;}
	main.subpage.fixed > nav {position:fixed; top:60px; left:0px; width:100%; z-index:50; box-shadow:0px 1px 2px rgba(0,0,0,0.2);}
}

main.subcontainer > div.container {padding-top:50px; padding-bottom:50px; font-size:14px;}

main div.subtitle {padding-bottom:20px;}
main div.subtitle > h4 {font-size:30px; text-align:center; font-weight:normal;}
main div.subtitle > small {display:block; opacity:0.8; font-size:17px; text-align:center; padding:20px 0px; line-height:1.6;}
main div.subtitle > h4 + div[data-role] {margin-top:40px;}
main div.subtitle > small + div[data-role] {margin-top:20px;}

main div.block {padding:50px 0px;}
main div.block > div.container > h4 {font-size:30px; text-align:center; font-weight:normal; word-break:keep-all; min-height:36px; line-height:36px; letter-spacing:-1px; color:#222; font-family:NanumSquare;}
main div.block > div.container > h4 > a {text-decoration:none; color:#222;}
main div.block > div.container > h4 + div[data-role=tabbar] {margin-top:20px;}
main div.block > div.container > h4 > label {height:24px; line-height:24px; display:inline-block; vertical-align:top; font-size:16px; background:#F44336; color:#fff; border-radius:3px; margin-right:10px; padding:0px 4px;}
main div.block > div.container > small {display:block; opacity:0.6; font-size:17px; text-align:center; padding:20px 0px; line-height:1.6; word-break:keep-all; min-height:36px; box-sizing:border-box; font-family:NanumSquare;}
main div.block > div.container > small + div[data-role=tabbar] {margin-top:20px;}
main div.block > div.container > small + div[data-widget] {padding-top:20px;}
main div.block > div.container > div[data-role=tab] {padding:20px 0px;}
main div.block > div.container > div[data-role=text] {font-size:14px; opacity:0.8; line-height:30px; padding-top:20px;}
main div.block > div.container > div[data-role=text] > a {display:inline-block; vertical-align:top; margin:3px 0px; height:24px; line-height:24px; padding:0px 5px; background:#2196f3; color:#fff; text-decoration:none; border-radius:3px;}

main div.block > div.container > div[data-role=text] > div[data-role=more] {height:42px; position:relative; overflow:hidden; position:relative;}
main div.block > div.container > div[data-role=text] > div[data-role=more] > button[data-action=expand] {border:0; border-top:1px solid #ccc; display:block; background:#fff; cursor:pointer; width:100%; height:42px; position:absolute; top:0; left:0; z-index:5; color:#222;}
main div.block > div.container > div[data-role=text] > div[data-role=more] > button[data-action=expand] > span {display:inline-block; width:100px; height:40px; line-height:40px; border:1px solid #ccc; border-top:1px solid #fff; text-align:center; position:absolute; top:-1px; left:calc(50% - 50px);}
main div.block > div.container > div[data-role=text] > div[data-role=more] > button[data-action=expand] > span > i {margin-right:10px;}
main div.block > div.container > div[data-role=text] > div[data-role=more].expand {height:auto; padding-bottom:50px;}
main div.block > div.container > div[data-role=text] > div[data-role=more].expand > button[data-action=expand] {top:auto; bottom:0;}

@media (min-width:992px) {
	main div.block > div.container.card > h4 {width:300px; display:inline-block; text-align:left; vertical-align:top;}
	main div.block > div.container.card > small {display:inline-block; width:calc(100% - 300px); vertical-align:top; padding:8px 0px 0px 0px; text-align:left; font-size:20px;}
	main div.block > div.container.card > div[data-role=text] {padding-left:300px; border-left:2px solid transparent; font-size:16px;}
}

@media (min-width:991px) and (max-width:1199px) {
	main div.block > div.container.card > h4 {width:240px;}
	main div.block > div.container.card > small {width:calc(100% - 240px);}
	main div.block > div.container.card > div[data-role=text] {padding-left:240px;}
}

main div.block > div.container > div[data-role=card] + div[data-role=card] {margin-top:50px; padding-top:50px; border-bottom:1px solid #ccc; font-size:0;}
main div.block > div.container > div[data-role=card] > h4 {display:inline-block; font-size:32px; width:300px; vertical-align:top; padding-bottom:10px;}
main div.block > div.container > div[data-role=card] > article {display:inline-block; width:calc(100% - 300px); vertical-align:top;}
main div.block > div.container > div[data-role=card] > article > small {}
main div.block > div.container > div[data-role=card] > article > div {padding-top:15px; font-size:14px; color:#666; line-height:1.6;}

main div.block.blue {background:#3276ca;}
main div.block.blue > div.container > h4 {color:#fff;}
main div.block.blue > div.container > h4 > a {text-decoration:none; color:#fff;}
main div.block.blue > div.container > small {color:#fff;}
main div.block.blue > div.container > div[data-role=text] {color:#fff;}
main div.block.gray {background:#f2f2f5;}
main div.block.gray > div.container > div[data-role=text] > div[data-role=more] > button[data-action=expand] {background:#f2f2f5;}
main div.block.gray > div.container > div[data-role=text] > div[data-role=more] > button[data-action=expand] > span {border-top-color:#f2f2f5;}

main div.block ul[data-role=category] {list-style:none; font-size:0; width:100%; height:40px; text-align:center; margin:-20px 0px; white-space:nowrap; overflow-x:auto;}
main div.block ul[data-role=category] > li {display:inline-block; padding:0px 10px;}
main div.block ul[data-role=category] > li > button {font-size:16px; color:#222; height:40px; padding:0px 15px; border:0; background:transparent; cursor:pointer; vertical-align:middle; border-radius:5px;}
main div.block ul[data-role=category] > li > button:hover {background:rgba(0,0,0,0.1);}
main div.block ul[data-role=category] > li > button.on {background:#2196f3; color:#fff;}

@media (max-width:767px) {
	main div.block ul[data-role=category] > li {padding:0px 5px;}
	main div.block ul[data-role=category] > li > button {padding:0px 10px;}
}

main div.block > div.container > div.recently {font-size:0; margin:0px -10px;}
main div.block > div.container > div.recently > div[data-widget=board-recently][data-templet=default] {display:inline-block; width:50%; box-sizing:border-box; padding:0px 10px; font-size:1rem; vertical-align:top;}
main div.block > div.container > div.recently > div[data-widget=board-recently][data-templet=webzine] {display:block; width:100%; box-sizing:border-box; padding:0px 10px; font-size:1rem;}

@media (max-width:767px) {
	main div.block > div.container > div.recently > div[data-widget=board-recently][data-templet=default] {display:block; width:100%;}
	main div.block > div.container > div.recently > div[data-widget=board-recently][data-templet=default] + div[data-widget=board-recently][data-templet=default] {margin-top:20px;}
}

main div[data-widget] ul[data-role=intro] {margin-left:-20px; margin-top:-20px; display:block; list-style:none; font-size:0;}
main div[data-widget] ul[data-role=intro] > li {width:50%; padding:20px 0 0 20px; box-sizing:border-box; display:inline-block; vertical-align:middle;}
main div[data-widget] ul[data-role=intro] > li > div {padding:30px; text-align:left; color:#fff; height:120px; overflow:hidden;}
main div[data-widget] ul[data-role=intro] > li:nth-child(1) > div {background:#18ba76;}
main div[data-widget] ul[data-role=intro] > li:nth-child(2) > div {background:#fe6c7e;}
main div[data-widget] ul[data-role=intro] > li:nth-child(3) > div {background:#7469fc;}
main div[data-widget] ul[data-role=intro] > li:nth-child(4) > div {background:#fd7f64;}
main div[data-widget] ul[data-role=intro] > li > div > b {font-size:24px; display:block; height:25px; line-height:26px; font-family:NanumSquare;}
main div[data-widget] ul[data-role=intro] > li > div > b > i {height:26px; line-height:26px; margin-right:10px; float:left;}
main div[data-widget] ul[data-role=intro] > li > div > small {font-size:16px; color:rgba(255,255,255,0.8); line-height:1.6; display:block; padding-top:20px; padding-left:5px;}

main section.errorbox {font-size:14px;}

@media (max-width:767px) {
	main div[data-widget] ul[data-role=intro] {margin-left:0px;}
	main div[data-widget] ul[data-role=intro] > li {width:100%; padding:10px 0 0 0;}
	main div[data-widget] ul[data-role=intro] > li > div {height:auto; padding:20px;}
	main div[data-widget] ul[data-role=intro] > li > div > b {font-size:18px;}
	main div[data-widget] ul[data-role=intro] > li > div > small {font-size:14px;}
}

@media (min-width:768px) and (max-width:991px) {
	main div[data-widget] ul[data-role=intro] {margin-left:-10px;}
	main div[data-widget] ul[data-role=intro] > li {padding:10px 0 0 10px;}
	main div[data-widget] ul[data-role=intro] > li > div {height:110px;}
	main div[data-widget] ul[data-role=intro] > li > div > b {font-size:20px;}
	main div[data-widget] ul[data-role=intro] > li > div > small {font-size:14px;}
}

@media (min-width:992px) and (max-width:1199px) {
	main div[data-widget] ul[data-role=intro] > li > div {height:110px;}
	main div[data-widget] ul[data-role=intro] > li > div > small {font-size:14px;}
}

main div[data-module] ul[data-role=features] {margin-top:-20px; margin-left:-20px;}
main div[data-module] ul[data-role=features] > li {display:inline-block; width:33.3333%; padding:20px 0px 0px 20px; box-sizing:border-box; vertical-align:top; min-height:400px;}
main div[data-module] ul[data-role=features] > li > div {position:relative;}
main div[data-module] ul[data-role=features] > li > div > div {width:100%; background:#fff; box-sizing:border-box; cursor:pointer; position:absolute; top:0; left:0; z-index:0; transition:0.2s ease-in-out;}
main div[data-module] ul[data-role=features] > li > div > div:before {position:absolute; top:0px; left:0px; width:100%; height:100%; border:1px solid #ccc; box-sizing:border-box; content:" "; z-index:2;}
main div[data-module] ul[data-role=features] > li > div > div > label {position:absolute; height:24px; line-height:24px; padding:0px 10px; background:#fdb814; right:-6px; top:10px; font-size:12px; color:#222; font-weight:bold; z-index:5;}
main div[data-module] ul[data-role=features] > li > div > div > label:before {position:absolute; top:100%; right:0px; content:" "; border-top:6px solid #f15120; border-right:6px solid transparent;}
main div[data-module] ul[data-role=features] > li > div > div > div.icon {width:100%; height:160px; position:absolute; top:0; left:0; z-index:0; transition:0.2s ease-in-out;}
main div[data-module] ul[data-role=features] > li > div > div > div.icon > i {display:block; width:100%; height:80px; text-align:center; padding:30px 0px 5px 0px; transition:0.2s ease-in-out;}
main div[data-module] ul[data-role=features] > li > div > div > div.icon > i > svg {width:80px; height:80px; fill:rgba(255,255,255,0.8); transition:0.2s ease-in-out;}
main div[data-module] ul[data-role=features] > li > div > div > div.icon > span {display:block; width:100%; height:20px; padding:5px 0px 15px; line-height:20px; text-align:center; color:#fff; font-size:14px;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail {height:180px; padding:180px 20px 20px 20px; line-height:25px; font-size:14px; color:#666; position:relative; overflow:hidden; transition:0.2s ease-in-out;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > div.target {width:100%; height:20px; padding:5px 0px 15px 0px; font-size:0;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > div.target > label {display:inline-block; padding:0px 5px; font-size:12px; margin-right:5px; line-height:20px; font-weight:bold;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > div.target > label.server {background:#FFEBEE; color:#F44336;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > div.target > label.client {background:#E3F2FD; color:#2196F3;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > div.target > label.widget {background:#F3E5F5; color:#9C27B0;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > small {line-height:1.6; font-size:12px; color:#999; display:block; margin-top:10px;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > button {width:100%; height:40px; background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%); position:absolute; left:0; bottom:0; border:0; font-size:14px; line-height:40px; color:transparent; font-weight:bold;}
main div[data-module] ul[data-role=features] > li > div > div > div.detail > button span[data-role=collapse] {display:none;}
main div[data-module] ul[data-role=features] > li:nth-child(1) > div > div > div.icon {background:#18ba76;}
main div[data-module] ul[data-role=features] > li:nth-child(2) > div > div > div.icon {background:#fe6c7e;}
main div[data-module] ul[data-role=features] > li:nth-child(3) > div > div > div.icon {background:#7469fc;}
main div[data-module] ul[data-role=features] > li:nth-child(4) > div > div > div.icon {background:#fd7f64;}
main div[data-module] ul[data-role=features] > li:nth-child(5) > div > div > div.icon {background:#48B8E7;}
main div[data-module] ul[data-role=features] > li:nth-child(6) > div > div > div.icon {background:#557288;}

main div[data-module] ul[data-role=features] > li > div > div:hover:before {border:2px solid #2196f3;}
main div[data-module] ul[data-role=features] > li > div > div:hover > div.detail > button {color:#2196f3;}
main div[data-module] ul[data-role=features] > li > div > div.on {top:-10px; left:-10px; width:calc(100% + 20px); z-index:5; box-shadow:2px 2px 2px rgba(0,0,0,0.2);}
main div[data-module] ul[data-role=features] > li > div > div.on > div.icon {height:170px;}
main div[data-module] ul[data-role=features] > li > div > div.on > div.icon > i {padding-top:35px; height:85px;}
main div[data-module] ul[data-role=features] > li > div > div.on > div.icon > i > svg {width:85px; height:85px;}

main div[data-module] ul[data-role=features] > li > div > div.on > div.detail {padding:190px 30px 50px 30px; height:auto;}
main div[data-module] ul[data-role=features] > li > div > div.on > div.detail > button {color:#2196f3;}
main div[data-module] ul[data-role=features] > li > div > div.on > div.detail > button span[data-role=expand] {display:none;}
main div[data-module] ul[data-role=features] > li > div > div.on > div.detail > button span[data-role=collapse] {display:inline;}
main div[data-module] ul[data-role=features] > li > div > div.on:before {border:2px solid #2196f3;}

@media (max-width:767px) {
	main div[data-module] ul[data-role=features] {margin-top:-10px; margin-left:-10px;}
	main div[data-module] ul[data-role=features] > li {width:100%; padding:10px 0px 0px 10px; min-height:390px;}
	main div[data-module] ul[data-role=features] > li > div > div.on {width:100%; height:auto; top:0; left:0;}
	main div[data-module] ul[data-role=features] > li > div > div.on > div.icon {height:160px;}
	main div[data-module] ul[data-role=features] > li > div > div.on > div.icon > i {padding-top:30px; height:80px;}
	main div[data-module] ul[data-role=features] > li > div > div.on > div.icon > i > svg {width:80px; height:80px;}
	main div[data-module] ul[data-role=features] > li > div > div.on > div.detail {padding:180px 20px 50px 20px; height:auto;}
}

@media (min-width:768px) and (max-width:991px) {
	main div[data-module] ul[data-role=features] {margin-top:-10px; margin-left:-10px;}
	main div[data-module] ul[data-role=features] > li {width:50%; padding:10px 0px 0px 10px;}
}

main div[data-widget] ul[data-role=features] {margin-left:-20px; margin-top:-20px; display:block; list-style:none; font-size:0;}
main div[data-widget] ul[data-role=features] > li {width:20%; padding:20px 0 0 20px; box-sizing:border-box; display:inline-block;}
main div[data-widget] ul[data-role=features] > li > a {display:block; width:100%; height:0; padding-bottom:100%; background:rgba(255,255,255,0.8); position:relative;}
main div[data-widget] ul[data-role=features] > li > a > div {position:absolute; top:0; left:0; width:100%; height:100%; padding:10%; box-sizing:border-box; color:#0d47a1; text-align:center; font-size:16px; padding-top:75%;}
main div[data-widget] ul[data-role=features] > li > a > div > i {display:block; position:absolute; width:50%; height:50%; top:15%; left:25%;}
main div[data-widget] ul[data-role=features] > li > a > div > i > svg {width:100%; height:100%;}
main div[data-widget] ul[data-role=features] > li > a > div > i > svg path {fill:#0d47a1;}


@media (max-width:767px) {
	main div[data-widget] ul[data-role=features] {margin-left:-10px; margin-right:-10px; padding-right:10px; padding-bottom:10px; overflow-x:scroll; white-space:nowrap; -webkit-overflow-scrolling:touch;}
	main div[data-widget] ul[data-role=features] > li {width:140px; padding:10px 0px 0px 10px;}
	main div[data-widget] ul[data-role=features] > li > a > div {font-size:14px;}
	main div[data-widget] ul[data-role=features] > li > a > div > i {width:50%; height:50%; top:15%; left:25%;}
}

@media (min-width:768px) and (max-width:991px) {
	main div[data-widget] ul[data-role=features] {margin-left:-10px;}
	main div[data-widget] ul[data-role=features] > li {padding:10px 0 0 10px;}
	main div[data-widget] ul[data-role=features] > li > a > div {font-size:14px;}
}

main div[data-widget] ul[data-role=pricing] {margin-left:-20px; margin-top:-20px; display:table; width:calc(100% + 20px); list-style:none; font-size:0; table-layout:fixed;}
main div[data-widget] ul[data-role=pricing] > li {display:table-cell; width:100%; padding:20px 0 0 20px; box-sizing:border-box;}
main div[data-widget] ul[data-role=pricing] > li > div {background:#fff;}
main div[data-widget] ul[data-role=pricing] > li > div > b {display:block; background:#666; color:#fff; font-size:20px; text-align:center; height:64px; line-height:64px; font-family:NanumSquare;}
main div[data-widget] ul[data-role=pricing] > li > div > b.recommend {background:#2196F3;}
main div[data-widget] ul[data-role=pricing] > li > div > ul {border:1px solid #ccc; border-top:0px; list-style:none;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li {display:block; height:48px; line-height:48px; border-bottom:1px solid #ddd; text-align:center; font-size:14px; color:#666;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li > b {color:#2196F3;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li > b.disabled {color:#F44336;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li > sup {font-size:11px; position:relative; top:-5px; vertical-align:middle;}

main div[data-widget] ul[data-role=pricing] > li > div > ul > li > b {color:#2196F3;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li:last-child {border-bottom:0;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li.price {height:60px; line-height:60px; text-align:center; font-size:24px; color:#FF9800; border-bottom:0px;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li.price > small {font-size:14px; color:#666;}
main div[data-widget] ul[data-role=pricing] > li > div > ul > li.price > sup {font-size:11px; position:relative; top:-10px; vertical-align:middle; color:#666;}
main div[data-widget] ul[data-role=pricing] > li.disabled {opacity:0.5;}

@media (max-width:767px) {
	main div[data-widget] ul[data-role=pricing] {display:block; width:calc(100% + 10px); margin-left:-10px; margin-right:-10px; margin-top:-10px; padding-right:10px; padding-bottom:10px; overflow-x:scroll; white-space:nowrap; -webkit-overflow-scrolling:touch;}
	main div[data-widget] ul[data-role=pricing] > li {display:inline-block; width:80%; max-width:280px; padding:10px 0 0 10px;}
}

@media (min-width:768px) and (max-width:991px) {
	main div[data-widget] ul[data-role=pricing] {margin-left:-10px;}
	main div[data-widget] ul[data-role=pricing] > li {padding-left:10px;}
	main div[data-widget] ul[data-role=pricing] > li > div > b {font-size:16px;}
	main div[data-widget] ul[data-role=pricing] > li > div > ul > li {font-size:14px;}
	main div[data-widget] ul[data-role=pricing] > li > div > ul > li.price {font-size:20px;}
}

main div[data-module] div[data-role=selector] {padding-top:20px;}
main div[data-module] div[data-role=selector] > h5 {font-size:20px; height:50px; line-height:50px; text-align:left; font-weight:400; color:#222; margin-bottom:5px; font-family:NanumSquare;}
main div[data-module] div[data-role=selector] > h5 > i {float:left; width:30px; height:30px; margin:10px 10px 10px 0px; line-height:30px; background:#2196f3; color:#fff; border-radius:3px; text-align:center; font-size:16px;}
main div[data-module] div[data-role=selector] > small {display:block; color:#999; font-size:15px; text-align:left; padding:0px 0px 20px 0px; line-height:26px; min-height:26px;}
main div[data-module] div[data-role=selector] > small > a {display:inline-block; vertical-align:top; margin:1px 0px; height:24px; line-height:24px; padding:0px 5px; background:#2196f3; color:#fff; text-decoration:none; border-radius:3px; box-sizing:border-box;}
main div[data-module] div[data-role=selector] > ul {list-style:none; font-size:0; margin-left:-10px;}
main div[data-module] div[data-role=selector] > ul > li {display:inline-block; vertical-align:top; padding:0px 0px 10px 10px; box-sizing:border-box;}
main div[data-module] div[data-role=selector] > ul.col1 > li {width:100%;}
main div[data-module] div[data-role=selector] > ul.col2 > li {width:50%;}
main div[data-module] div[data-role=selector] > ul.col3 > li {width:33.3333%;}
main div[data-module] div[data-role=selector] > ul.col4 > li {width:25%;}
main div[data-module] div[data-role=selector] > ul.col6 > li {width:16.6666%;}
main div[data-module] div[data-role=selector] > ul > li > * {display:block; width:100%; padding:20px; font-size:14px; background:#fff; border:1px solid #ccc; border-radius:3px; text-align:left; color:#222; box-sizing:border-box; text-decoration:none;}
main div[data-module] div[data-role=selector] > ul > li > * > b {display:block; font-size:16px;}
main div[data-module] div[data-role=selector] > ul > li > * > small {display:block; border-top:1px solid #ccc; margin-top:12px; font-size:13px; color:#666; padding-top:10px; line-height:20px; word-break:break-word; text-align:left; overflow:visible; white-space:normal;}
main div[data-module] div[data-role=selector] > ul > li > button {cursor:pointer;}
main div[data-module] div[data-role=selector] > ul > li > button:hover, main div[data-module] div[data-role=selector] > ul > li > a:hover {background:#e3f2fd; border-color:#2196f3;}
main div[data-module] div[data-role=selector] > ul > li > *.selected {border-color:#2196f3 !important; background:#2196f3 !important; color:#fff !important;}
main div[data-module] div[data-role=selector] > ul > li > *.selected > small {color:rgba(255,255,255,0.7) !important; border-color:rgba(255,255,255,0.3) !important;}
main div[data-module] div[data-role=selector] > ul > li > *[disabled] {background:#f4f4f4 !important; border-color:#e5e5e5 !important; color:#999 !important; cursor:not-allowed;}
main div[data-module] div[data-role=selector] > ul > li > *[disabled] > small {color:#ccc !important; border-color:#e5e5e5 !important;}

main div[data-module] div[data-role=selector] > ul + h5 {padding-top:40px;}
main div[data-module] div[data-role=selector] > div[data-role=input] + h5 {padding-top:40px;}

@media (max-width:767px) {
	main div[data-module] div[data-role=selector] > ul.xs-flow {white-space:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; margin-right:-10px; padding-right:10px;}
	main div[data-module] div[data-role=selector] > ul.xs-flow > li {width:250px;}
	main div[data-module] div[data-role=selector] > ul.xs-col2 > li {width:50%;}
	main div[data-module] div[data-role=selector] > ul.xs-col1 > li {width:100%;}
}

@media (min-width:768px) and (max-width:991px) {
	main div[data-module] div[data-role=selector] > ul.sm-col2 > li {width:50%;}
	main div[data-module] div[data-role=selector] > ul.sm-col3 > li {width:33.3333%;}
}

main div.block ul[data-role=footnote] {padding-top:20px; list-style:none;}
main div.block ul[data-role=footnote] > li {position:relative; font-size:11px; color:#666; line-height:18px; min-height:18px; padding-left:14px;}
main div.block ul[data-role=footnote] > li > i {display:block; width:14px; height:18px; line-height:18px; position:absolute; top:0; left:0; text-align:left; font-style:normal;}
main div.block ul[data-role=footnote] > li > i.dot {top:7px; left:3px; width:2px; height:2px; background:#666;}
main div.block.blue ul[data-role=footnote] > li {color:rgba(255,255,255,0.6);}
main div.block.blue ul[data-role=footnote] > li > i.dot {background:rgba(255,255,255,0.6);}

main.widget {background:linear-gradient(to left,rgba(245,247,249,1) 0%,rgba(245,247,249,1) 50%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 100%); position:relative;}
main.widget > div.container > section {display:inline-block; width:calc(100% - 260px); vertical-align:top; box-sizing:border-box; padding:20px 20px 20px 0px; background:#fff; font-size:14px;}
main.widget > div.container > aside {display:inline-block; width:260px; vertical-align:top; box-sizing:border-box; padding:20px 0px 20px 20px; background:transparent; font-size:14px;}

form.footer div.block {padding:50px 0px; background:#f2f2f5; font-size:0;}
form.footer div.block > div.container > div[data-role=search] {max-width:400px; margin:0 auto; font-size:0;}
form.footer div.block > div.container > div[data-role=search] > div[data-role=input] {font-size:14px; width:calc(100% - 40px); display:inline-block; vertical-align:middle;}
form.footer div.block > div.container > div[data-role=search] > button {width:40px; height:40px; background:#b5b7c0; border:0px; cursor:pointer; vertical-align:middle;}
form.footer div.block > div.container > div[data-role=search] > button > i {font-size:14px; color:#fff;}
form.footer div.block > div.container > div[data-role=search] > button:hover {background:#828595;}

form.footer div.block > div.container > ul.qna {list-style:none; margin-left:-20px; padding-top:30px;}
form.footer div.block > div.container > ul.qna > li {width:25%; padding:20px 0 0 20px; box-sizing:border-box; display:inline-block; vertical-align:middle;}
form.footer div.block > div.container > ul.qna > li > a {display:block; background:#fff; border:1px solid #ccc; padding:20px; text-decoration:none;}
form.footer div.block > div.container > ul.qna > li > a > i {display:block; width:30px; height:5px; margin:10px auto; border-top:1px solid #2196f3;}
form.footer div.block > div.container > ul.qna > li > a > b {display:block; height:30px; line-height:30px; font-size:24px; text-align:center; color:#222;}
form.footer div.block > div.container > ul.qna > li > a > small {display:block; font-size:14px; color:#999; text-align:center; padding-top:5px;}

@media (max-width:767px) {
	form.footer div.block > div.container > h4 {font-size:26px; line-height:1.6;}
	form.footer div.block > div.container > small {font-size:15px;}
	
	form.footer div.block > div.container > ul.qna {margin-left:-10px; padding-top:10px;}
	form.footer div.block > div.container > ul.qna > li {width:50%; padding-left:10px; padding-top:10px;}
	form.footer div.block > div.container > ul.qna > li > a > b {font-size:20px;}
	form.footer div.block > div.container > ul.qna > li > a > small {font-size:14px;}
	
	form.footer ul[data-role=table].prices {padding:0px 10px; margin:0px -10px;}
}

@media (min-width:768px) and (max-width:991px) {
	form.footer div.block > div.container > ul.qna > li > a > b {font-size:20px;}
	form.footer div.block > div.container > ul.qna > li > a > small {font-size:14px;}
}


/**
 * 모바일 사이드메뉴
 */
aside.menu {position:fixed; top:0; right:0; width:300px; height:100%; background:#fff; z-index:20000; display:none;}
aside.menu > div.header {background:#153869; height:40px; padding:7px 0px 7px 10px; font-size:0; font-weight:bold; color:#fff;}
aside.menu > div.header > button {float:right; width:54px; height:54px; display:inline-block; box-sizing:border-box; vertical-align:middle; cursor:pointer; background:transparent; margin:-10px 0px; padding:0; border:0;}
aside.menu > div.header > button > i {width:54px; height:54px; line-height:60px; text-align:center; font-size:30px; color:rgba(255,255,255,0.8);}
aside.menu > div.header > button:hover > i {color:#fff;}

aside.menu > ul.menu {width:100%; height:calc(100% - 54px); border-top:1px solid #153869; list-style:none; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; box-sizing:border-box;}
aside.menu > ul.menu.logged {height:calc(100% - 54px - 180px); border-top-color:#e0e0e0;}
aside.menu > ul.menu > li {overflow:hidden; height:50px;}
aside.menu > ul.menu > li > a {display:block; width:100%; height:50px; line-height:50px; font-size:14px; padding:0px 20px; text-decoration:none; border:0; background:#fff; color:#222; box-sizing:border-box; border-bottom:1px solid #e0e0e0; text-align:left; cursor:pointer; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
aside.menu > ul.menu > li > a > i.icon {float:left; width:30px; height:50px; line-height:50px; font-size:20px; color:#153869; opacity:0.6;}
aside.menu > ul.menu > li > a > i[data-role=toggle] {float:right; width:50px; height:50px; line-height:50px; font-size:20px; color:#222; margin-right:-20px; text-align:center;}
aside.menu > ul.menu > li > div.submenu {background:#f7f7f7; padding:0px 0px; border-bottom:1px solid #e0e0e0;}
aside.menu > ul.menu > li > div.submenu > a {display:block; width:100%; height:40px; line-height:40px; padding:0px 20px 0px 35px; box-sizing:border-box; text-decoration:none; color:#333; font-size:13px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
aside.menu > ul.menu > li > div.submenu > a.selected {background:#b18d4f; color:#fff;}
aside.menu > ul.menu > li > div.submenu > a:hover {background:#b18d4f; color:#fff;}
aside.menu > ul.menu > li.opened {height:auto;}
aside.menu > ul.menu > li.opened > a > i[data-role=toggle] {transform:rotate(180deg);}


/**
 * 사이트 푸터
 */
footer {background:#3c3d3d; color:#bfbfbf; position:relative; padding-bottom:20px;}
footer > div.container > ul.menus {list-style:none; width:100%; height:53px; border-bottom:1px solid #5e5f5f; font-size:0; white-space:nowrap; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; box-sizing:border-box;}
footer > div.container > ul.menus > li {display:inline-block; height:52px; line-height:52px; font-size:14px; padding:0px 10px;}
footer > div.container > ul.menus > li:first-child > a {margin-left:-10px;}
footer > div.container > ul.menus > li > a {display:inline-block;color:inherit; text-decoration:none;}
footer > div.container > ul.menus > li > a[href="/ko/terms/privacy"] {font-weight:bold; color:#000;}
footer > div.container > ul.menus > li.sns {float:right;}
footer > div.container > ul.menus > li.sns > a:last-child {margin-right:-10px;}
footer > div.container > ul.menus > li.sns > a {display:inline-block; padding:0px 5px; margin-left:5px; font-size:20px;}

footer > div.container > div.contact {margin-top:24px; width:100%; font-size:0px; word-break:keep-all;}
footer > div.container > div.contact > i.emblem {width:48px; height:48px; margin-right:10px; float:left; display:block; vertical-align:top; background-size:contain;}
footer > div.container > div.contact > div {display:inline-block; width:calc(100% - 60px); /*height:48px;*/ font-size:12px; vertical-align:top;}
footer > div.container > div.contact > div.address > div {width:100%; height:24px; line-height:24px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
footer > div.container > div.contact > div.address > div > a {color:inherit; text-decoration:none;}

footer > div.container > div.copyright {margin-top:30px; line-height:24px; height:24px; font-size:0;}
footer > div.container > div.copyright > div {display:inline-block; font-size:13px; width:50%; height:24px; line-height:24px; vertical-align:middle;}
footer > div.container > div.copyright > div.status {text-align:right;}

/**
 * 모바일
 */
@media (max-width:767px) {
	header {position:static;}
	header > div[data-role=visual] {position:fixed !important; top:0; left:0; width:100%; height:54px; z-index:60; padding-top:0; box-shadow:0px 1px 2px rgba(0,0,0,0.2); background:#10b8c3; box-shadow:1px 2px 2px rgba(0,0,0,0.1);}
	header > nav[data-role=global] {display:none;}
	header > div[data-role=visual] > nav[data-role=navigation] {height:54px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container {position:relative;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 {padding:5px 0px; height:40px; margin:2px 0px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 > a {background-position-x:-6px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul {display:none;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] {display:none;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=slide] {display:block; margin:2px 0px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a {padding:0px 10px; font-size:16px;}
	
	header > div[data-role=carousel] {display:none;}
	
	main {padding-top:54px;}
	
	main > div.block {padding:30px 0px;}
	main > div.block > div.container > h4 {font-size:24px; line-height:1.6;}
	main > div.block > div.container > small {font-size:14px;}
	main > div.block > div.container > div.row > div.col-sm-6 {padding-top:20px;}
	main > div.block > div.container > div.row > div.col-sm-6:first-child {padding-top:0;}
	
	main.subpage > nav {display:none;}
	
	/**
	 * 사이트푸터
	 */
	footer > div.container > div.contact > i.emblem {float:none; margin:0 auto; width:60px; height:60px;}
	footer > div.container > div.contact > div.address {width:100%; height:auto; padding-top:10px;}
	footer > div.container > div.contact > div.address > div {text-align:center; white-space:normal; line-height:20px; height:auto;}
	footer > div.container > div.copyright {margin-top:20px;}
	footer > div.container > div.copyright > div {text-align:center; width:100%;}
	footer > div.container > div.copyright > div.status {display:none;}
}

/**
 * 태블릿
 */
@media (min-width:768px) and (max-width:991px) {
	header {position:static;}
	header > div[data-role=visual] {position:fixed !important; top:0; left:0; width:100%; height:54px; z-index:60; padding-top:0; background:#10b8c3; box-shadow:1px 2px 2px rgba(0,0,0,0.1);}
	header > nav[data-role=global] {display:none;}
	header > div[data-role=visual] > nav[data-role=navigation] {height:54px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container {position:relative;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 {padding:5px 0px; height:40px; margin:2px 0px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > h1 > a {background-position-x:-6px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul {display:none;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=sitemap] {display:none;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > button[data-action=slide] {display:block; margin:2px 0px;}
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a {padding:0px 10px; font-size:16px;}
	
	header > div[data-role=carousel] {height:160px; padding-top:54px;}
	header.index > div[data-role=carousel] {height:240px;}
	header > div[data-role=carousel]:after {display:none;}
	header > div[data-role=carousel] > div.container {width:740px;}
	header > div[data-role=carousel] > div.container > div.text {width:100%; text-align:center;}
	header > div[data-role=carousel] > div.container > div.text > h2 {font-size:26px;}
	header > div[data-role=carousel] > div.container > div.text > small {font-size:16px;}
	header > div[data-role=carousel] > div.container > div.text > ul > li {display:inline-block; padding-right:10px;}
	header > div[data-role=carousel] > div.container > div.text > ul > li > a {font-size:14px; height:40px; padding:0px 14px; line-height:38px;}
	header > div[data-role=carousel] > div.container > div.title > h2 {font-weight:400; font-size:24px; color:#fff;}
	header > div[data-role=carousel] > div.container > div.title > small {margin-top:16px;font-size:16px;}
	
	header > div[data-role=carousel] > div.container > div.login {display:none;}
	
	main div.block > div.container > h4 {font-size:28px; height:30px; line-height:30px;}
	main div.block > div.container > small {font-size:16px; min-height:30px;}
	
	main.widget {background:transparent;}
	main.widget > div.container > section {display:block; width:100%; padding:0px;}
	main.widget > div.container > aside {display:block; width:100%; vertical-align:top; box-sizing:border-box; padding:20px 0px 20px 20px; background:red;}
}

/**
 * 해상도가 작은 데스크탑
 */
@media (min-width:992px) and (max-width:1199px) {
	header > div[data-role=visual] > nav[data-role=navigation] > div.container > ul > li > a {padding:0px 15px;}
	header > div[data-role=carousel] > div.container {width:960px;}
}