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

/* layout */
header ul, main, nav ul, footer ul, {display:block; max-width:100%; margin:0 auto;}
main {display:block; max-width:95%; margin:2em auto; font-size:1.167em;}

header {background-color:rgb(255,255,255);}
header ul li {display:block; text-align:center; padding:.5em 0;}
header ul li button {margin-top:1em; 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 {margin:1em auto;}
nav ul {text-align:center; padding-right:5px;}
nav ul li {display:inline-block; margin-right:-5px; width:19.8%; border:1px solid #CCC; text-align:center; line-height:2; border-right:0;}
nav ul li:last-of-type {border-right:1px solid #CCC;}
nav ul li a {display:block; padding:15% 0 10%;}
nav ul li img {width:40px;}
nav ul li b {display:block;}
nav ul li.nowFolder {border-color:#686868; background-color:#686868; color:#FFF;}
nav ul li.nowFolder a {color:#FFF;}

main > section {margin-bottom:.2em;}
main > section > h1 {border-bottom:2px solid #888;}
main > section > h1, main section > h2 {padding-bottom:.2em;}
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 */
body,table,input,textarea,select,button {font-family:Malgun Gothic,'맑은 고딕';}
h1, h2 {letter-spacing:-.05em;}
h2 {margin-bottom:.2em;}
a:hover {color:#9318B1;}
.topLogo {position:relative; display:inline-block; top:.8em; width:185px; height:41px; background:url('/mC01/images/ci.png') no-repeat; background-size:100%; text-indent:-9999em; background-size: 185px 41px;}


/* 메인페이지 */
#main01 {margin:52% auto 0; width:98%;}
#main01 > div {margin:0 auto; text-align:center;}
#main01 > div span {display:inline-block; width:103px; height:80px; vertical-align:top; text-align:left;}
#main01 > div:first-of-type > span:not(:first-of-type) {margin-left:-3.5px;}
#main01 > div:last-of-type > span:not(:first-of-type) {margin-left:-3.5px;}
#main01 > div span p {position:relative; top:.4em; left:.5em;}
#main01 > div:first-of-type > span:nth-of-type(1) {background:url('/mC01/images/banner01.gif') no-repeat; background-size:100%; opacity:0.92;}
#main01 > div:first-of-type > span:nth-of-type(2) {background:url('/mC01/images/banner02.gif') no-repeat; background-size:100%;}
#main01 > div:first-of-type > span:nth-of-type(3) {background:url('/mC01/images/banner03.gif') no-repeat; background-size:100%;}
#main01 > div:last-of-type > span:nth-of-type(1) {background:url('/mC01/images/banner04.gif') no-repeat; background-size:100%;}
#main01 > div:last-of-type > span:nth-of-type(2) {background:url('/mC01/images/banner05.gif') no-repeat; background-size:100%;}
#main01 > div:last-of-type > span:nth-of-type(3) {background:url('/mC01/images/banner06.gif') no-repeat; background-size:100%; opacity:0.92;}

#main01 > div > span p:nth-of-type(1) {font-size:0.833em; color:#838483; letter-spacing:-.05em;}
#main01 > div > span p:nth-of-type(1) b {font-size:1.667em;}
#main01 > div > span p:nth-of-type(2) {font-size:0.833em; font-weight:bold; color:#ABABAB;}
#main01 > div:first-of-type > span:nth-of-type(1) p:nth-of-type(1) {color:#FFF;}

#main01 > div:first-of-type > span:nth-of-type(1) b {color:#FFC85B;}
#main01 > div:first-of-type > span:nth-of-type(1) p {color:#FDE9BE;}

#main01 > div:first-of-type > span:nth-of-type(3) b {color:#FFF;}
#main01 > div:first-of-type > span:nth-of-type(3) p {color:#ACAAAB;}

#main01 > div:last-of-type > span:nth-of-type(2) b {color:#9E9166;}
#main01 > div:last-of-type > span:nth-of-type(2) p {color:#B3AA87;}

#main01 > div:last-of-type > span:nth-of-type(3) p {color:#FFF;}
#main01 > div:last-of-type > span:nth-of-type(3) p:nth-of-type(3) {left:.3em; color:#FDFAAB; margin-top:.3em; font-size:1.167em; font-weight:bold;}
#main01 > div:last-of-type > span:nth-of-type(3) p:nth-of-type(3) a {color:#FDFAAB;}
#main01 > div:last-of-type > span:nth-of-type(3) p:nth-of-type(4) {font-size:0.833em;}

#main02 {padding:1em 0 .5em; background-color:#FFF;}
#main02 h3 {padding-bottom:.2em; margin:0 0 .7em .7em; font-size:1.167em; letter-spacing:-.05em;}
#main02 h3 b {font-size:1.250em; padding:0 .2em .5em 0;}
#main02 h3 a {color:#515151;}
#main02 .noticeWrap .gallery {margin-top:-1em; text-align:center;}
#main02 .noticeWrap .gallery li div {text-align:left;}


/* 서브페이지 */
main > section > article {min-height:155px;}

/* 사이트맵 */
#sitemap a {display:block; width:90%; padding:.5em; font-size:1.167em;}


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


/* media queries */
@media (min-width:320px) { 
	.noticeWrap .gallery li {width:71px !important;}
	.noticeWrap .gallery li > img {height:47px;}
	.boardWrap #gallery ul li {width:143px !important;}
	.boardWrap #gallery ul li > img {height:95px;}
}
@media (min-width:360px) { 
	#main01 > div span {width:116px; height:90px; font-size:1.000em;}
	#main01 > div:last-of-type > span:nth-of-type(1) p:nth-of-type(3) {top:1.2em; margin-left:.1em;}
	#main01 > div:last-of-type > span:nth-of-type(1) p:nth-of-type(4) {top:1.6em;}
	.noticeWrap .gallery li {width:82px !important;}
	.noticeWrap .gallery li > img {height:54px;}
	.boardWrap #gallery ul li {width:163px !important;}
	.boardWrap #gallery ul li > img {height:108px;}
}
@media (min-width:568px) { 
	#main01 > div span {width:184px; height:143px; font-size:1.667em;}
	.noticeWrap .gallery li {width:133px !important;}
	.noticeWrap .gallery li > img {height:87px;}
	.boardWrap #gallery ul li {width:170px !important;}
	.boardWrap #gallery ul li > img {height:113px;}
}
@media (min-width:640px) { 
	#main01 > div span {width:206px; height:160px; font-size:1.833em;}
	#main01 > div:last-of-type > span:nth-of-type(1) p:nth-of-type(3) {top:1.6em;}
	#main01 > div:last-of-type > span:nth-of-type(1) p:nth-of-type(4) {top:2.3em;}
	.noticeWrap .gallery li {width:152px !important;}
	.noticeWrap .gallery li > img {height:101px;}
	.boardWrap #gallery ul li {width:194px !important;}
	.boardWrap #gallery ul li > img {height:129px;}
}