@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,500);
@import url(https://cdn.jsdelivr.net/gh/theeluwin/NotoSansKR-Hestia@master/stylesheets/NotoSansKR-Hestia.css);
@import url(http://cdn.jsdelivr.net/font-notosans-kr/1.0.0-v1004/NotoSansKR-2350.css);
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');
@import url(https://cdn.jsdelivr.net/xeicon/2/xeicon.min.css);
@import url(css/blank.css);

*{margin:0; padding:0; box-sizing:border-box;letter-spacing:-0.02em;color:inherit;}
html,body {height:100%;}
img {border:0; vertical-align:top;}
a {border:0; text-decoration:none;}
ul, li {list-style:none;}
body {font-family: 'NotoSansKR','Noto Sans Korean','Noto Sans KR','Nanum Gothic','Roboto', sans-serif; color:#303030;}
div {display:block;}
h1,h2,h3,h4,h5 {font-weight:300;line-height:1.3}
b {letter-spacing:inherit;font-weight:700}
.inner {width:1200px;margin:auto;clear:both;}
.inner2 {width:1100px;margin:auto;clear:both}
.c_main {color:#ad000d !important;}
.c_sub1 {color:#f4d495 !important;}
.c_sub2 {color:#d88108 !important;}

.c_lightgray {color:#b0b0b0 !important}
.c_gray {color:#808080 !important}
.c_red {color:#c70000 !important}
.c_white {color:#fff !important}


h1 {font-size:50px;}
h1.big {font-size:60px;}
h1.font66 {font-size:66px;}
h2 {font-size:40px}
h3 {font-size:30px;}
h4 {font-size:24px;line-height:1.5}
h5 {font-size:20px;line-height:1.6}
p {font-size:18px;font-weight:200;line-height:1.7;color:inherit;word-break:keep-all }
p.small {font-size:16px;}
.roboto {font-family:'Roboto';}
.thin {font-weight:100;}
.bold {font-weight:700;}
.tight {letter-spacing:-0.05em !important;}
.loose {letter-spacing:0.2em !important;}
.font30 {font-size:30px !important;}
.font20 {font-size:20px !important;}
.txtshadow {text-shadow:1px 1px 1px rgba(0,0,0,0.3);}
.ind5 {text-indent:5px;}

span {color:inherit}

.float {float:left !important;}
.float_r {float:right !important;}
.left {text-align:left !important}
.right {text-align:right !important}
.center {text-align:center !important}
.clearfix:after {content:"";clear:both;}
.relative {position:relative;}




.bd_b {border-bottom:1px #d0d0d0 solid}
.bd_t {border-top:1px #d0d0d0 solid}
.bd_r {border-right:1px #d0d0d0 solid}
.bd_l {border-left:1px #d0d0d0 solid}



/* 폭 설정 */
.half {width:50% !important}
.col5 {width:20% !important;}
.col4 {width:25% !important;}
.col3 {width:33.33% !important;}
.w30 {width:30% !important;}
.w40 {width:40% !important;}
.w48 {width:48% !important;}
.w55 {width:55% !important;}
.w60 {width:60% !important;}
.w70 {width:70% !important;}
.w75 {width:75% !important;}
.w90 {width:90% !important;}
.w100 {width:100% !important;}



/* 위치 설정 */
.relative {position:relative;}
.absolute {position:absolute;}



/* 공통 */
#wrap {width:100%; min-width:1200px; height:100%; margin:auto; position:relative; }

h1.logo {width:266px;height:65px;background-image:url(images/logo.png);text-indent:-3333px;background-size:cover;}
h1.logo.white {background-image:url(images/logo_w.png);}


a.go {padding:15px 20px;font-size:18px;line-height:1 !important;border:1px #fff solid;color:#fff;}
a.go span {margin-right:30px;}

a.go.color {border:1px #555 solid;color:#555;}
a.go.color:before {background:#555;}
a.go.color:hover, a.go.color:focus, a.go.color:active {
  color: #fff;
}

/* Sweep To Right */
a.go {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
a.go:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
a.go:hover, a.go:focus, a.go:active {
  color: #333;
}
a.go:hover:before, a.go:focus:before, a.go:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}



#header {width:100%; height:95px; border-bottom:1px rgba(255,255,255,0.3) solid; color:#fff; position:absolute; top:0; z-index:1; }
#header .logo {float:left;margin:18px 0 0;}

#header .site {position:absolute; right:0; top:-35px; color:#fff; font-size:14px;}
#header .site span {margin-left:10px;}


#header #gnb {float:right;}
#header #gnb > ul {line-height:95px;}
#header #gnb > ul > li {float:left;width:200px;}
#header #gnb > ul > li a {display:block;-webkit-transition:all 0.2s ease-out;transition:all 0.2s ease-out;text-align:center;font-size:20px;text-align:left; padding-left:15px;}
#header #gnb > ul > li a.on,#header #gnb > ul > li a:hover {font-weight:bold;}
#header #gnb .subnav { margin:auto;
background:rgba(0,0,0,0.6);
color:#fff;
width:100%;
 clear:both;
 display: none;
 position: absolute;
  z-index:10;
  text-align:left;
  top:95px;
  left:0;
  font-size:15px;
 }
#header #gnb .subnav dl {float:left;width:200px;padding:10px 0;-webkit-transition:all 0.3s ease-out;transition:all 0.3s ease-out;min-height:244px;}
#header #gnb .subnav dl:hover {background-color:rgba(0,0,0,0.5);}
#header #gnb .subnav dd {line-height:32px;}
#header #gnb .subnav a:hover {font-weight:bold;color:#ad000d;}
#header #gnb .subnav a {display:block;padding:0 15px;}



/* 공통 하단 */
#footer {width:100%; min-width:1200px; margin:auto; position:relative; background-color:#fff; border-top:2px #505050 solid; float:left; padding:30px 0; display:inline-block;}
#footer .inner {position:relative;}
#footer .inner > * {float:left}
#footer .inner .logo {opacity:0.6;}
#footer .inner .txt span {font-size:16px;display:inline-block;margin-right:10px;font-weight:200;line-height:1.5;}
#footer a#back-top {position:absolute; right:0; }




/************************************************************************
********************************* 메인 *********************************/

#main {width:100%; min-width:1200px; float:left; position:relative;display:inline-block;}

#main .flexslider.visual {text-align:center;}
#main .flexslider.visual div .inner {padding-top:260px;}
#main .main_sl1 {background:url(images/main_sl1.jpg) center no-repeat;height:730px;}
#main .main_sl2 {background:url(images/main_sl2.jpg) center no-repeat;height:730px;}
#main .main_sl3 {background:url(images/main_sl3.jpg) center no-repeat;height:730px;}
#main .main_sl4 {background:url(images/main_sl4.jpg) center no-repeat;height:730px;}
#main .flexslider.visual .flex-direction-nav {top:-330px; width:1200px;}
#main .flexslider.visual .flex-direction-nav a.flex-prev {left: 10px;}
#main .flexslider.visual .flex-direction-nav a.flex-next {left: 60px;}


#main > div {float:left;width:100%;}
#main > div > .inner {height:100%;}
#main > div > .inner > div {float:left;}

#main #part_top {width:100%;margin:90px auto;}
#main #part_top .flexslider.tech {width:790px;height:457px;}
#main #part_top .flexslider.tech li > div {height:457px;text-align:center;}
#main #part_top .flexslider.tech li > div a {display:block;height:inherit;padding-top:130px;}
#main #part_top .sl1 {background:url(images/main_business1.jpg) center top no-repeat;}
#main #part_top .sl2 {background:url(images/main_business2.jpg) center top no-repeat;}
#main #part_top .sl3 {background:url(images/main_business3.jpg) center top no-repeat;}
#main #part_top .sl5 {background:url(images/main_business5.jpg) center top no-repeat;}
#main #part_top .sl5 a {padding-top: 50px !important;}
#main #part_top .sl5 a > * {line-height: 1.4;}
#main .flexslider.tech .flex-direction-nav {bottom:80px; }
#main .flexslider.tech .flex-direction-nav a.flex-prev {left: 44%;}
#main .flexslider.tech .flex-direction-nav a.flex-next {right: 44%;}

#main #part_top .float_r {width:385px;}
#main #part_top .float_r a {display:block;height:215px;padding:25px 30px;background-position:right center;}
#main #part_top .float_r a h2 {line-height: 1.1;}
#main #part_top .float_r a.greeting {background-image:url(images/main_greeting.jpg);}
#main #part_top .float_r a.client {background-image:url(images/main_client.jpg); margin-top:27px;}


#main #portfolio {background:url(images/main_pf.jpg) center no-repeat;height:389px; padding-top:100px;}
#main #portfolio a.first {margin-right:10px;}

#main #contact {width:100%;margin:30px auto;}
#main #contact .inner {background:url(images/main_contact.png) top center no-repeat;height:118px;}
#main #contact .inner > div {height:inherit;}
#main #contact a {float:left;height:inherit;display:block;width:95px;padding-top:90px;text-align:center; margin-left:65px;font-size:20px;}
#main #contact a.first {margin-left:52px;}
#main #contact h1 {line-height:1.2;}



#main #map {width:100%;height:500px;overflow:hidden;}
#main #map .absolute {top:0;left:50%;margin-left:183px;width:350px;height:250px;background-color:#666261; color:#fff; padding:40px 30px;z-index:10;}

#main #map .root_daum_roughmap {width:100%;overflow:hidden;padding:0;height:500px;border:0 !important;}





/************************************************************************
********************************* 서브 *********************************/

#sub {width:100%; min-width:1200px; float:left;}

/* 카테고리별 상단 */
#sub .subtop {width:100%;height:454px;position:relative;background-position:top center; padding-top:200px;text-align:center;}
#sub .subtop .inner {padding-left:10px;}
#sub .subtop#sub1 {background-image:url(images/subtop1.jpg);}
#sub .subtop#sub2 {background-image:url(images/subtop2.jpg);}
#sub .subtop#sub3 {background-image:url(images/subtop3.jpg);}

/* 서브메뉴 */
#sub .snb {width:100%; height:59px; line-height:58px; border-bottom:1px #d0d0d0 solid;}
#sub .snb .inner > * {float:left;}
#sub .snb a.home {display:block;width:58px;height:58px;background-color:#d0d0d0;color:#fff;text-align:center;}

#sub .snb .route {width:270px; color:#555; position:relative; padding:0 20px;}
#sub .snb .route.depth1 {width:220px;}
#sub .snb .route:after {content:"|"; font-weight:100; color:#ddd; position:absolute; right:1px; line-height:inherit; top:0; font-size:24px;width:1px;}
#sub .snb .route p {line-height:inherit;cursor:pointer;}
#sub .snb .route p i {color:#d0d0d0; float:right;line-height:inherit;}
#sub .snb .route .subnav { margin:auto;
background:#fff;
color:#555;
width:100%;
 clear:both;
 display: none;
 position: absolute;
  z-index:10;
  text-align:left;
  top:58px;
  left:0;
  font-size:15px;
  padding-bottom:10px;
  border:1px #d0d0d0 solid;
  border-top:0;
 }
#sub .snb .route .subnav li {line-height:40px;}
#sub .snb .route .subnav a:hover {font-weight:bold;}
#sub .snb .route .subnav a {display:block;padding:0 20px;}
#sub .snb .route .subnav a.on {background-color:#f5f5f5;}



/* 서브 내용 */
#sub #content {width:100%; margin:100px auto;     overflow: hidden;}
#sub #content .paragraph {width:100%;display:inline-block; position:relative}
#sub #content .row {width:100%;display:inline-block;position:relative;clear:both}
#sub #content .bg_bullet {background:url(images/bullet.gif) left 10px no-repeat;}
#sub #content .bg_gray {background-color:#f5f5f5;}
#sub #content .borderbox {border:1px #d0d0d0 solid; border-radius:5px; padding:20px 30px;}
#sub #content hr.part {width:100%;height:1px;background-color:#d0d0d0;border:0;}
#sub #content hr.top {width:100%;height:1px;background-color:#555;border:0;}
#sub #content .title {background:url(images/title.gif) top left no-repeat; padding-left:50px; padding-top:18px;}
#sub #content h3.subject {background:url(images/subject.gif) top left no-repeat; padding-top:15px; margin-bottom:15px;}
#sub #content .shadow {box-shadow:3px 3px 5px rgba(0,0,0,0.1);}
#sub #content .img_bd {border:1px #e0e0e0 solid;}


/* 이미지 높이에 따른 단락 높이조절 설정 */
#sub #content .flex {display: flex !important;}
#sub #content .flex .col {flex: 1;}
#sub #content .flex .vertical_wrap {display:table !important;height:100% !important;}
#sub #content .flex .vertical_wrap .vertical_cont {display:table-cell !important;vertical-align:middle !important;}




.paragraph.history_area {height:auto;}
.paragraph.history_area .line {width:1px;height:100%;background:url(images/history_bg.gif) bottom center no-repeat #d0d0d0; position:absolute;left:50%; top:15px; z-index:-1;}
.paragraph.history_area .hbox {width:100%; display:inline-block; margin-bottom:58px; clear:both;}
.paragraph.history_area .hbox > * {float:left;}
.paragraph.history_area .hbox h3.year {color:#00a5ed; font-weight:bold; font-family: "Roboto";}
.paragraph.history_area h3.year,.paragraph.history_area .story {width:46%;}
.paragraph.history_area .circle {width:8%;text-align:center}
.paragraph.history_area .circle span {width:8px;height:8px;border:6px #e0e0e0 solid;display:inline-block;background-color:#00a5ed; margin-top:10px;box-sizing:content-box;}
.paragraph.history_area ul.bullet li {color:#777;padding-left:30px !important}
.paragraph.history_area ul.bullet li:before {content:"" !important; }
.paragraph.history_area ul.bullet li .month {color:#000; margin-left:-30px;float:left;line-height:1.8; font-weight:700; font-size:18px;}
.paragraph.history_area .right ul.bullet li {margin-bottom:5px;padding-right:30px;}
.paragraph.history_area .right ul.bullet li:before {}
.paragraph.history_area .right ul.bullet li .month {margin-right:-30px;float:right;}



/* 리스트 */
#sub #content ul.bullet li {background:url(images/bullet.gif) left 14px no-repeat;padding-left:22px;margin:2px 0;}

#sub #content .bulletbox p {border:1px #d0d0d0 solid; border-radius:5px;padding:10px;background:url(images/bullet.gif) 20px center no-repeat; padding-left:50px;font-weight:500;float:left;margin:3px auto;width:100%;}
#sub #content .bulletbox.p2 p {width:49.5%;margin-right:0.5%;}
#sub #content .bulletbox.p3 p {width:32.8%;margin-right:0.5%;}
#sub #content .bulletbox.p4 p {width:24.5%;margin-right:0.5%;}
#sub #content .bulletbox.p5 p {width:19.5%;margin-right:0.5%;}




/* 테이블 */
#sub #content table.basic {border-top:2px #555 solid;}
#sub #content table.basic th,#sub #content table.basic td {padding:8px 20px;}
#sub #content table.basic .bg_gray {background-color:#f5f5f5;}
#sub #content table.basic th {border-bottom:1px #d0d0d0 solid;}
#sub #content table.basic td {border-bottom:1px #e0e0e0 solid;}

#sub #content table.basic2 th,#sub #content table.basic2 td {padding:8px 5px;}
#sub #content table.basic2 .bg_gray {background-color:#f5f5f5;}
#sub #content table.basic2 th {border-bottom:1px #555 solid;text-align:inherit;}
#sub #content table.basic2 td {border-bottom:1px #e0e0e0 solid;}
#sub #content table.basic2 .first th {border-top:1px #555 solid;}
#sub #content table.basic2 .first td {border-top:1px #d0d0d0 solid;}





/* 넘버링 */
#sub #content .cnt {counter-reset:ctn 0;}
#sub #content .cnt .number p {margin-top:6px;padding-left:20px;margin-left:5px;}
#sub #content .cnt .number p.first {margin-top:0}
#sub #content .cnt .number p:before {content:counter(ctn,decimal); counter-increment:ctn 1;width:20px;height:20px;background:#888;color:#fff;line-height:20px;border-radius:20px;text-align:center;font-weight:500;display:inline-block;margin-right:5px;margin-left:-23px;}







/* 탭 */
#sub #content ul.tabs {}

#sub #content ul.tabs li { float:left; text-align:center; color:#555; font-size:18px; padding-bottom:10px;border-bottom:1px #fff solid;-webkit-transition:all 0.3s ease-out;transition:all 0.3s ease-out;}
#sub #content ul.tabs li a {display:block;}
#sub #content ul.tabs li:hover,#sub #content ul.tabs li.active {color:#ad000d;border-bottom:1px #ad000d solid;font-weight:bold;}
#sub #content .tab_container {width:100%;display:inline-block; }
#sub #content .tab_content {width:100%;min-height:280px;display:inline-block;}
#sub #content ul.tabs.p2 li {width:50%;}
#sub #content ul.tabs.p4 li {width:25%;}
#sub #content ul.tabs.p5 li {width:20%;}
#sub #content ul.tabs.p6 li {width:16.66%;}
#sub #content ul.tabs.p8 li {width:12.5%;}



/* 게시판 */
#sub #content .board_box {width:100%;display:inline-block;font-size:15px;line-height:1.7;min-height:500px}
#sub #content .board_box font {font-family:inherit !important;font-size:inherit !important;}
