@charset "utf-8";
@import "common.css";

/* layout */
body {font-size:1.000em; max-width:768px; margin:0 auto; background-color:#BBB;}
header ul, main, nav ul, footer ul {display:block; width:100%; margin:0 auto;}
main {font-size:1.167em; background-color:#FFF;}

header ul {border-bottom:1px solid #E5E5E5; background-color:#FFF;}
header ul li {display:block; text-align:center; padding:.5em 0;}
header ul li button {margin-top:.8em; background-color:rgba(255, 255, 255, 0);}
header ul li button:nth-of-type(1) {float:left; margin-left:.6em;}
header ul li button:nth-of-type(2) {float:right; margin-right:.6em;}

nav ul {text-align:center; background-color:#4388BF;}
nav ul li {display:inline-block; margin-right:-4px; width:19%; text-align:center;}
nav ul li a {display:block; font-size:1.083em; font-weight:bold; padding:1.3em 0;}
nav ul li a:link, nav ul li a:visited, nav ul li a:hover {color:#FFF;}
nav ul li a.nowPage {color:#FFF261;}

main > section {max-width:95%; min-height:195px; margin:0 auto; padding:1.5em 0 2em;}
main > section > h1 {border-bottom:2px solid #888;}
main > section > article {margin-top:1em;}

footer ul li a:link,
footer ul li a:visited {color:#DBDBDB;}
footer {clear:both; color:#DBDBDB; font-size:0.833em; text-align:center;}
footer div:nth-of-type(1) {background-color:#686868; padding:.8em 0;}
footer div:nth-of-type(1) ul li {display:inline;}
footer div:nth-of-type(1) ul li:last-of-type {position:absolute; margin-left:4em;}
footer div:nth-of-type(2) {background-color:#404040;}
footer div:nth-of-type(2) ul {padding:2em 0;}
footer div:nth-of-type(2) ul li p span {display:inline-block; margin-right:.6em;}


/* common */
h1, h2 {padding:0 0 .2em .2em; letter-spacing:-.05em;}
.topLogo {position:relative; display:inline-block; top:.4em; width:140px; height:41px; background:url("../../mobile/images/ci.png") no-repeat; background-size:100%; text-indent:-9999em;}
.jbanner > img {max-width:100%; height:auto;}

/* buttons */
button:not([class^=btn]) {border:1px solid;}
button.big, input[type=submit], input[type=button] {padding:.3em 1.5em .3em; font-size:1.167em; color:#FFF; border-radius:.2em;}
button.mid, input.mid {padding:.3em 1em .3em; font-size:0.917em; color:#FFF; border-radius:.2em;}
button.sml, input.sml {padding:.3em 1em .3em; font-size:0.583em; color:#FFF; border-radius:.2em;}
button.red, input.red {background-color:#FF5A3A; border-color:#FF5A3A;}
button.gry, input.gry {background-color:#777777; border-color:#666666;}
button.org, input.org {background-color:#FC9E01; border-color:#FC9E01;}
button.blu, input.blu {background-color:#248ACE; border-color:#248ACE;}
button.blk, input.blk {background-color:#2E2E2E; border-color:#000;}
button:disabled, input[type=submit]:disabled, input[type=button]:disabled {opacity: 0.5;}


/* 메인페이지 */
#mainImg {margin:0 auto; padding:1.5em 2em; color:#FFF; font-size:1.167em; background-color:#4B79AD;}

/* 메인페이지 게시물 추출 */
.noticeWrap {margin:1em;}
.noticeWrap .list li {margin:.45em .3em;}
.noticeWrap h4 {font-size:1.250em;}
.noticeWrap ul {margin-top:30px;}
.noticeWrap .more {margin-top:7px; font-size:1.000em;}

/* 메인 퀵메뉴 */
#quickArea {padding:1em .5em 1.5em; text-align:center;}
#quickArea ul li {display:inline-block; margin:0 -4px; width:25%; border:1px solid #CCC;}
#quickArea ul li:not(:last-of-type) {border-right:0;}
#quickArea ul li a {display:block; font-weight:bold; padding:20% 0;}

/* 사이트맵 */
#sitemap a {display:block; width:90%; padding:0 .5em 1em;}


/* 전체스킨 */
.skinWrap {font-size:0.917em;}
.skinWrap > .skinWrap {font-size:1.000em;}


/* media queries */
@media only screen and (max-width:430px) {
	body {font-size:0.750em;}
	.featherlight .featherlight-close-icon {font-size:2.250em;}
}