/* 
 2021 플래시 중단에 따라 기존 플래시 영역을 html로 작업하면서 만든 css 파일입니다. 
 해당 design2021 폴더는 21.01.29 이후 제작한 
 css 및 js, 기존 플래시를 html로 변경한 파일이 들어가 있습니다.
*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

a:hover {text-decoration:none !important}

.font2021 {font-family: 'Noto Sans KR', sans-serif;font-size:12px;line-height:16px;font-weight:500;letter-spacing:-0.05px}
.inner {width:1000px;margin:0 auto;position:relative}
.sub_wrap {width:783px;margin-left:60px}
.clearfix:after {display:block;clear:both;content:".";visibility:hidden;height:0}
.clearfix {display:block}

.header {border-bottom:3px solid #456bb2;background:linear-gradient(0, white, #f8f8f8);box-shadow:2px 0 5px rgba(0,0,0,0.25);position:relative;z-index:10000}
.header .inner {width:885px;position:relative;left:-57px}
.header a {display:inline-block;transition:0.25s}
.header h1 {display:inline-block;margin:28px 0}
.header h1 a {}
.header .top_menu {display:inline-block;float:right;margin-top:15px;color:#aaa;font-size:10px}
.header .top_menu a {color:#aaa}
.header .top_menu a:hover {opacity:0.7}
.header .top_menu .eng {color:#4563cd}
.header .gnb {position:absolute;right:0;top:51px;z-index:10001}
.header .gnb li {display:inline-block;position:relative}
.header .gnb li > a {padding:0 35px;font-size:16px;font-weight:600;color:#555;border-right:1px solid #ddd}
.header .gnb li:last-child > a {padding-right:0;border-right:0}
.header .gnb li.on > a, 
.header .gnb li > a:hover {color:#4563cd}
.header .gnb .gnb_list {display:none;padding:0 7px;background:#fff;border:3px solid #426bb1;position:absolute;top:34px}
.header .gnb .gnb_list .ic_gnb {position:absolute;top:-10px}
.header .gnb .gnb_list1 {width:235px;left:-2px}
.header .gnb .gnb_list1 .ic_gnb {left:58px}
.header .gnb .gnb_list2 {left:32px}
.header .gnb .gnb_list2 .ic_gnb {left:48px}
.header .gnb .gnb_list3 {width:627px;left:-212px}
.header .gnb .gnb_list3 .ic_gnb {left:267px}
.header .gnb .gnb_list4 {left:33px}
.header .gnb .gnb_list4 .ic_gnb {left:30px}
.header .gnb .gnb_list5 {width:110px;left:4px}
.header .gnb .gnb_list5 .ic_gnb {left:53px}
.header .gnb .gnb_list a {padding:5px 7px;color:#426bb1;opacity:0.9}
.header .gnb .gnb_list a:hover {opacity:0.6}
.header .gnb li.on .gnb_list {display:block}

.aside {width:77px;height:254px;background:url(/img2021/aside.jpg) left top no-repeat;position:absolute;top:175px;right:-10px;z-index:10000}
.aside a {display:block;height:23px;position:relative}
.aside .bt1 {top:124px}
.aside .bt2 {top:125px}
.aside .bt3 {top:126px}
.aside .bt4 {top:127px}
.aside .bt_top {height:26px;top:135px}


.main {padding:75px 0;background:url(/img2021/main_bg.png) right top -12px no-repeat}
.main .left {display:inline-block;float:left}
.main .img_area {position:relative}
.main .img_area:after {display:block;clear:both;content:".";visibility:hidden;height:0}
.main .img_area a {display:inline-block;float:left;margin:0 0 1px 1px;vertical-align:top}
.main .img_area a:first-child {margin-left:0}
.main .img_area a img {} 
.main .img_area .pro_img {width:143px;height:117px}
.main .img_area .pro_img img {}
.main .img_area .info_img {width:288px;height:237px;box-shadow:5px 0 5px rgba(0,0,0,0.2);position:absolute;right:0;top:0}
.main .img_area .info_img img {}
.main .img_area.sec1 {}
.main .img_area.sec2 {}
.main .img_area.sec3 {}
.main .img_area.sec3 a {margin-bottom:0}

.main .right {display:inline-block;margin-left:55px}
.main .main_tit {display:block;margin:15px 0 47px 0}
.main .notice {margin-bottom:32px;padding:8px 10px;background:#fdfdfd;border:1px solid #eee;position:relative}
.main .notice b {display:inline-block;margin-right:20px;color:#555}
.main .notice .list {display:inline-block}
.main .notice .list span {font-weight:600;letter-spacing:-0.7px}
.main .notice .list a {display:inline-block;width:220px;margin-left:4px;font-weight:400;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;vertical-align:top;transition:0.25s}
.main .notice .list a:hover {color:#426bb1}
.main .notice .bt_more {position:absolute;top:9px;right:8px}
.main .main_quick {width:372px;height:171px;background:url(/img2021/main_quick.jpg) left top no-repeat;position:relative}
.main .main_quick a {display:block;width:137px;height:22px;position:absolute}
.main .main_quick .bt_online {width:192px;height:85px;left:0;top:0}
.main .main_quick .bt_cer {width:192px;height:85px;left:0;bottom:0}
.main .main_quick .bt_map {right:0;bottom:44px}
.main .main_quick .bt_history {right:0;bottom:22px}
.main .main_quick .bt_greeting {right:0;bottom:0}

.main_banner {width:77px;height:208px;background:url(/img2021/main_banner.jpg) left top no-repeat;position:absolute;right:0;bottom:75px}
.main_banner a {display:block;height:69px}
.main_banner .bt1 {}
.main_banner .bt2 {}
.main_banner .bt3 {}

.sub_area #container {background:transparent}
.sub_area #content_wrap {top:-122px;z-index:2}
.sub_area .sub_visual {height:195px;background-image:url(/img2021/sub_bg1.png);background-position:right -10px top;background-repeat:no-repeat;position:relative;z-index:1}
.sub_area .sub_visual.about {background-image:url(/img2021/sub_bg1.png)}
.sub_area .sub_visual.tech {background-image:url(/img2021/sub_bg2.png)}
.sub_area .sub_visual.product {background-image:url(/img2021/sub_bg3.png)}
.sub_area .sub_visual.inquiry {background-image:url(/img2021/sub_bg4.png)}
.sub_area .sub_visual.customer {background-image:url(/img2021/sub_bg5.png)}
.sub_area .sub_visual..sitemap {background-image:url(/img2021/sub_bg1.png)}
.sub_area #lnb {z-index:9999}
.sub_area #lnb h2 {padding-bottom:20px;color:#3d3d3d;font-size:29px;font-weight:600;line-height:35px;border-bottom:2px solid #838485;word-break:keep-all}
.sub_area #lnb h2 span {display:block;font-size:11px;line-height:15px;opacity:0.4}
.sub_area .left_menu {margin:25px 0 38px 0}
.sub_area .left_menu li {display:block;border-bottom:1px solid #e6e8ea}
.sub_area .left_menu li:last-child {border-bottom:0}
.sub_area .left_menu li a {display:block;margin:1px 0;padding:8.5px 5px;color:#777;font-size:14px;font-weight:600;letter-spacing:-0.3px;background:transparent}
.sub_area .left_menu li:hover a, 
.sub_area .left_menu li.on a {padding-right:20px;color:#fff;text-align:right;background-image:url(/img2021/ic_menu_arrow.png), linear-gradient(45deg, #3577bc, #3360a2);background-position:right center;background-repeat:no-repeat}
.sub_area .left_quick {}
.sub_area .left_quick a {}

.sub_area .nav {display:block;margin-bottom:35px;font-size:11px;line-height:11px}
.sub_area .nav li {display:inline-block;color:#b0b0b0}
.sub_area .nav li.home {cursor:pointer;vertical-align:top;position:relative;top:1px}
.sub_area .nav li.nav_on {color:#888}

.sub_area h3 {margin-bottom:50px;color:#555;font-size:28px;font-weight:600;letter-spacing:-0.5px;line-height:33px}
.sub_area h3 p {font-size:12px;font-weight:500;opacity:0.5}


.footer {margin-top:10px;padding:33px 0;background:linear-gradient(0, white, #f8f8f8);border-top:1px solid #ededed}