@charset "utf-8";
/* CSS Document */

body{ 
	background: url(../images/idxtop.jpg) no-repeat;
	background-position: center 110px;
}
#navbar {background:#ccc; position:absolute; z-index:1; top:109px; left:0px; width:100%; height:1px; }

#wrap{width:1080px;margin:0px auto;color:#636363}
header{height:110px;position:relative;z-index:auto;}
#topmn { position:absolute;z-index:auto;top:10px;right:15px; font-size:95%; letter-spacing:-0.05em; color:#ccc; }
#topmn>a>img{ vertical-align:-2px; opacity:0.7 }
#topmn>a>img:hover{opacity:1 }

/*navigation*/
#nav {float:right;width:780px;height:40px;line-height:40px;display:block;margin-top:60px; font-family: "Noto Sans KR"; }
#nav>li{list-style:none;float:left;position:relative;z-index:3}
#nav>li>a {display:inline-block;margin:0px 35px 10px 35px; font-size:150%; font-weight:500; color:#000; padding:0px 7px; letter-spacing:-0.05em}
#nav>li>section{ position:absolute; z-index:4; top:20px; line-height:35px; height:35px; display:none; font-size:115%; padding:0px 10px }
#nav>li>section>a{float:left;display:block;padding:0px 10px;font-weight:500;letter-spacing:-0.03em;color:#fff; opacity:0.7}
#nav>li>section>a:hover{color:#fff; opacity:1}
#nav>li>a.nvon{ color: #00325D; }

#logoimg{ display: block; padding-top: 40px; }

#nav>li>section>a:hover{color:#fff; opacity:1}

#topani{ height: 320px; position: relative; z-index: auto}
#topani>div{ position: absolute; z-index: auto; opacity: 0; }
#idxain01{ top:109px; left:20px }
#idxain02{ top:104px; left:264px; }
#idxain03{ font-family: "Noto Sans KR"; font-size: 130%; font-weight: 500; letter-spacing: -0.02em; top:200px; left: 80px; line-height: 150%; }

#ctsWrap {min-height:765px; }

.idxbox{ float: left; width: 280px; height: 280px; padding:40px; font-family: "Noto Sans KR"; font-weight: 500; letter-spacing: -0.03em; color:#fff; }
.idxbox>h1{ font-size: 120%; }
.idxbox>h2{ font-size: 220%; margin:10px 0px 20px 0px; }
.idxbox>h2+div{ font-size: 115%; line-height: 160%; opacity: 0.5; }
.idxbox>h2+div+p>span{ display: inline-block; background: #343E44; width:30px; line-height: 30px; text-align: center; font-size: 140%; margin-top: 20px; }
#idxbox01{ background: #0080ff url(../images/idxbox01.png) no-repeat right bottom; cursor: pointer; }
#idxbox01>h1{ color:#00325d }
#idxbox01>h2+div+p>span{ background: #00325D; }
#idxbox02{ background: #00325d url(../images/idxbox02.png) no-repeat right bottom; cursor: pointer; }
#idxbox02>h1{ color:#576269 }
#idxbox03{ background: #343e44 }
#idxbox03>h1{ color:#576269 }
#idxbox03>h2{ font-family: "Lusitana"; font-size: 300%; }
#idxquick{ border-top:1px dotted #1f2529; text-align: center; margin-top:30px; padding-top: 30px; }
#idxquick>a{ display: inline-block; padding: 0px 10px; font-size: 120%; color:#aeb0b2; line-height: 150%; }

#idxex{ clear: both; padding-top: 90px; font-family: "Noto Sans KR"; letter-spacing: -0.05em; }
#idxex>h1{ font-size: 240%; font-weight: 600; text-align: center;  background:url(../images/gdot.jpg) repeat-x center; margin-bottom: 40px;}
#idxex>h1>span{ background: #fff; padding: 0px 20px; color:#00325D; }
#idxex>h1>span>span{ font-size: 70%; }

footer { clear:both; height:270px; background:#2b2b2b}
footer>section{ width: 1080px; margin: auto; }
footer>section>div:first-child{ padding: 35px 0px 20px 0px; border-bottom: 1px solid #555; text-align: center }
footer>section>div:last-child{ border-top:1px solid #000; color:#707070; text-align: center; padding-top: 25px; }
footer>section>div:last-child>p{ margin-top:15px}

.idxgallery{ float: left; width: 255px; }
.idxgallery:not(:last-child){ margin-right: 20px; }
.idxgallery>a{ width: 100%; height:160px; display: block; overflow: hidden; }
.idxgallery>a>img{ width: 100%;}
.idxgallery>a+div>a{ display: inline-block;  font-size: 130%; padding: 15px 0px; }

/*popup*/
#popupsys{ display:none; }