

/**
 * 메인
 */
#wrap_main {min-width:1280px; margin:0 auto;}
.container_main {padding-top:100px; min-width:1263px; max-width:1920px; height: 100%; margin:0 auto; font-family:'Noto Sans', sans-serif;}

/* popup_banner */
.wrap_main .pop_bar {position:fixed; top:0; left:0; z-index:1030; width:100%; background:#002e5d;}
.wrap_main .pop_bar .inner_bar {text-align:center; height:30px; font-size:12px; line-height:30px; color:#fff;}
.wrap_main .pop_bar .inner_bar .desc_bar,
.wrap_main .pop_bar .inner_bar .area_btn {display:inline-block; vertical-align:middle;}
.wrap_main .pop_bar .inner_bar .area_btn .btn_bar {margin-left:4px;}
.wrap_main .header.has-pop-bar {margin-top:30px;}

/* top_banner */
.wrap_main .header {margin-top:0; font-family:'Noto Sans', sans-serif;}
.wrap_main .banner_area.scroll-up {height:0px;}
.wrap_main .banner_area {position:fixed; top:0; width:100%; height:100px; background:#00b5e2; z-index:10000;}
.wrap_main .banner_area .banner {position:relative; width:1090px; margin:0 auto;}
.wrap_main .banner_area .banner .img img {display:block; line-height:0; width: 1090px; height: 100px;}
.wrap_main .banner_area .banner .close {position:absolute; bottom:14px; right:20px;}
.wrap_main .banner_area .banner .close .btn_close {display:block; margin-left:126px; margin-bottom:20px; width:24px; height:24px; background:url(../image/btn_close.png) no-repeat center;}
.wrap_main .banner_area .banner .close .checkbox {overflow:hidden; position:absolute; width:1px; height:1px; padding:0; border:0; margin:-1px; clip:rect(0 0 0 0);}
.wrap_main .banner_area .banner .close .checkbox + .label {cursor:pointer; margin-bottom:-8px; font-size:14px; color:#fff;}
.wrap_main .banner_area .banner .close .checkbox + .label:before {display:inline-block; width:13px; height:13px; background:url(../image/btn_chkbox_off.gif) no-repeat; margin-bottom:-2px; margin-right:10px; content:'';}
.wrap_main .banner_area .banner .close .checkbox:checked + .label:before {background:url(../image/btn_chkbox_on.gif) no-repeat; font-family:'Noto Sans', sans-serif;}

/* 비주얼 네비게이션  */
.container_main .visual_nav {position:fixed; top:50%; right:53px; margin-top:-74px;  width:138px; z-index:1020; cursor:pointer;}
.container_main .visual_nav .nav {padding:8px 0;}
.container_main .visual_nav .nav:after {display:block; content:''; clear:both;}
.container_main .visual_nav .nav_txt {display:none; float:left; margin-right:10px; width:104px; height:24px; border-radius:24px; background:#00265b; font-size:12px; text-align:center; line-height:24px; color:#fff;}
.container_main .visual_nav .nav_img {float:right; width:24px; height:24px;}
.container_main .visual_nav .nav.on .nav_txt,
.container_main .visual_nav .nav.active .nav_txt {display:block;}

/* visual */  
.section_visual  {position: relative; height:790px; }
.section_visual .visual_area {overflow-x:hidden;}
.section_visual .visual_area .visual {float:left; min-width:1263px; max-width:1920px; min-height:790px;  text-align:center;}
.section_visual .visual_area .visual1 {background:url(../image/bg_visual1.png) no-repeat;background-position:center top;}
.section_visual .visual_area .visual2 {background:url(../image/bg_visual2.png) no-repeat; background-position:center top;}
.section_visual .visual_area .visual3 {background:url(../image/bg_visual3.png) no-repeat; background-position:center top;}
.section_visual .visual_area .visual4 {background:url(../image/bg_visual4.png) no-repeat; background-position:center top;}
.section_visual .visual_area .visual .tit {margin:245px auto 0; width:auto; font-weight:700; font-size:50px; line-height:1.2; color:#fff; text-shadow:0 0 7px #333;}
.section_visual .visual_area .visual .tit_eng {font-size:28px;}
.section_visual .prev {position: absolute; top:312px; left:20px; width:51px; height: 47px; z-index: 1020; cursor: pointer;}
.section_visual .next {position: absolute; top:312px; right:20px; width:51px; height: 47px; z-index: 1020; cursor: pointer;}
.section_visual .visual_btn {position:absolute; top:45%; left:50%; margin-left:-136px; text-align:center; color:#fff; z-index:1020;}
.section_visual .visual_btn .btn {float:left; width:72px; padding-right:30px;}
.section_visual .visual_btn .btn:last-child {padding:0;}
.section_visual .wrap_circle {position:absolute; z-index:1010; top:1px; left:0; width:100%; height:790px; background:url(../image/bg_circle_all.png) no-repeat 50% 0;}
.section_visual .circle {position:absolute; top:488px; left:50%; width:336px; height:336px; margin-left:194px;}

/* main 공통 */
/* 각 section 밑으로는 200px 여백, 1280px 안 content 영역은 1170px */ 
.container_main .section {margin:0 auto;padding-bottom:200px; width:1170px;}
.container_main .area .list li{float:left}
.container_main .area .list:after {content:''; display:block; clear:both;}
.container_main .box_tit {padding-bottom:50px; height:63px; text-align:center; color:#000;}
.container_main .box_tit .tit {margin-bottom:6px; font-size:36px; font-weight:500;}
.container_main .box_tit .sub_tit {font-size:18px;} 
.container_main .menu_tit {font-size:20px; font-weight:700; line-height:20px;}
.container_main .desc {font-size:16px; line-height:20px;}

/* section - about us */
.section_about .area {padding:0 40px;}
.section_about .menu_area .list .menu_tit {padding:35px 0 12px;}
.section_about .menu_area .list li { margin-left:22px; width:348px;}
.section_about .menu_area .list li:first-child {margin-left:0; background:url(../image/bg_aboutus1.png) no-repeat 90% 0;}
.section_about .menu_area .list li:nth-child(2) {background:url(../image/bg_aboutus2.png) no-repeat 90% 0;}
.section_about .menu_area .list li:nth-child(3) {background:url(../image/bg_aboutus3.png) no-repeat 90% 0;}
.section_about .menu_area .list li:nth-child(4) {background:url(../image/bg_aboutus4.png) no-repeat 90% 0;}
.section_about .menu_area .list .desc {padding-right:60px; height:120px; font-size:16px; color:#333; line-height:21px;}
.section_about .news_area {margin-top:100px;}
.section_about .news_area .menu_tit {padding-bottom:24px;}
.section_about .news_area .menu_tit a:after {content:''; display:inline-block; padding-left:9px; width:17px; height:17px; background:url(../image/btn_detail.png) no-repeat right top; vertical-align:middle;}
.section_about .news_area .list:after {display:block; clear:both; height:0; content:'';}
.section_about .news_area .list li {margin-top:45px; margin-left:22px; width:534px;}
.section_about .news_area .list li:first-child {margin-left:0; margin-top:0;}
.section_about .news_area .news_detail {padding:5px 0;}
.section_about .news_area .news_detail div {float:left;}
.section_about .news_area .news_detail .bul_cate {width:16px; height:20px; background:url(../image/bul_list.gif) no-repeat 0 50%;}
.section_about .news_area .news_detail .news_tit {width:408px; height:20px; font-size:16px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height:20px; vertical-align:middle;}
.section_about .news_area .news_detail .news_tit:hover, 
.section_about .news_area .news_detail .news_tit:hover + .news_date {font-weight:500;}
.section_about .news_area .news_detail .news_date {margin-left:10px; width:72px; color:#666;}
.section_about .btn_detail {font-size:14px;}
.section_about .btn_detail:hover {color:#000; font-weight:500;}
.section_about .btn_detail:hover:after {background-position:top;}

/* section - products */
.section_products .menu_area .menu_tit {padding-bottom:20px;}
.section_products .menu_area .list li {position:relative; box-sizing:border-box; padding:40px 140px 0 40px; border:1px solid #ccc; margin:0 0 0 15px; width:577px; height:300px; cursor:pointer;}
.section_products .menu_area .list li:first-child,
.section_products .menu_area .list li:nth-child(4) {margin:0;}
.section_products .menu_area .list li:first-child {background:url(../image/bg_product1.png) no-repeat 95% 30px;}
.section_products .menu_area .list li:nth-child(2) {background:url(../image/bg_product_water.png) no-repeat 95% 30px;}
/* 더보기 회색바탕 */
.section_products .menu_area .list li .btn_more {position:absolute; left:0; bottom:0; width:100%; height:80px; background:#ccc url(../image/btn_more.png) no-repeat 100% 50%;}
.section_products .menu_area .list .menu_link {display:none;}
.section_products .menu_area .list .menu_link p {position:relative; width:90%; border-bottom:1px solid #fff;}
.section_products .menu_area .list .menu_link .link {display:block; height:29px; line-height:29px; color:#fff;}
.section_products .menu_area .list .menu_link .link small {font-size:14px; line-height:29px;}
.section_products .menu_area .list .menu_link .link:after {position:absolute; top:50%; right:0; width:17px; height:17px; margin-top:-8px; background:url(../image/btn_detail.png) no-repeat 0; content:'';}
/* 메뉴 마우스오버  */
.section_products .menu_area .list li:first-child:hover {background:url(../image/bg_product1_hover.png) no-repeat 95% 30px #01b4e5;}
.section_products .menu_area .list li:nth-child(2):hover {background:url(../image/bg_product_water_hover.png) no-repeat 95% 30px #01b4e5;}
.section_products .menu_area .list li:hover .menu_tit {font-weight:400; color:#fff;}
.section_products .menu_area .list li:hover .desc,
.section_products .menu_area .list li:hover .btn_more {display:none;}
.section_products .menu_area .list li:hover .menu_link {display:block;}
/* .section_products .menu_area .list li:last-child:hover .desc {display:block; color:#fff;} */
/* 제품자료실 링크 */
.section_products .menu_area .list li .link_product_data {position:absolute; top:0; left:0; width:100%; height:100%;}

/* section - prcenter */
.section_prcenter .list li {margin-left:15px; width:380px; height:452px; text-align:center;}
.section_prcenter .list li:first-child {margin-left:0;}
.section_prcenter .list .menu_tit {padding:26px 0; border:1px solid #ccc; border-bottom:none;}
.section_prcenter .list .link {display:block; border:1px solid #ccc; width:378px; height:380px; line-height:0;}

/* section - investor */
.section_investor .area .list li {float:none; position:relative; height:200px; background:url(../image/bg_recruit1.png) no-repeat 250px 50%; border:1px solid #ccc;}
.section_investor .list li .link {display:block; box-sizing:border-box; width:100%; height:100%; padding:50px 250px;}
.section_investor .list li .menu_tit,
.section_investor .list li .desc {padding-left:120px; padding-top:10px;}
.section_investor .list li .menu_tit {padding-top:20px;}
.section_investor .list li .btn_detail {position:absolute; top:45%; left:850px; font-size:14px;}
.section_investor .list li:hover {background-color:#01b4e5; background-image:url(../image/bg_recruit1_hover.png); color:#fff;}
.section_investor .list li:hover .btn_detail {color:#fff;}
.section_investor .list li:hover .btn_detail:after {background-position:0 -18px}