@charset "utf-8";

#wrap,
#fullpage,
#visual {height:100%}
/*** 회사 소개 **/
.ico_company,
.aft_company::after,
.bfr_company::before {display:inline-block; background:url(../img/ico_company.png) 0 0 no-repeat; font-size:0; line-height:0; text-indent:-9999px; vertical-align:top; content:'';}

.hd_s3 #header,
.hd_s4 #header,
.hd_s6 #header,
.hd_s7 #header {background:#fff; color:#333; border-bottom:1px solid rgba(0,0,0,0.1)}
.hd_s7 #header {background:#f5f5f5}
.hd_s3 #header h1 a,
.hd_s4 #header h1 a,
.hd_s6 #header h1 a,
.hd_s7 #header h1 a,
.hd_s7 #header h1 a {background-image:url(../img/logoC.png)}
.hd_s3 #header .wfix,
.hd_s4 #header .wfix,
.hd_s6 #header .wfix,
.hd_s7 #header .wfix {color:#444}
.hd_s3 #header span,
.hd_s4 #header span,
.hd_s6 #header span,
.hd_s7 #header span {background:#333}
#header.on::after {background-image:url(../img/logo_txt2.png); opacity:1}
.autoH {display:table; width:100%;}
.autoH .wrapper {display:table-cell; vertical-align:middle;}
#visual .fadeImgs {width:100%; height:100%;}
#visual .fadeImgs * {height:100%}
#visual .fadeImgs .item {background-position:50% 100%; background-repeat:no-repeat; background-size:cover;  background-attachment:fixed}
#visual .fadeImgs .bg1 {background-image:url(../img/company_visual1.jpg)}
#visual .fadeImgs .bg2 {background-image:url(../img/company_visual2.jpg)}
#visual .fadeImgs .bg3 {background-image:url(../img/company_visual3.jpg)}
#visual .fadeImgs::after {position:absolute; top:0; bottom:0; left:0; width:100%; height:100%; background:url(../img/dimm.png) 0 0 repeat rgba(0,0,0,0.25); content:'';}

#cont_visual {color:#fff; text-align:center}
#cont_visual .cmt {position:relative;}
#cont_visual .cmt > span {font-size:22px;}
#cont_visual .cmt strong {display:block; font-size:40px; font-weight:normal; letter-spacing:0}
#cont_visual .cmt strong::after {display:block; width:50px; height:1px; background:#fff; margin:20px auto 30px; content:''}
#cont_visual .cmt .desc {font-size:18px;}
#cont_visual .smr {margin-top:110px;}
#cont_visual .smr > li {display:inline-block; width:200px; height:280px; text-shadow:0 0 4px rgba(0,0,0,0.7); vertical-align:top; cursor:pointer; transition:0.4s; font-weight:400}
#cont_visual .smr > li + li {margin-left:20px;}
#cont_visual .smr i.go_kspdia { background:rgba(255,255,255,0.55); }
#cont_visual .smr i.go_kspdia img { width:50px; height:50px; margin:-25px 0 0 -25px; }
#cont_visual .smr i {display:block; position:relative; width:90px; height:90px; margin:0 auto 12px; background:rgba(0,0,0,0.55); border-radius:100%; content:''; transition:0.3s}
#cont_visual .smr i img {position:absolute; top:50%; left:50%; width:40px; height:40px; margin:-20px 0 0 -20px; transition:0.3s}
#cont_visual .smr em {display:block;}
#cont_visual .smr strong {display:block; position:relative; line-height:1.2; transition:0.4s;}
#cont_visual .smr > li:first-child strong::after {width:42px; margin-left:-21px; background-position:-240px -260px;}
#cont_visual .smr > li:nth-child(2) strong::after {width:44px; margin-left:-22px; background-position:-290px -260px;}
#cont_visual .smr > li:nth-child(3) strong::after {width:36px; margin-left:-18px; background-position:-340px -260px;}
#cont_visual .smr > li.out {opacity:0.5}
#cont_visual .smr .desc {opacity:0; height:0; overflow:hidden; font-size:14px; margin-top:12px; transition:0.4s}
#cont_visual .smr .desc::before {display:block; width:14px; height:1px; margin:0 auto 12px; background:#fff; content:'';}
#cont_visual .smr .desc li {font-size:15px}
#cont_visual .smr .desc li ul li {font-weight:300; font-size:13px; line-height:1.3}
#cont_visual .smr .desc > li + li {margin-top:4px;}

#cont_visual .wheel {position:absolute; width:22px; height:52px; left:50%; margin-left:-11px; bottom:10px; -webkit-transition:all 1s, -webkit-transform 1s; transition:all 1s, transform 1s; z-index:1}
#cont_visual .wheel iframe {width:22px; height:52px; position:absolute; left:0; top:0; border:0}

#cont_visual .go_kspdi{ display:block; width:120px; padding:1px 0; background:rgba(40,56,145,.7); margin:2px auto 0; font-size:13px; }
@media (min-width:800px){
  #cont_visual .smr > li:hover strong {font-size:18px;}
  #cont_visual .smr > li:hover i {width:120px; height:120px; margin-top:-25px;}
  #cont_visual .smr > li:hover i img {width:60px; height:60px; margin:-30px 0 0 -30px;}
  #cont_visual .smr > li:hover strong::after {-webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); -webkit-transition:.4s; -moz-transition:.4s; -ms-transition:.4s; -o-transition:.4s; transition:.4s;}
  body.dimm_body:before {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); content:''; z-index:999}
  #cont_visual .smr > li:hover .desc {opacity:1; height:auto;}
}
@media (max-width:1400px){
  #cont_visual .wrapper {margin:-230px auto 0}
}
@media (max-width:800px){
  #visual .fadeImgs .item {background-attachment:inherit;}
  #visual .fadeImgs .bg3 {background-position:90% 50%}
  #cont_visual .inner {padding:0 14px; margin-top:-179px; box-sizing:border-box;}
  #cont_visual .cmt > span {font-size:16px;}
  #cont_visual .cmt strong::after {margin:12px auto 15px}
  #cont_visual .cmt .desc {font-size:16px; word-break:keep-all;}
  #cont_visual .smr {margin:30px 0 0; padding:0 20px; box-sizing:border-box;}
  #cont_visual .smr > li {height:auto;}
  #cont_visual .smr i {width:60px; height:60px;}
  #cont_visual .smr i img {width:30px; height:30px; margin:-15px 0 0 -15px;}
  #cont_visual .smr strong {font-size:18px;}
  #cont_visual .smr strong em {display:inline-block;}
  #cont_visual .smr .desc {opacity:1; height:auto; font-size:14px;}
  #cont_visual .smr .desc em {display:inline; word-break:keep-all;}
  #cont_visual .smr .desc::before {display:none;}
  #cont_visual .wheel {display:none}
}

.section.dimm .wrapper {background:url(../img/dimm.png) 0 0 repeat rgba(0,0,0,0.35);}

#cont1 .tit .nnbr::after,
#cont2 .tit .nnbr::after {display:block; width:50px; height:1px; margin:24px auto 0; background:#fff; content:''}
#cont1 .tit strong,
#cont2 .tit strong {display:block; margin-top:24px; font-size:40px; line-height:1.2}
#cont1 .tit strong span,
#cont2 .tit strong span {font-size:30px;}
#cont1 .slick-dots,
#cont2 .tab {margin:60px 0 30px; overflow:hidden; text-align:center}
#cont1 .slick-dots li,
#cont2 .tab li {float:left; width:50%; line-height:50px; font-size:20px; background:#fff; opacity:0.7; background:rgba(255,255,255,0.2); color:#fff; font-weight:400; cursor:pointer}
#cont1 .slick-dots li.slick-active,
#cont2 .tab li.on {background:#17469e; opacity:1}

@media (max-width:800px){
  .tit h3 {font-size:24px;}
}


.nojs #cont1 .wrapper {margin-top:-266px;}
.nojs #cont1 .item2 {display:none}
.nojs #cont1 .slider {margin-top:30px;}
#cont1 {background:url(../img/company_intro_bg.jpg) 10% 100% no-repeat fixed; background-size:cover; color:#fff; text-align:center}
#cont1 .item > ul {overflow:hidden;border:1px solid rgba(255,255,255,0.4);}
#cont1 .item > ul > li {float:left; position:relative; transition:0.4s; }
#cont1 .item > ul > li +li::after {position:absolute; top:0; left:0; bottom:0; width:1px; background:#fff; opacity:0.4; content:'';}
#cont1 .list_field {height:300px;}
#cont1 .list_field li {width:20%; height:300px;}
#cont1 .list_field .bfr_company::before {display:block; width:82px; height:82px; margin:34px auto 0; }
#cont1 .list_field .field1::before {background-position:0px 0px;}
#cont1 .list_field .field2::before {background-position:-90px 0px;}
#cont1 .list_field .field3::before {background-position:-260px -180px;}
#cont1 .list_field .field4::before {background-position:-180px 0px;}
#cont1 .list_field .field5::before {background-position:-270px 0px;}
#cont1 .list_field strong {display:block; margin:16px 0 0; font-size:20px; font-weight:400}
#cont1 .list_field strong::after {display:block; width:24px; height:2px; background:#fff; margin:15px auto; content:''}
#cont1 .list_field .desc {line-height:1.2; padding:0 12px}
#cont1 .list_field .desc span {display:inline-block;}
#cont1 .item2 {height:301px; overflow:hidden}
#cont1 .list_profile > li {width:33.333%; height:149px}
#cont1 .list_profile strong.bfr_company {display:block; margin:38px auto 12px; line-height:36px; font-size:18px; transition:0.4s}
#cont1 .list_profile strong.bfr_company::before {display:inline-block; height:36px; vertical-align:top; margin-right:8px; content:''}
#cont1 .list_profile .profile1 strong.bfr_company::before {width:40px; background-position:0px -180px}
#cont1 .list_profile .profile2 strong.bfr_company::before {width:33px; background-position:-50px -180px}
#cont1 .list_profile .profile3 strong.bfr_company::before {width:48px; background-position:-90px -180px}
#cont1 .list_profile .profile4 strong.bfr_company::before {width:36px; background-position:-140px -180px}
#cont1 .list_profile .profile5 strong.bfr_company::before {width:26px; background-position:-180px -180px}
#cont1 .list_profile .profile6 strong.bfr_company::before {width:34px; background-position:-210px -180px}
#cont1 .list_profile .desc {font-size:20px;}
#cont1 .list_profile + .list_profile {border-top:none}
#cont1 .list_profile + .list_profile strong.bfr_company {margin-top:28px;}
#cont1 .list_profile + .list_profile .desc {font-size:16px;}

@media (min-width:800px){
  #cont1 .list_field:hover li {width:134px; font-size:14px; opacity:0.6}
  #cont1 .list_field li:hover {width:260px; font-size:18px; background:rgba(255,255,255,0.9); opacity:1; color:#000;}
  #cont1 .list_field li:hover strong {color:#17469e; font-size:24px; font-weight:bold;}
  #cont1 .list_field li:hover strong::after {background:#17469e}
  #cont1 .list_field li:hover .desc {padding:0 20px}
  #cont1 .list_field .field1:hover::before {background-position:0px -90px;}
  #cont1 .list_field .field2:hover::before {background-position:-90px -90px;}
  #cont1 .list_field .field3:hover::before {background-position:-350px -180px;}
  #cont1 .list_field .field4:hover::before {background-position:-180px -90px;}
  #cont1 .list_field .field5:hover::before {background-position:-270px -90px;}
  #cont1 .list_profile .cont_hover {display:none;}
  #cont1 .item2:hover .list_profile > li {height:126px; opacity:0.6}
  #cont1 .item2 .list_profile:hover > li {width:200px; height:172px;}
  #cont1 .item2 .list_profile > li:hover {width:398px; background:rgba(255,255,255,0.9); opacity:1}
  #cont1 .item2:hover strong.bfr_company {margin-top:25px;}
  #cont1 .list_profile:hover strong.bfr_company {margin-top:50px;}
  #cont1 .list_profile:hover + .list_profile strong.bfr_company {margin-top:18px;}
  #cont1 .list_profile + .list_profile:hover strong.bfr_company {margin-top:38px;}
  #cont1 .list_profile + .list_profile:hover .desc {font-size:14px;}
  #cont1 .list_profile + .list_profile > li:hover .desc {font-size:16px;}
  #cont1 .list_profile > li:hover strong.bfr_company {color:#17469e; font-weight:bold}
  #cont1 .list_profile > li:hover .desc {color:#000; font-weight:bold}
  #cont1 .list_profile .profile1:hover strong.bfr_company::before {width:40px; background-position:0px -220px}
  #cont1 .list_profile .profile2:hover strong.bfr_company::before {width:33px; background-position:-50px -220px}
  #cont1 .list_profile .profile3:hover strong.bfr_company::before {width:48px; background-position:-90px -220px}
  #cont1 .list_profile .profile4:hover strong.bfr_company::before {width:36px; background-position:-140px -220px}
  #cont1 .list_profile .profile5:hover strong.bfr_company::before {width:26px; background-position:-180px -220px}
  #cont1 .list_profile .profile6:hover strong.bfr_company::before {width:34px; background-position:-210px -220px}
  #cont1 .list_profile .profile4:hover strong {float:left; margin:52px 34px 0 !important}
  #cont1 .list_profile .profile4:hover strong.bfr_company::before {display:block; margin:0 auto; }
  #cont1 .list_profile .profile4:hover .desc {display:none;}
  #cont1 .list_profile .profile4:hover .cont_hover {display:block; overflow:hidden; color:#000; text-align:left; font-weight:bold; margin:15px 30px 0 0; line-height:1.2;}
  #cont1 .list_profile .profile4:hover .cont_hover li::before {display:inline-block; width:3px; height:3px; border-radius:100%; background:#000; vertical-align:top; margin:10px 3px 0 0; content:'';}
  #cont1 .list_profile .profile4:hover .cont_hover li + li {margin-top:8px;}
  #cont1 .list_profile .profile4:hover .cont_hover span {display:inline-block; font-size:13px; font-weight:400}
}

@media (max-width:1400px){
 #cont1 .wrapper,
 #cont2 .wrapper {margin:0 20px;}
}
@media (max-width:800px){
 #cont1 {background-attachment:inherit;}
 #cont1 .wrapper,
 #cont2 .wrapper,
 #cont1 .w800,
 #cont2 .w800 {margin:0;}
 #cont1 .tit {margin:0 20px;}
 #cont1 .list_field,
 #cont1 .item2 {height:auto;}
 #cont1 .item > ul {border:none;}
 #cont1 .item > ul > li {float:none; position:relative; width:auto; padding:10px 0 10px 52px; height:auto; text-align:left; clear:both}
 #cont1 .item > ul > li + li {border-top:1px solid rgba(255,255,255,0.3)}
 #cont1 .item > ul > li +li::after {display:none}
 #cont1 .list_field .bfr_company::before {position:absolute; top:50%; left:0; background-size:210px 190px; width:41px; height:41px; margin:-20px 0 0 0}
 #cont1 .list_field strong {overflow:hidden; margin:0; font-size:16px;}
 #cont1 .list_field .desc {overflow:hidden; font-size:13px; padding:0}
 #cont1 .list_field strong::after {display:none}
 #cont1 .list_field .field1::before {background-position:0px 0px;}
 #cont1 .list_field .field2::before {background-position:-45px 0px;}
 #cont1 .list_field .field3::before {background-position:-125px -90px;}
 #cont1 .list_field .field4::before {background-position:-90px 0px;}
 #cont1 .list_field .field5::before {background-position:-135px 0px;}
 #cont1 .list_profile strong.bfr_company {float:left; width:72px; margin:0 10px 0 0; line-height:22px; font-size:14px; text-align:center; border-radius:22px; border:1px solid rgba(255,255,255,0.5)}
 #cont1 .item > ul.list_profile > li {padding:6px 0}
 #cont1 .list_profile strong.bfr_company::before {display:none;}
 #cont1 .list_profile .desc {overflow:hidden; font-size:15px; line-height:26px;}
 #cont1 .list_profile + .list_profile {border-top:1px solid rgba(255,255,255,0.3)}
 #cont1 .list_profile + .list_profile strong.bfr_company {margin:0 10px 0 0}
 #cont1 .list_profile + .list_profile .desc {font-size:13px;}
 #cont1 .list_profile .cont_hover {display:none;}
 #cont1 .item > ul.list_profile + .list_profile > li .desc {line-height:1.4}
}
.nojs #cont2 .wrapper {margin-top:-323px;}
.nojs #cont2 .item2 {display:none}
#cont2 {background:url(../img/company_vision.jpg) 50% 100% no-repeat fixed; color:#fff; background-size:cover; text-align:center}
#cont2 .fp-tableCell {background-color:rgba(0,0,0,0.3)}
#cont2 .tit strong {font-size:35px;}
#cont2 .slick-dots {margin-top:60px;}
#cont2 .item1 {padding-top:60px;}
#cont2 .list_vision {height:220px; margin-top:100px; overflow:hidden;}
#cont2 .list_vision li {position:relative; float:left; width:20%; height:220px; }
#cont2 .list_vision li + li::after {position:absolute; top:0; left:0; bottom:0; width:1px; background:#fff; opacity:0.2; content:'';}
#cont2 .list_vision strong {display:block; margin-bottom:26px; font-size:20px; font-weight:bold;}
#cont2 .list_vision strong::before {display:block; height:75px; margin:10px auto 22px;}
#cont2 .list_vision .vision1 strong::before {width:85px; background-position:0px -260px;}
#cont2 .list_vision .vision2 strong::before {width:66px; background-position:-90px -260px;}
#cont2 .list_vision .vision3 strong::before {width:72px; background-position:-160px -260px;}
#cont2 .list_vision .vision4 strong::before {width:88px; background-position:-240px -260px;}
#cont2 .list_vision .vision5 strong::before {width:68px; background-position:-330px -260px;}
#cont2 .list_vision span {display:block; font-size:15px; line-height:1.2}
#cont2 .list_vision span em {display:block;}
#cont2 .orgaization {margin-top:34px; font-size:14px;}
#cont2 .orgaization .inner {border:1px solid rgba(255,255,255,0.5); border-radius:6px;}
#cont2 .orgaization strong {display:block;}
#cont2 .orgaization strong::before {display:inline-block; vertical-align:top; margin-right:8px; }
#cont2 .orgaization .ceo .inner {width:154px; height:54px; border-width:3px; margin:0 auto;}
#cont2 .orgaization .ceo strong {line-height:54px; font-size:18px;}
#cont2 .orgaization .ceo strong::before {display:inline-block; width:30px; height:32px; margin-top:11px; background-position:0 -340px;}
#cont2 .orgaization .advisory {margin-left:50%; padding:40px 0; border-left:2px dashed rgba(255,255,255,0.4)}
#cont2 .orgaization .advisory .inner {position:relative; border:none}
#cont2 .orgaization .advisory .inner::after {position:absolute; top:50%; left:0; width:124px; margin-top:-1px; border-top:2px dashed rgba(255,255,255,0.5); content:'';}
#cont2 .orgaization .advisory strong {display:inline-block; width:116px; padding:11px 16px 10px;border:1px solid rgba(255,255,255,0.5); border-radius:6px; line-height:34px; font-size:15px;}
#cont2 .orgaization .advisory strong::before {width:24px; height:34px; background-position:-40px -340px}
#cont2 .orgaization .advisory strong span {display:inline-block; vertical-align:top; line-height:16px;}
#cont2 .orgaization .director {position:relative; width:160px; margin:0 auto; padding-bottom:28px;}
#cont2 .orgaization .director::after {position:absolute; bottom:0; left:50%; width:2px; height:28px; margin-left:-1px; border-left:2px dashed #fff; opacity:0.4; content:'';}
#cont2 .orgaization .director strong {line-height:33px; margin:13px 0 14px;}
#cont2 .orgaization .director strong::before {width:33px; height:33px; background-position:-70px -340px}
#cont2 .orgaization .department > ul {margin-left:-12px; overflow:hidden; position:relative; }
#cont2 .orgaization .department > ul::after {position:absolute; top:0; left:50%; width:640px; margin-left:-312px; border-top:2px dashed #fff; opacity:0.4; content:'';}
#cont2 .orgaization .department > ul > li {float:left; position:relative; width:160px; padding-top:40px;}
#cont2 .orgaization .department > ul > li::after {position:absolute; top:0; left:50%; height:40px; margin-left:12px; border-left:2px dashed rgba(255,255,255,0.4); content:'';}
#cont2 .orgaization .department .inner {border:1px solid rgba(255,255,255,0.4); border-radius:6px;  margin-left:12px;}
#cont2 .orgaization .department strong {padding:20px 0;}
#cont2 .orgaization .department li li {line-height:30px; border-bottom:1px solid rgba(255,255,255,0.4)}
#cont2 .orgaization .department strong::before {display:block; margin:0 auto 12px;}
#cont2 .orgaization .d1::before {width:32px; height:38px; background-position:-110px -340px;}
#cont2 .orgaization .d2::before {width:34px; height:38px; background-position:-390px -340px}
#cont2 .orgaization .d3::before {width:38px; height:38px; background-position:-270px -340px}
#cont2 .orgaization .d4::before {width:34px; height:38px; background-position:-310px -340px}
#cont2 .orgaization .d5::before {width:34px; height:38px; background-position:-350px -340px}


@media (max-width:800px){
  #company2,
  #cont3,
  #cont4 {display:table; width:100%;}
  #cont1 .wrapper,
  #cont2 .wrapper,
  #cont4 .wrapper {display:table-cell;padding:50px 0; vertical-align:middle;}
  #cont1 .tit .nnbr::after,
  #cont2 .tit .nnbr::after {margin-top:18px}
  #cont1 .tit strong,
  #cont2 .tit strong {margin-top:18px; font-size:18px;}
  #cont1 .tit strong span,
  #cont2 .tit strong span {font-size:15px;}
  #cont1 .slick-dots,
  #cont2 .tab {margin:30px 14px 14px}
  #cont2 .tab {margin:30px 0 14px;}
  #cont1 .slick-list,
  #cont2 .slick-list {margin:0 14px;}
  #cont1 .slick-dots li,
  #cont2 .tab li {line-height:36px; font-size:15px;}
  #cont2 {background-attachment:inherit;}
  #cont2 .tit strong {font-size:18px; letter-spacing:0}
  #cont2 .tab {margin-top:}
  #cont2 .item1 {padding:0}
  #cont2 .list_vision {height:auto; margin:0}
  #cont2 .list_vision li {position:relative; float:none; width:auto; height:auto; padding:8px 0; text-align:left; padding-left:58px;}
  #cont2 .list_vision li + li {border-top:1px solid rgba(255,255,255,0.3)}
  #cont2 .list_vision li + li::after {display:none;}
  #cont2 .list_vision strong {margin:0; font-size:18px;}
  #cont2 .list_vision strong::before {position:absolute; top:50%; height:37px; background-size:210px 190px; margin:-17px 0 0}
  #cont2 .list_vision .vision1 strong::before {width:42px; left:4px; background-position:0px -130px}
  #cont2 .list_vision .vision2 strong::before {width:33px; left:8px; background-position:-45px -130px}
  #cont2 .list_vision .vision3 strong::before {width:36px; left:7px; background-position:-80px -130px}
  #cont2 .list_vision .vision4 strong::before {width:44px; left:3px; background-position:-120px -130px}
  #cont2 .list_vision .vision5 strong::before {width:34px; left:8px; background-position:-165px -130px}
  #cont2 .list_vision span em {display:inline; word-break:keep-all;}
  #cont2 .orgaization {font-size:12px; line-height:1.2}
  #cont2 .orgaization strong {word-break:break-all; word-break:keep-all}
  #cont2 .orgaization strong::before {display:none;}
  #cont2 .orgaization .ceo .inner {width:100px; height:auto;;}
  #cont2 .orgaization .ceo strong {font-size:14px; line-height:36px;}
  #cont2 .orgaization .ceo strong::before {display:inline-block; background-size:210px 190px; width:15px; height:16px; background-position:0px -170px;}
  #cont2 .orgaization .advisory  {padding:24px 0}
  #cont2 .orgaization .advisory .inner {padding-left:40px; text-align:left;}
  #cont2 .orgaization .advisory strong {width:auto; padding:2px 12px;}
  #cont2 .orgaization .advisory .inner::after {width:40px;}
  #cont2 .orgaization .director {width:100px; padding-bottom:20px;}
  #cont2 .orgaization .director strong {line-height:20px; margin:0; padding:6px 10px;}
  #cont2 .orgaization .director::after {height:20px;}
  #cont2 .orgaization .department > ul {margin-left:0;}
  #cont2 .orgaization .department > ul::after {width:80%; margin-left:-40%;}
  #cont2 .orgaization .department > ul > li {width:20%; padding-top:20px;}
  #cont2 .orgaization .department > ul > li::after {height:20px; margin:0}
  #cont2 .orgaization .department > ul > li + li {margin:0}
  #cont2 .orgaization .department > ul > li .inner {border:none; margin:0 2px;}
  #cont2 .orgaization .department li li {font-size:13px; line-height:24px; letter-spacing:-0.1em}
  #cont2 .slick-arrow {width:1px; height:1px; overflow:hidden; opacity:0.01}
}

@media (max-width:330px){
  #cont2 .orgaization .department li li {font-size:11px;}
}


#cont3,
#cont4 {background:url(../img/bg1.png) 100% 320px no-repeat fixed; background-size:cover}
#cont3 .tit,
#cont4 .tit {color:#17469e; font-weight:400; }
#cont3 .tit p,
#cont4 .tit p {color:#000;}

#cont3 .wrapper {padding:110px 20px;}
#cont3 .greeting {margin-top:90px; overflow:hidden}
#cont3 .greeting .txts {float:left; width:65%; margin-right:30px; font-size:16px;}
#cont3 .greeting .txts p + p {margin-top:20px}
#cont3 .greeting .txts em {display:block;}
#cont3 .greeting .txts .foot_greeting {margin-top:50px;}
#cont3 .greeting .txts .foot_greeting span {font-size:16px; opacity:0.7}
#cont3 .greeting .txts .foot_greeting .sign {width:280px; height:80px; border-bottom:1px solid rgba(0,0,0,0.5)}
#cont3 .greeting .pictures {overflow:hidden; padding-left:40px; border-left:1px solid rgba(0,0,0,0.1)}
#cont3 .greeting .pictures li + li {margin-top:10px;}

.nojs #cont3 .wrapper {padding:0; margin-top:-332px;}
.nojs #cont3 .greeting {width:1320px; margin:50px auto 0;}
.nojs #cont4 {height:auto; padding-bottom:100px;}
.nojs #cont4 .wrapper {position:relative;}
#cont4 .clients {margin-top:50px; /* padding-bottom:79px; background:url(../img/shadow1.png) 50% bottom no-repeat*/}
#cont4 .clients > .inner {padding:0 50px; margin-top:26px; font-size:0}
#cont4 .list_clients li {display:inline-block; vertical-align:top; position:relative; width:20%; height:80px; text-align:center; border-bottom:1px solid rgba(0,0,0,0.07)}
#cont4 .list_clients li::after {position:absolute; top:0; right:0; bottom:0; width:1px; background:rgba(0,0,0,0.07); content:'';}
#cont4 .list_clients li:nth-child(5n)::after {display:none}
#cont4 .list_clients li:nth-child(n+26) {border-bottom:none;}
#cont4 .list_clients li .inner {display:inline-block; height:50px; max-width:200px; padding:15px 0;}
#cont4 .list_clients li.blank::after {display:none;}


@media (max-width:800px){
  #cont3,
  #cont4 {background-position:50% 50%}
  #cont3 .wrapper {padding:50px 14px}
  #cont3 .tit p {font-size:16px; word-break:keep-all;}
  #cont3 .greeting {margin-top:30px;}
  #cont3 .greeting .txts {float:none; width:auto; font-size:14px; margin:0}
  #cont3 .greeting .txts p + p {margin-top:5px;}
  #cont3 .greeting .txts em {display:inline; word-break:keep-all;}
  #cont3 .greeting .pictures {display:none;}
  #cont4 .wrapper {padding-top:30px}
  #cont4 .clients {margin-top:30px;}
  #cont4 .clients .inner {padding:0 14px;}
  #cont4 .slider {padding:0 12px;}
  #cont4 .list_clients li {width:33.333%; height:auto; box-sizing:border-box;}
  #cont4 .list_clients li .inner {width:auto; height:auto; padding:5px 0}
  #cont4 .list_clients li:nth-child(5n)::after {display:block;}
  #cont4 .list_clients li:nth-child(3n)::after {display:none;}
  #cont4 .list_clients li:nth-child(n+26) {border-bottom:1px solid rgba(0,0,0,0.07)}
  #cont4 .list_clients li:nth-child(n+28) {border-bottom:none;}

}


.nojs #cont5 {height:auto;}
.nojs #cont5 .wrapper {position:relative;}
#header.hd_history {background:rgba(108,125,137,0.9)}
#cont5 {background:url(../img/company_history.jpg) 50% bottom no-repeat #788b99 fixed; background-size:cover; color:#fff}
#cont5 .fp-tableCell {background-color:rgba(0,0,0,0.3)}

#cont5 .wrapper {padding:120px 0 200px;}
#cont5 .tit {color:#17469e}
#cont5 .tit p {color:#fff}
#cont5 .history {position:relative; margin-top:64px; padding:40px 0; text-align:left;}
#cont5 .history::after {position:absolute; top:0; left:50%; width:12px; height:40px; margin-left:-6px; background:#002569; border-radius:14px 14px 0 0; content:''; z-index:1; opacity:0.8}
#cont5 .history::before {position:absolute; bottom:0; left:50%; width:12px; height:40px; margin-left:-6px; background:#002569; border-radius:0 0 14px 14px; content:''; z-index:1; opacity:0.8}
#cont5 .history strong {display:inline-block; width:240px; margin-bottom:15px; padding-left:20px; line-height:42px; background:rgba(0,37,105,0.8); font-size:22px; color:#fff; font-weight:bold;}
#cont5 .history .odd {margin-left:50%;}
#cont5 .history .even {margin-right:50%; text-align:right}
#cont5 .history .odd .inner {margin-left:-6px; border-left:12px solid rgba(0,37,105,0.8); }
#cont5 .history .even .inner {margin-right:-6px; border-right:12px solid rgba(0,37,105,0.8);}
#cont5 .history .odd strong {border-radius:0 50px 50px 0}
#cont5 .history .even strong {border-radius:50px 0 0 50px; text-align:left}
#cont5 .history > ul > li:first-child strong {width:290px;}
#cont5 .history > ul > li:nth-child(2) strong {width:220px;}
#cont5 .history > ul > li:nth-child(3) strong {width:200px;}
#cont5 .history > ul > li:nth-child(4) strong {width:290px;}
#cont5 .history > ul > li:nth-child(5) strong {width:265px;}
#cont5 .history > ul > li:nth-child(6) strong {width:227px;}
#cont5 .history > ul > li:nth-child(7) strong {width:217px;}
#cont5 .history > ul > li:nth-child(8) strong {width:307px;}
#cont5 .history ul ul {line-height:24px;}
#cont5 .history li li {position:relative; padding-bottom:12px;}
#cont5 .history li li::before {position:absolute; top:10px; width:4px; height:4px; border-radius:100%; background:#fff; vertical-align:top; content:'';}
#cont5 .history li li::after {position:absolute; top:12px; width:42px; height:1px; background:#fff; content:'';}
#cont5 .history li .month {width:24px; border-radius:100%; background:#fff; color:#17469e; font-size:14px; text-align:center; font-weight:400}
#cont5 .history li .cont {display:block; overflow:hidden;}
#cont5 .history li .cont em {display:block; font-size:14px; line-height:1.2; }
#cont5 .history .odd li {padding-left:32px;}
#cont5 .history .even li {padding-right:32px;}
#cont5 .history .odd li::before,
#cont5 .history .odd li::after {left:-8px;}
#cont5 .history .even li::before,
#cont5 .history .even li::after {right:-8px;}
#cont5 .history .odd .month {float:left; margin-right:10px;}
#cont5 .history .even .month {float:right; margin-left:10px;}
@media (max-width:800px){
  #header.hd_history {background:rgba(215,238,254,0.7); border-color:rgba(255,255,255,0.5)}
  #header.hd_history span {background:#333;}
  #cont5 {display:table; width:100%; background-attachment:scroll; background-size:auto 100%}
  #cont5 .wrapper {display:table-cell; padding:0; vertical-align:middle; background-color:transparent}
  #cont5 .tit {margin:0 14px;}
  #cont5 .tit p {font-size:16px; word-break:keep-all; color:#000}
  #cont5 .history {margin-top:30px; padding:0; white-space:nowrap; overflow:auto; transition-property:-webkit-transform; -webkit-transform:translate3d(0,0,0); pointer-events:auto; -webkit-overflow-scrolling:touch; text-align:center; background:rgba(255,255,255,0.5); color:#000}
  #cont5 .history > ul {padding:20px; font-size:0; line-height:0; display:table; width:100%; text-align:center;}
  #cont5 .history::before,
  #cont5 .history::after {display:none;}
  #cont5 .history .odd,
  #cont5 .history .even {display:table-cell; margin:0; text-align:left;}
  #cont5 .history .odd .inner,
  #cont5 .history .even .inner {border:none; margin:0;}
  #cont5 .history .odd strong,
  #cont5 .history .even strong {display:inline-block; width:auto !important; font-size:16px; background:none; border-radius:0; padding:0; line-height:22px; letter-spacing:0;  color:#17469e}
  #cont5 .history strong::after {content:'년'}
  #cont5 .history .odd li,
  #cont5 .history .even li{display:inline-block; width:140px; padding:0 14px 0 0; vertical-align:top; white-space:normal;}
  #cont5 .history li li {position:relative;}
  #cont5 .history li li::after {display:none;}
  #cont5 .history li li::before {position:absolute; top:12px; left:24px !important; width:130px; height:1px; background:rgba(255,255,255,0.5); content:'';}
  #cont5 .history li:last-child li::before {display:none}
  #cont5 .history .odd .month,
  #cont5 .history .even .month {display:block; float:none; margin:0 0 5px 0; letter-spacing:0;}
  #cont5 .history li .cont {font-size:14px; line-height:1.4; word-break:keep-all;}

}

.nojs #cont6 .wrapper {margin-top:-290px;}
.nojs #cont6 .certification {width:1320px; margin:50px auto 0; height:406px}
.nojs #cont6 .certification .item {width:20%;}
#header.hd_certification {background:rgba(255,255,255,0.6); border-bottom:1px solid rgba(0,0,0,0.1)}
#header.hd_certification .wfix {color:#444}
#header.hd_certification span {background:#333}
#cont6 {position:relative; background:url(../img/bg1.png) 50% 50% no-repeat fixed; background-size:cover;}
#cont6 .wfix {position:relative;}
#cont6 .tit {color:#17469e}
#cont6 .slider {margin:0 60px;}
#cont6 .certification {margin-top:80px; font-size:0; max-height:434px; overflow:hidden;}
#cont6 .certification .item {display:inline-block; width:25%}
#cont6 .certification .inner {display:block; margin:0 10px;}
#cont6 .certification .thumb {padding:20px; background:#fff; box-shadow:10px 10px 15px rgba(0,0,0,0.1); transition:0.2s}
#cont6 .certification .thumb::after {border:1px solid rgba(0,0,0,0.05)}
#cont6 .certification .cont {padding:16px 18px;}
#cont6 .certification strong {display:block; position:relative; padding-left:25px; margin-bottom:4px; line-height:20px; font-size:15px;}
#cont6 .certification strong::before {position:absolute; top:9px; left:0; width:18px; height:2px; background:#17469e; vertical-align:top; content:'';}
#cont6 .certification .num {font-size:13px; letter-spacing:0}
#cont6 .slick-prev {left:}

@media (min-width:800px){
  #cont6 .certification .inner:hover {background:#17469e; color:#fff;}
  #cont6 .certification .inner:hover .thumb {border:5px solid #17469e}
  #cont6 .certification .inner:hover strong {font-weight:400}
  #cont6 .certification .inner:hover strong::before {background:#fff}
}

@media (max-width:1400px){
  #cont6 .wrapper {margin:0 40px}
  #cont6 .slick-list {}
}
@media (max-width:800px){
  #cont6 {background-attachment:inherit;}
  #cont6 {display:table; width:100%; background-size:auto 100%}
  #cont6 .wfix {margin:0 14px;}
  #cont6 .wrapper {display:table-cell; padding:0; vertical-align:middle; margin:0}
  #cont6 .certification {max-height:none; max-width:320px; padding:0 20px; margin:30px auto 0;}
  #cont6 .certification .slick-list { text-align:center;}
  #cont6 .certification .thumb {box-shadow:none}
  #cont6 .certification .thumb::after {display:none;}
  #cont6 .certification .cont {padding:15px 0; text-align:left}
  #cont6 .slick-prev {left:}

}

.nojs #cont7 {height:auto;}
.nojs #cont7 .wrapper {position:relative;}
#header.hd_contact {background:#f5f5f5; border-bottom:1px solid rgba(0,0,0,0.1)}
#header.hd_contact .wfix {color:#444}
#header.hd_contact span {background:#333}
#cont7 {background:#f5f5f5; }
#cont7 .wrapper {padding:100px 0 150px;}
#cont7 .tit {color:#17469e; margin-bottom:100px;}
#cont7 .tit p {color:#444}
#cont7 .contact {position:relative; margin:0 50px;}
#cont7 .area_map {position:absolute; top:0; left:0; width:50%;}
#cont7 .area_map .map {box-shadow:10px 10px 15px rgba(0,0,0,0.15) }
#cont7 .area_map .map .root_daum_roughmap {width:100%;}
#cont7 .area_map .map .root_daum_roughmap .wrap_map {height:474px}
#cont7 .area_map .map .map_border {display:none}
#cont7 .area_map .map .wrap_controllers  {display:none;}
#cont7 .area_form .inner {margin-left:50%; padding-left:70px;}
#cont7 .area_form dl {overflow:hidden;}
#cont7 .area_form dl + dl {margin-top:5px;}
#cont7 .area_form dt {float:left; min-width:45px; padding-right:24px; line-height:46px;}
#cont7 .area_form dd {overflow:hidden;}
#cont7 .area_form .inp {display:block; background:#fff; width:100%; box-sizing:border-box; padding:8px; border:1px solid #aaa; border-radius:0; box-shadow:none#cont2 .orgaization}
#cont7 .area_form input.inp {height:46px;}
#cont7 .area_form textarea.inp {height:160px; resize:none;}
#cont7 .area_form .security {margin:12px 0 18px;}
#cont7 .area_form .security .captcha {float:left; position:relative; width:135px; height:50px; padding-right:25px; margin-right:10px; border:1px solid #aaa;}
#cont7 .area_form .security .captcha img {width:100%; max-height:100%;}
#cont7 .area_form .security .captcha .btns {position:absolute; top:0; right:0; height:52px; border-left:1px solid #aaa;}
#cont7 .area_form .security .captcha .btns button {display:block; width:24px; height:25px;}
#cont7 .area_form .security .captcha .btns button + button {border-top:1px solid #aaa; text-align:center;}
#cont7 .area_form .security .captcha .btns button img {width:auto; height:16px; margin-top:2px}
#cont7 .area_form .security .captcha .btns .btn_sound img {margin-top:4px;}
#cont7 .area_form .security .captcha .btns .btn_refresh img {margin-top:4px;}
#cont7 .area_form .security .inp {height:52px;}
#cont7 .area_form input[type=checkbox] {display:inline-block; width:20px; height:20px; border:1px solid #aaa; margin-right:2px; background:#fff; vertical-align:top; box-sizing:border-box;}
#cont7 .area_form input[type=checkbox] + label {display:inline-block; line-height:20px; vertical-align:top;}
#cont7 .area_form input[type=checkbox]:checked {border:2px solid #17469e; background:url(../img/ico_chk.png) 50% 50% no-repeat; background-size:12px 10px;}
#cont7 .area_form .send {display:block; width:100%; line-height:50px; margin-top:28px; background:#17469e; font-size:18px; font-weight:bold; text-align:center; color:#fff;}
#cont7 .area_form + .wfix {margin-top:20px;}
#cont7 .info_location {width:50%; font-size:0; text-align:right;}
#cont7 .info_location dl {display:inline-block; font-size:0;}
#cont7 .info_location dt {display:inline-block; margin-right:12px; letter-spacing:0; color:#17469e; font-size:16px; font-weight:400}
#cont7 .info_location dd {display:inline-block; margin-top:2px; font-size:14px}
#cont7 .info_location .info_address {display:block; margin-bottom:6px;}
#cont7 .info_location .info_tel {margin-right:30px;}
#cont7 .area_btn {width:50%; text-align:right;}
#cont7 .btn_download {display:inline-block; margin-top:30px; line-height:50px; padding:0 20px; background:#333; color:#fff;}
#cont7 .btn_download::before {display:inline-block; width:13px; height:14px; margin:18px 8px 0 0; vertical-align:top; background:url(../img/ico_download.png) 50% 50% no-repeat; background-size:100%; content:'';}

@media (max-width:800px){
  #cont7 .wrapper {padding:70px 0 50px}
  #cont7 .tit {margin-bottom:40px;}
  #cont7 .contact {margin:0}
  #cont7 .area_map {position:relative; width:auto;}
  #cont7 .area_map .map {box-shadow:none}
  #cont7 .area_map .map .root_daum_roughmap .wrap_map {height:280px;}
  #cont7 .area_form .inner {margin:0; padding:30px 15px}
  #cont7 .area_form + .wfix {margin:20px}
  #cont7 .area_btn,
  #cont7 .info_location {width:auto; margin:0 15px; text-align:left}
  #cont7 .area_form dt {float:none; line-height:1.8; font-size:12px;}
  #cont7 .area_form .security .captcha {float:none; margin-bottom:4px;}


}