@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); 
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(http://cdn.jsdelivr.net/font-nanum/1.0/nanumbarungothic/nanumbarungothic.css);
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');


@media screen and (max-width:320px) {
     body {zoom:50%;}
 }
 @media screen and (min-width:321px) and (max-width:359px) {
     body {zoom:50%;}
 }
 @media screen and (min-width:360px) and (max-width:374px) {
     body {zoom:55.5%;}
 }
 @media screen and (min-width:375px) and (max-width:375px) {
     body {zoom:58.5%;}
 }
 @media screen and (min-width:376px) and (max-width:479px) {
     body {zoom:64.6%;}
 }
 @media screen and (min-width:480px) and (max-width:639px) {
     body {zoom:75%;}
 }
  /* 아이패드(1024X768)보다 큰 스크린 사이즈와 해상도를 갖는 모든 기기에서의 해상도 설정
 @media all and (min-width: 640px) {
     body {width:640px; margin:0 auto;}
  */
  @media all and (min-width: 640px) {
     body {zoom:100%; margin:0 auto;}
 }


*{margin:0; padding:0; color:inherit; box-sizing:border-box; letter-spacing:-0.03em;}
img {border:0;vertical-align:top;}
a {border:0; text-decoration:none; color:inherit;}
ul, li {list-style:none;}
div {display:block;}
body {font-family: 'Roboto', 'Nanum Gothic',sans-serif; color:#303030;max-width:640px}
h1,h2,h3,h4,h5 {font-family: 'Roboto', 'Noto Sans KR','Nanum Barun Gothic';font-weight:300;letter-spacing:-0.08em;line-height:1.25}
h1 b,h2 b,h3 b,h4 b,h5 b {font-weight:500}
h1 {font-size:50px;font-weight:100;}
h2 {font-size:40px}
h3 {font-size:30px;}
h4 {font-size:24px;}
h5 {font-size:20px;line-height:1.5}
p {font-size:16.5px;line-height:170%;color:inherit}

.c_main {color:#1f3d97 !important}
.c_navy {color:#15275e !important}
.c_sky {color:#92c1f1 !important}
.c_lightgray {color:#a0a0a0 !important}
.c_darkgray {color:#535353 !important}
.c_gray {color:#808080 !important}
.c_white {color:#fff !important}


.bg_gray {background:#f5f5f5;}
.top_bar {background:url(images/bar.gif) top left no-repeat;padding-top:10px}
.mj {font-family: 'Nanum Myeongjo' !important; letter-spacing:-0.1em !important}
.img100 {width:100%;height:auto}

/* 크기 및 정렬 설정 */
.inner {width:600px;margin:auto}
.center {text-align:center !important}
.left {float:left}
.right {float:right}

/* 마진,패딩 설정 */
.mg0 {margin-left:0 !important;margin-right:0 !important}

.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}
.mt70 {margin-top:70px;}
.mt80 {margin-top:80px;}

.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}
.mb70 {margin-bottom:70px;}
.mb80 {margin-bottom:80px;}

.pd0 {padding-left:0 !important;padding-right:0 !important;}

.pl10 {padding-left:10%;}
.pl20 {padding-left:20%;}
.pl30 {padding-left:30%;}
.pl40 {padding-left:40%;}
.pl50 {padding-left:50%;}
.pl60 {padding-left:60%;}
.pl70 {padding-left:70%;}
.pl80 {padding-left:80%;}

.pr10 {padding-right:10%;}
.pr20 {padding-right:20%;}
.pr30 {padding-right:30%;}
.pr40 {padding-right:40%;}
.pr50 {padding-right:50%;}
.pr60 {padding-right:60%;}
.pr70 {padding-right:70%;}
.pr80 {padding-right:80%;}

.ml0 {margin-left:0 !important;}
.mr0 {margin-right:0 !important;}

/* 보더 설정 */
.bd_t {border-top:1px #e0e0e0 solid;}
.bd_b {border-bottom:1px #e0e0e0 solid;}
.bd_l {border-left:1px #e0e0e0 solid;}
.bd_r {border-right:1px #e0e0e0 solid;}



#wrap {width:100%;  margin:0 auto; background:#fff;}
#header {width:100%; height:170px;line-height:0;}
#header .header_logo {float:left;margin-top:26px}
#header .tel {float:right; margin-top:26px;}

#gnb {width:100%;height:60px;line-height:60px;background:#15275e;color:#fff;display:inline-block;margin-top:24px;padding:0 20px;text-align:center}
#gnb ul {display:inline-block;width:100%}
#gnb ul li {float:left;width:20%;font-size:20px}
#gnb ul li a.on {color:#88d4ff;font-weight:bold}



#main {width:100%;position:relative;line-height:0;}

#main .icon {width:100%;display:inline-block;position:relative;margin-top:-130px;z-index:1;padding:16px 20px;background:rgba(21,39,94,0.9);-webkit-background:rgba(21,39,94,0.9);color:#fff}
#main .icon ul li {float:left;width:100px;height:96px;text-align:center}
#main .icon ul li a {background-image:url(images/main_icon.png);background-repeat:no-repeat;display:block;height:96px;padding-top:70px;line-height:1.2;font-size:15px;letter-spacing:-1px}
#main .icon ul li.icon1 a {background-position:0 center}
#main .icon ul li.icon2 a {background-position:-100px center}
#main .icon ul li.icon3 a {background-position:-200px center}
#main .icon ul li.icon4 a {background-position:-300px center;padding-top:60px}
#main .icon ul li.icon5 a {background-position:-400px center}
#main .icon ul li.icon6 a {background-position:-500px center}


#main .content {background:url(images/main_content.png) center no-repeat;height:387px;margin:30px 0}
#main .content li {float:left;width:50%;}
#main .content li.portfolio a,#main .content li.record a {height:261px;}
#main .content li.cs a,#main .content li.location a {height:126px;}
#main .content li a {display:block;text-indent:-3333px}


#footer {width:100%;display:inline-block;position:relative;text-align:center}
#footer .tel {width:100%;display:inline-block;}
#footer .tel a {display:block;text-indent:-3333px}
#footer .tel .big {width:100%;height:115px;background:url(images/footer_tel_big.png) center no-repeat}
#footer .tel .big a {height:115px;}
#footer .tel .small {width:100%;height:115px;background:url(images/footer_tel_small.png) center no-repeat;}
#footer .tel .small li {float:left;width:33%;height:100%;}
#footer .tel .small li a {height:100%;}
#footer .contact {width:100%;border-bottom:1px #d0d0d0 solid;line-height:56px;display:inline-block;}
#footer .contact ul {float:right;position:relative;left:-50%;}
#footer .contact li {float:left;position:relative;left:50%;padding:0 10px;font-size:20px}

#footer .txt_area {display:inline-block;padding:20px;width:100%;}
#footer .txt_area span {padding:0 6px;line-height:150%;font-size:13px;}
#footer .txt_area span a {font-size:18px;font-weight:bold}





/* 서브 */
#sub {width:100%;display:inline-block; position:relative;}
#sub .snb {width:100%;min-height:60px;line-height:60px;background:url(images/snb_bg.png) top repeat-x #1f3d97;display:inline-block}
#sub .snb ul {padding:0 20px}
#sub .snb li {float:left;font-size:18px;padding:0 20px}
#sub .snb li a {color:#d0d0d0}
#sub .snb li a.on {color:#fff;font-weight:bold}



#sub #content {width:100%;display:inline-block;margin:60px auto 10px;position:relative;}
#sub #content h1.subject {background:url(images/subject.png) center top no-repeat;padding-top:20px;text-align:center;margin-bottom:30px}
#sub #content .paragraph {width:100%; margin-bottom:60px;display:inline-block;}
#sub #content .paragraph .row {width:100%; display:inline-block;}
#sub #content .paragraph .row h3.title {width:100%;margin-bottom:10px}
#sub #content .paragraph .row .substance {width:100%;display:inline-block}


#sub #content .paragraph .sub1_1_2 {background:url(images/sub1_1_2_bg.png) top right no-repeat;padding:15px 0;margin-top:20px}

#sub #content .paragraph .mapline {background:url(images/mapline.png) center;height:70px;}
#sub #content .paragraph .mapline li {width:200px;height:70px;float:left;}
#sub #content .paragraph .mapline li a {display:block;height:70px;text-indent:-3333px}


/* 테이블 */
#sub #content .paragraph table.bagic {border-top:4px #1f3d97 solid;}
#sub #content .paragraph table.bagic th {background:#f5f5f5}
#sub #content .paragraph table.bagic th.telline {background:url(images/sub1_2_tel.png) center no-repeat;height:70px}
#sub #content .paragraph table.bagic th.nobd {border-bottom:0}
#sub #content .paragraph table.bagic th,#sub #content .paragraph table.bagic td {padding:12px 0;border-bottom:1px #e0e0e0 solid}
#sub #content .paragraph table.bagic td {border-left:1px #e0e0e0 solid}
#sub #content .paragraph table.bagic td.first {border-left:0}


/* 서브페이지 탭 */
#sub #content .menu { width:100%;display:inline-block;border:1px #d0d0d0 solid; position:relative;border-left:0;border-right:0;margin-bottom:40px}
#sub #content .menu li {float:left;text-align:center; font-size:18px;}
#sub #content .menu.p5 li {width:20%;}
#sub #content .menu.p2 li {width:50%;}
#sub #content .menu li a {display:block;line-height:60px;height:60px;}
#sub #content .menu li.active,#sub #content .menu li.active:hover { background:#1f3d97; color:#fff;}
#sub #content .menu li:hover {background:#f5f5f5}


#sub #content .paragraph ul.bullet li {background:url(images/bullet.gif) left 12px no-repeat; padding-left:14px;margin-bottom:5px}


#content .board_box {width:100%;text-align:justify;display:inline-block}
#content .board_box .table_02 td.bbsnewf5 > table > tbody > tr > td a img {width:180px !important; height:128px !important}
#content .board_box .board {font-size:12px;}
#content .board_box #post_area img {width:100% !important;height:auto !important;}