@charset "utf-8"; /* CSS Document */ body{ font-size:16px} .box0{ width:94%; margin:0 auto} .box1{ width:1180px; margin:0 auto; max-width:100%} .box2{ padding:0 2em; margin:0 auto;} .PC{ display:none !important} .PHONE{ display:none !important} .eng_m_st{ display:none !important} #header{ position:fixed; z-index:1000; left:0; top:0; width:100%; border-bottom:1px solid rgba(255,255,255,.2); transition:.3s} #header .va_wrap{ height:4.625em} .headerPD{ padding-top:4.625em} #header .logo{ float:left} #header .logo > a{ position:relative} #header .logo > a .logo1{ display:inline-block} #header .logo > a .logo2{ display:none} #header .logo img{ max-height:80%} #header .eng_m_st { position:absolute; right:43px; top:25px; color:#fff; font-size:1.063em;} #header .eng_m_st .eng_m_xi {display:inline; padding-right:2px; font-size:15px;} #header .menu_wrap{ float:right} #header .gnb_wrap{ float:left} #header .gnb_wrap .gnbBg{ position:absolute; top:4.625em; left:0; width:100%; height:0; background:#f9f9f9; transition:.2s} #header .gnb_wrap.on .gnbBg{ box-shadow:0 1px 3px rgba(0,0,0,.3)} #header .gnb_wrap.on .gnbBg:before{ content:""; position:absolute; left:0; top:0; z-index:1; height:1px; width:100%; background:#ddd} #header .gnb_wrap .gnb > li{ position:relative} #header .gnb_wrap .gnb > li .dp1{ color:#fff; padding:0 1em; min-width:7.5em; position:relative} #header .gnb_wrap .gnb > li .dp1:after{ content:""; position:absolute; left:0; bottom:-2px; width:0; height:4px; background:#00a3dd; z-index:1; transition:.3s;} #header .gnb_wrap .gnb > li .dp1 .va{ position:relative; z-index:1; font-size:1.125em; transition:.3s} #header .gnb_wrap .gnb > li .dp2{ position:absolute; left:0; width:100%; opacity:0; visibility:hidden; background:#fff; box-sizing:border-box; padding:1rem 0 1.5rem 0} #header .gnb_wrap .gnb > li .dp2:after, #header .gnb_wrap .gnb > li:first-child .dp2:before{ content:""; position:absolute; z-index:1; right:-1px; top:0; width:1px; height:100%; background:#eee} #header .gnb_wrap .gnb > li:first-child .dp2:before{ right:auto; left:-1px} #header .gnb_wrap .gnb > li .dp2 > li{ display:block} #header .gnb_wrap .gnb > li .dp2 > li > a{ height:auto; color:#666; text-align:center; padding:1em} #header .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em} #header .gnb_wrap .gnb > li:hover .dp1:after, #header .gnb_wrap .gnb > li.on .dp1:after{ width:100%} #header .gnb_wrap.on .gnb > li .dp2{ opacity:1; visibility:visible; transition-delay:.2s;} #header .gnb_wrap .gnb > li .dp2 > li:hover > a{ color:#00a3dd} #header .all_wrap{ float:left; display:none} #header .all_wrap .allBtn{ width:5em; text-align:center; margin-left:.5em} #header .all_wrap .allBtn .va{ font-size:1.688em; color:#fff} #header .all_wrap .all{ position: fixed; z-index:1; right:0; top:0; width:22em; max-width:90%; height:100%; box-shadow:-5px 0 5px rgba(0,0,0,.2); opacity:0; visibility:hidden; transition:.3s} #header .all_wrap .all:before{ content:""; position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:.5} #header .all_wrap .all .in{ position: absolute; right:-100%; width:100%; height:100%; background:#fff; transition:.3s} #header .all_wrap .all .tit_wrap{ background:#003f87; position:relative; border-bottom:1px solid rgba(255,255,255,.2)} #header .all_wrap .all .tit_wrap .btn{ position:absolute; top:0; width:5em; height:100%; text-align:center; color:#fff; transition:.3s} #header .all_wrap .all .tit_wrap .btn:hover{ background:rgba(0,0,0,.1)} #header .all_wrap .all .tit_wrap .btn.close{ right:0; margin-right:1em} #header .all_wrap .all .tit_wrap .tit{ padding:0 6em} #header .all_wrap .all .tit_wrap .tit .va{ color:#fff; font-size:1.25em} #header .all_wrap .gnb > li{ display:block} #header .all_wrap .gnb li > a{ position:relative; text-align:left; padding:0 2em; height:3.5em; overflow:hidden} #header .all_wrap .gnb li > a:after{ content:"\e93f"; font-family:xeicon!important; position:absolute; right:0; top:0; width:3em; text-align:center; line-height:3.5em} #header .all_wrap .gnb > li .dp1{ color:#111; border-bottom:1px solid #ddd} #header .all_wrap .gnb > li .dp2{ background:#f5f5f5; padding:0 0 0 1px; position:relative} #header .all_wrap .gnb > li .dp2:after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#ddd} #header .all_wrap .gnb > li .dp2 > li{ width:50%} #header .all_wrap .gnb > li .dp2 > li > a{ border:1px solid #ddd; margin:-1px 0 0 -1px; color:#666; transition:.3s} #header .all_wrap .gnb > li .dp2 > li > a:after{ right:-100%; transition:.3s} #header .all_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em} #header .all_wrap .gnb > li:hover > .dp1{ background:#003f87; color:#fff} #header .all_wrap .gnb > li .dp2 > li:hover > a{ background:#555; border-color:transparent; color:#fff} #header .all_wrap .gnb > li .dp2 > li:hover > a:after{ right:0} #header .all_wrap.on .all{ opacity:1; visibility:visible} #header .all_wrap.on .all .in{ right:0} #header .language{ float:left; margin-left:1em} #header .language .va{ position:relative} #header .language .langBtn{ display:block; border:1px solid rgba(255,255,255,.2); color:#fff; padding:.5em .7em; transition:.3s} #header .language .langBtn .tt{ text-transform:uppercase; font-size:.813em; padding:0 1.5em 0 .5em} #header .language .langBtn .arrow{ transition:.2s} #header .language .langList{ position:absolute; left:0; width:100%; z-index:1; padding-top:.2em; visibility:hidden; opaicty:0; transition:.3s} #header .language .langList > li > a{ display:block; border-top:1px solid rgba(255,255,255,.2); color:#fff; padding:.7em 1em; text-align:left; background:#003f87; position:relative; overflow:hidden} #header .language .langList > li > a:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; opacity:.2} #header .language .langList > li > a.link:before{ display:none} #header .language .langList > li:first-child > a{ border-top:none} #header .language .langList > li > a .tt{ font-size:.75em} #header .language .langList > li > a .arrow{ position:absolute; right:-1em; top:50%; margin-top:-.4em; transition:.3s} #header .language .langList > li > a .arrow:before{ font-size:.75em} #header .language .langList > li:hover > a {background:#fff; color:#003f87;} #header .language .langList > li:hover > a.link .arrow{ right:.5em} #header .language.on .langBtn{ background:#003f87; border-color:transparent} #header .language.on .langList{ visibility:visible; opacity:1} #header .language.on .langBtn .arrow{ transform:rotate(90deg)} .stW#header{ background:#fff; border-bottom-color:#ddd} .stW#header .logo > a .logo1{ display:none} .stW#header .logo > a .logo2{ display:inline-block} .stW#header .gnb_wrap .gnb > li .dp1{ color:#777} .stW#header .gnb_wrap .gnb > li:hover .dp1, .stW#header .gnb_wrap .gnb > li.on .dp1{ color:#003f87} .stW#header .language .langBtn{ background:#003f87} #footer{ background:#282828} #footer .menu_wrap .box1{ position:relative} #footer .menu_wrap .gnb_wrap{} #footer .menu_wrap .gnb_wrap .gnb > li{ width:25%; position:relative} #footer .menu_wrap .gnb_wrap .gnb > li:after, #footer .menu_wrap .gnb_wrap .gnb > li:first-child:before{ content:""; position:absolute; right:0; top:0; width:1px; height:100%; background:#fff; opacity:.1} #footer .menu_wrap .gnb_wrap .gnb > li:first-child:before{ left:0} #footer .menu_wrap .gnb_wrap .gnb > li .dp1{ padding:2em 1.5em 1em 1.5em; color:#fff; text-align:left} #footer .menu_wrap .gnb_wrap .gnb > li .dp2{ padding-bottom:3rem} #footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li{ display:block} #footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a{ padding:.5em 1.5em; text-align:left; color:#fff; opacity:.6; transition:.3s} #footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.813em} #footer .menu_wrap .gnb_wrap .gnb > li .dp2 > li > a:hover{ opacity:1} #footer .menu_wrap .etc_wrap{ width:16.7%; position:absolute; right:0; top:0; height:100%} #footer .menu_wrap .etc_wrap:before, #footer .menu_wrap .etc_wrap:after{ content:""; position:absolute; top:0; width:1px; height:100%; background:#fff; opacity:.1} #footer .menu_wrap .etc_wrap:after{ right:0} #footer .menu_wrap .etc_wrap .in{ padding:2em 1em} #footer .menu_wrap .etc_wrap .in .catalog{ display:block; background:#fff; color:#003f87; height:2.5em; transition:.3s} #footer .menu_wrap .etc_wrap .in .catalog .tt{ font-size:.875em; padding-left:.5em} #footer .menu_wrap .etc_wrap .in .catalog:hover{ background:#003f87; color:#fff} #footer .link_wrap{ border:1px solid #333; border:1px solid rgba(255,255,255,.1); border-left:none; border-right:none} #footer .link_wrap .va_wrap{ height:3em} #footer .link_wrap .link > li > a{ margin:0 2.5em; color:#fff} #footer .link_wrap .link > li > a:first-child{ margin-left:0} #footer .link_wrap .link > li > a .va{ font-size:.875em} #footer .link_wrap .link > li > a:hover .va{ text-decoration:underline} #footer .link_wrap .gotop{ display:block; width:3.5em; background:#111; background:rgba(0,0,0,.4); opacity:.7; color:#fff; text-align:center; transition:.3s} #footer .link_wrap .gotop .xi{ display:block} #footer .link_wrap .gotop .tt{ display:block; font-size:.625em; letter-spacing:0} #footer .link_wrap .gotop:hover{ background:#003f87; color:#fff; opacity:1} #footer .info_wrap{ padding:2em 0 3em 0} #footer .info_wrap .info{ } #footer .info_wrap .info > li{ margin-right:1.6em; font-size:.813em; color:#fff; opacity:.6; line-height:2; letter-spacing:0} #footer .info_wrap .info > li.copyright{ clear:both; padding-top:1em; font-size:.688em; color:#fff; opacity:.3; text-transform:uppercase} #contents{} #contents .sub_visual_wrap{ position:relative} #contents .sub_visual_wrap .va_wrap{ position:relative; height:20em; overflow:hidden} #contents .sub_visual_wrap .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-position:center; background-repeat:no-repeat; background-size:cover; transform:scale(1.2,1.2); transition:1s} #contents .sub_visual_wrap .slogan{ position:relative} #contents .sub_visual_wrap .slogan .t1{ font-size:2.25em; color:#fff; padding-bottom:.7em; margin-left:10em; opacity:0; transition:1s} #contents .sub_visual_wrap .slogan .t1:before{ content:""; display:block; width:1em; height:.1em; margin:0 auto .5em auto; background:#fff} #contents .sub_visual_wrap .slogan .t2{ font-size:.813em; letter-spacing:.5em; text-transform:uppercase; color:#fff; margin-right:10em; margin-bottom:4em; opacity:0; transition:1s} .load #contents .sub_visual_wrap .bg{ transform:scale(1,1)} .load #contents .sub_visual_wrap .slogan .t1{ margin-left:0; opacity:1} .load #contents .sub_visual_wrap .slogan .t2{ margin-right:0; opacity:.6} #contents .sub_visual_wrap .sub_gnb_wrap{ position:absolute; left:0; bottom:0; width:100%} #contents .sub_visual_wrap .sub_gnb_wrap:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:50%; background:#fff} #contents .sub_visual_wrap .sub_gnb_wrap .gnb{ text-align:center} #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li, #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp1{ display:none} #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.on, #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li.on .dp2{ display:block} #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{ } #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a{ background:#fff; height:3.8em; font-size:.938em; color:#222; transition:.3s; border-left:1px solid #e5e5e5;} #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:first-child > a {border-left:none;} #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:1.125em; /*opacity:.4;*/ transition:.3s; } #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:hover > a .va, #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a .va{ opacity:1 ;} #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li:hover > a, #contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li.on > a {background:#187aef; transition:.3s; color:#fff;} #contents .sub_tit_wrap{ border-bottom:1px solid #ddd; text-align:center; position:relative; background:#fff; transition:.3s; z-index:1;} #contents .sub_tit_wrap .va_wrap{ height:5em; z-transition:.3s} #contents .sub_tit_wrap .tit{ font-size:2.25em; color:#111; display:none;} #contents .sub_tit_wrap .pageMove > li > a{ position:absolute; height:100%; color:#666; transition:.3s} #contents .sub_tit_wrap .pageMove > li > a .xi{ width:2em; line-height:2em; text-align:center; background:#666; color:#fff; margin:0 .7em; border-radius:100%} #contents .sub_tit_wrap .pageMove > li > a .xi:before{ font-size:1.25em;} #contents .sub_tit_wrap .pageMove > li > a .tt{ display:inline-block; font-size:1.125em; opacity:.7; min-width:6em} #contents .sub_tit_wrap .pageMove > li > a.prev{ left:0; padding-left:2%; text-align:left} #contents .sub_tit_wrap .pageMove > li > a.next{ right:0; padding-right:3%; text-align:right} #contents .sub_tit_wrap .pageMove > li > a:hover{ opacity:1; color:#0072c6} #contents .sub_tit_wrap .pageMove > li > a:hover .xi{ background:#0072c6} #contents .sub_tit_wrap .pageMove > li > a:hover .tt{ opacity:1} #contents .sub_tit_wrap .pageMove > li > a.prev:hover{ padding-left:1%; padding-right:1%} #contents .sub_tit_wrap .pageMove > li > a.next:hover{ padding-right:2%; padding-left:1%} #contents .sub_tit_wrap.fix{ /*position: fixed;*/ left:0; width:100%; box-shadow:0 1px 5px rgba(0,0,0,.2)} #contents .sub_tit_wrap.fix .va_wrap{ height:4em; font-size:.875em} #contents .doc{ padding:3em 0 15em 0} #contents .doc.st{ padding:0 0 15em 0} #contents .doc.st1{ padding:2em 0 15em 0} #contents .doc.st2{ padding:3em 0 0 0} /************************************************************************************************************************************************************/ /******************************************************************MAIN**************************************************************************************/ /************************************************************************************************************************************************************/ .map_st {padding:10px 0 30px 0;} .mainVisual_wrap{ position:relative} .mainVisual .slides{ overflow:hidden} .mainVisual .img{ position:relative} .mainVisual .img .bg{ display:block; height:0; padding-bottom:53.57%; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center top; background-size:cover;} .mainVisual .img .slogan_wrap{ position: absolute; left:0; top:0; width:100%; padding-top:170px;} .mainVisual .img .slogan{ width:75%; margin:auto; position:relative; padding:70px} .mainVisual .img .slogan .t1{ font-size:3.5em; color:#fff; padding-bottom:.5em; opacity:0; margin-left:-10%; text-shadow:0 1px 2px rgba(0,0,0,.5)} .mainVisual .img .slogan .t2{ font-family:notokrR, sans-serif; font-size:1.125em; color:#fff; line-height:1.8; opacity:0; margin-left:-10%; text-shadow:0 1px 2px rgba(0,0,0,.5)} .mainVisual .img .slogan .line{ position:absolute; background:#fff; width:10px; height:10px} .mainVisual .img .slogan .line.line1{ height:0; left:10%; bottom:90%} .mainVisual .img .slogan .line.line2{ width:0; right:90%; top:0} .mainVisual .img .slogan .line.line3{ height:0; left:0; top:0} .mainVisual .img .slogan .line.line4{ width:0; left:0; bottom:0} .mainVisual .img .slogan .line.line5{ height:0; left:20%; bottom:0} .mainVisual .img.flex-active-slide .slogan .line{ transition:.5s} .mainVisual .img.flex-active-slide .slogan .line.line1{ height:10%} .mainVisual .img.flex-active-slide .slogan .line.line2{ width:10%; transition-delay:.5s} .mainVisual .img.flex-active-slide .slogan .line.line3{ height:100%; transition-delay:1s} .mainVisual .img.flex-active-slide .slogan .line.line4{ width:20%; transition-delay:1.5s} .mainVisual .img.flex-active-slide .slogan .line.line5{ height:10%; transition-delay:2s} .mainVisual .img.flex-active-slide .slogan .t1{ opacity:1; margin-left:0; transition:1s} .mainVisual .img.flex-active-slide .slogan .t2{ opacity:1; margin-left:0; transition:1s; transition-delay:.5s} .mainVisual .flex-control-paging{ position:absolute; bottom:10%; left:12.5%; z-index:100} .mainVisual .flex-control-paging > li{ display:inline-block; *display:inline; zoom:1;} .mainVisual .flex-control-paging > li > a{ display:block; width:12px; height:12px; border-radius:12px; margin:0 4px; font-size:0; position:relative; border:1px solid #fff; transition:.5s} .mainVisual .flex-control-paging > li > a.flex-active{ width:70px; background:#fff} .main_nav{ position:fixed; right:30px; top:0; z-index:1000; height:100%; transition:.3s} .main_nav .nav{ background:#000; background:rgba(0,0,0,.7); padding:15px; text-align:center; border-radius:50px} .main_nav .nav > li{ } .main_nav .nav > li > a{ display:block; width:15px; height:15px; border-radius:17px; background:#fff; margin:5px 0; transition:.3s; opacity:.7} .main_nav .nav > li:hover > a{ opacity:1} .main_nav .nav > li.on > a{ height:40px; opacity:1 } #scrollAni{ position: absolute; left:50%; width:100px; margin-left:-50px; text-align:center; bottom:40px; opacity:1; z-index:100; text-decoration:none} #scrollAni .xi{ vertical-align:middle} #scrollAni .xi-mouse{font-size:3em; color:#fff; margin-right:-7px} #scrollAni .xi-scroll{font-size:2em; color:#fff; margin-left:-7px} #scrollAni .tt{ display:block; color:#fff; font-size:.75em; text-transform:uppercase; font-family:Arial, Helvetica, sans-serif} #scrollAni.hide{ opacity:0; z-index:-1} /*메인 타이틀*/ .main_tit {text-align:center; padding:40px 0;} .main_tit .tit {font-size:2.188em; vertical-align:middle; font-family:Arial, Helvetica, sans-serif;} .main_tit .tit > strong {color:#999999; vertical-align:bottom;} .main_tit.st {padding:60px 0 0 0;} .main_tit .tit.st {color:#fff; } /*main 01*/ .main01 {padding-bottom:80px;} .main01 .bis_ul {overflow:hidden; margin-left:-15px;} .main01 .bis_ul .li_in {float:left; width:33.33%;} .main01 .bis_ul .li_in .con_in {margin-left:15px;} .main01 .bis_ul .li_in .con_in .con_im_wrap {position:relative; z-index:101;} .main01 .bis_ul .li_in .con_in .con_tx_wrap {padding:30px 30px 30px 30px; position:relative; z-index:101;} .main01 .bis_ul .li_in .con_in .con_tx_wrap.bg1 {background:#212736;} .main01 .bis_ul .li_in .con_in .con_tx_wrap.bg2 {background:#352929;} .main01 .bis_ul .li_in .con_in .con_tx_wrap.bg3 {background:#32233e;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .ti {color:#fff; font-size:1.5em; font-family:notokrM;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .tx {color:#fff; font-size:0.875em; padding:15px 0 30px 0; opacity:.7px;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .bis_more {color:#fff; font-size:0.875em; border:1px solid #fff; padding:5px 10px; vertical-align:middle; display:inline-block; margin-top:30px;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .bis_more .xi {vertical-align:middle; font-size:20px; padding-left:9px;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .bis_more.st {margin-right:10px;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .bis_more:hover {background:#f9f9f9; color:#0072c6; transition:.3s;} .main01 .bis_ul .li_in .con_in .con_tx_wrap .bis_more:hover .xi {margin-left:5px; transition:.3s;} /*main 02*/ .main02 {background:url(../images/main/main02_bg.jpg) no-repeat center center; background-size:cover;} .main02 .main02_t_w .line {background:#fff; width:30px; height:3px; margin:30px auto 10px auto;} .main02 .main02_t_w .ti {color:#fff; font-size:2em;} .main02 .main02_t_w .tx {color:#fff; padding:55px 0 65px 0; font-size:1.125em;} .main02 .main02_t_w .main02_more {display:inline-block; color:#fff; font-size:.875em; border:1px solid #fff; padding:10px 20px; margin:50px 0 60px 0;} .main02 .main02_t_w .main02_more .xi {padding-left:18px;} .main02 .main02_t_w .main02_more:hover {background:#0072c6; border:none; transition:.3s; } .main02 .main02_t_w .main02_more:hover .xi {color:#fff; transition:.3s; } /*main 03*/ .main03 { background:#f7f7f7; border-bottom:1px solid #ddd; position:relative; background-size:cover; /*background-image:url(../images/main/main03_bg.png); background-repeat:no-repeat; background-position:center center; height:675px;*/ } .main03.sub_st {background:none; border-bottom:none; margin-top:50px;} .main03 .main03_bg {text-align:center;} .main03 .main03_map_w {} .main03 .MAP_W {position:relative;} .main03 .main03_m_more {display:none; } .main03 .main03_map_w .main03_con_w {} .main03 .main03_map_w .main03_con_w > li {position:absolute; border-radius:25px;} .main03 .main03_map_w .main03_con_w > li .tt { position:relative; z-index:2; border:3px solid #fff; padding:7px 20px; box-shadow:1px 1px 1px rgba(0,0,0,.5); border-radius:25px; color:#fff; font-size:1em; font-family:notokrM; display:block; position:relative;} .main03 .main03_map_w .main03_con_w > li.map1 .tt{background:#644dba;} .main03 .main03_map_w .main03_con_w > li.map2 .tt{background:#0072c6;} .main03 .main03_map_w .main03_con_w > li.map3 .tt{background:#0072c6;} .main03 .main03_map_w .main03_con_w > li.map4 .tt{background:#003f87;} .main03 .main03_map_w .main03_con_w > li.map5 .tt{background:#0072c6;} .main03 .main03_map_w .main03_con_w > li.map6 .tt{background:#0072c6;} .main03 .main03_map_w .main03_con_w > li.map7 .tt{background:#0072c6;} .main03 .main03_map_w .main03_con_w > li.map8 .tt{background:#644dba;} .main03 .main03_map_w .main03_con_w > li.map9 .tt{background:#644dba;} .main03 .main03_map_w .main03_con_w > li.map1 { left:29.5%; bottom:59%; } .main03 .main03_map_w .main03_con_w > li.map2 { right:77%; top:37%;} .main03 .main03_map_w .main03_con_w > li.map3 { left:23.3%; top:44%;} .main03 .main03_map_w .main03_con_w > li.map4 { left:36%; bottom:57.2%;} .main03 .main03_map_w .main03_con_w > li.map5 { left:41.5%; top:42.9%;} .main03 .main03_map_w .main03_con_w > li.map6 { left:43.8%; bottom:41%;} .main03 .main03_map_w .main03_con_w > li.map7 { left:36.5%; top:62%;} .main03 .main03_map_w .main03_con_w > li.map8 { left:24.3%; top:46.4%;} .main03 .main03_map_w .main03_con_w > li.map9 { left:22.1%; bottom:65.4%;} .main03 .main03_map_w .main03_con_w > li .line {position:absolute; z-index:1;} .main03 .main03_map_w .main03_con_w > li .line1 {left:30px; bottom:0; height:57px; width:0; border:1px solid #644dba;} .main03 .main03_map_w .main03_con_w > li .line2 {right:0; top:16px; height:0; width:47px; border:1px solid #0072c6;} .main03 .main03_map_w .main03_con_w > li .line3 {left:28px; top:0; height:123px; width:0; border:1px solid #0072c6; /*transform:rotate(47deg)*/} .main03 .main03_map_w .main03_con_w > li .line4 {left:21px; bottom:0; height:20px; width:0; border:1px solid #003f87; /*transform:rotate(26deg)*/} .main03 .main03_map_w .main03_con_w > li .line5 {left:0; top:16px; height:0; width:50px; border:1px solid #0072c6;} .main03 .main03_map_w .main03_con_w > li .line6 {left:0; top:28px; height:0; width:63px; border:1px solid #0072c6;} .main03 .main03_map_w .main03_con_w > li .line7 {left:30px; top:0; height:40px; width:0; border:1px solid #0072c6;} .main03 .main03_map_w .main03_con_w > li .line8 {left:45px; top:0; height:40px; width:0; border:1px solid #644dba; } .main03 .main03_map_w .main03_con_w > li .line9 {left:28px; bottom:0; height:69px; width:0; border:1px solid #644dba; /*transform:rotate(-46deg)*/} .main03 .main03_map_w .main03_con_w > li.map1{ padding-bottom:57px;} .main03 .main03_map_w .main03_con_w > li.map2{ padding-right:47px;} .main03 .main03_map_w .main03_con_w > li.map3{ padding-top:123px;} .main03 .main03_map_w .main03_con_w > li.map4{ padding-bottom:20px;} .main03 .main03_map_w .main03_con_w > li.map5{ padding-left:50px;} .main03 .main03_map_w .main03_con_w > li.map6{ padding-left:63px;} .main03 .main03_map_w .main03_con_w > li.map7{ padding-top:40px;} .main03 .main03_map_w .main03_con_w > li.map8{ padding-top:40px;} .main03 .main03_map_w .main03_con_w > li.map9{ padding-bottom:69px;} /*서브 해외조직도 위치 .main03 .main03_map_w .main03_con_w > li.map1.sub1 {background:#644dba; left:26.7%; top:22%; } .main03 .main03_map_w .main03_con_w > li.map2.sub2 {background:#0072c6; left:2.5%; top:38%;} .main03 .main03_map_w .main03_con_w > li.map3.sub3 {background:#0072c6; left:11%; top:54%;} .main03 .main03_map_w .main03_con_w > li.map4.sub4 {background:#003f87; left:35%; top:28%;} .main03 .main03_map_w .main03_con_w > li.map5.sub5 {background:#0072c6; left:45%; bottom:50%;} .main03 .main03_map_w .main03_con_w > li.map6.sub6 {background:#0072c6; left:48.2%; bottom:39.5%;} .main03 .main03_map_w .main03_con_w > li.map7.sub7 {background:#0072c6; left:33%; bottom:19%;} .main03 .main03_map_w .main03_con_w > li.map8.sub8 {background:#644dba; left:23%; bottom:35%;} .main03 .main03_map_w .main03_con_w > li.map9.sub9 {background:#644dba; left:12.7%; top:20%;}*/ /*main 04*/ .customer_w{position:relative; height:70px; margin-bottom:40px; border-bottom:1px solid #ddd; border-top:1px solid #ddd;} .customer_w .customer_slide .tt{position:absolute; left:0; top:16px; z-index:3;} .customer_w .customer_slide .tt .xi{display:inline-block; *display:inline; zoom:1; vertical-align:middle; color:#000; font-size:30px; color:#000;} .customer_w .customer_slide .tt span{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; color:#fff; font-size:0.938em; cursor:pointer; background:#003f87; padding:10px 30px;} .customer_w .customer_slide .slides{} .customer_w .customer_slide .slides li{height:70px; line-height:70px; position:relative;} .customer_w .customer_slide .slides li .notice_tit {color:#000; font-family:notokrR; font-size: 1em; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding-right:180px; margin-left:130px; vertical-align:middle; width:50%;} .customer_w .customer_slide .slides li .notice_tit .xi {vertical-align:bottom; padding-right:3px;} .customer_w .customer_slide .flex-direction-nav{position:absolute; right:0; bottom:16px;} .customer_w .customer_slide .flex-direction-nav li{display:inline-block;} .customer_w .customer_slide .flex-direction-nav a{display:block; height:40px; width:40px; font-size:0;} .customer_w .customer_slide .flex-direction-nav a:hover{background-color:#111;} .customer_w .customer_slide .flex-direction-nav .flex-prev{background-color:#595959; background-image:url(../images/main/arr_up.png); background-repeat:no-repeat; background-position:center center; margin-right:1px;} .customer_w .customer_slide .flex-direction-nav .flex-next{background-color:#595959; background-image:url(../images/main/arr_down.png); background-repeat:no-repeat; background-position:center center;} .customer_w .customer_slide .slides li .notice_date{position:absolute; right:120px; top:0; color:#999; font-family:notokrR; font-size:.875em;} .main04 {padding-bottom:80px;} .main04 .custom_ul {overflow:hidden; margin-left:-10px;} .main04 .custom_ul .li_in {float:left; width:25%;} .main04 .custom_ul .li_in .con_in {margin-left:10px; border:1px solid #ddd; position:relative; overflow:hidden;} .main04 .custom_ul .li_in .con_in:after {position:absolute; content:""; right:-35px; bottom:-35px; width:65px; height:65px; transform:rotate(45deg); border-left:1px solid #ddd;;} .main04 .custom_ul .li_in .con_in .con_im_wrap {position:relative; z-index:101;} .main04 .custom_ul .li_in .con_in .con_tx_wrap {padding:20px 30px 50px 30px; position:relative; z-index:101;} .main04 .custom_ul .li_in .con_in .con_tx_wrap .ti {color:#000; font-size:1.250em; font-family:notokrM;} .main04 .custom_ul .li_in .con_in .con_tx_wrap .tx {color:#8d8d8d; font-size:0.875em; padding:15px 10px 0 0px;} .main04 .custom_ul .li_in .con_in .con_tx_wrap .bis_more {color:#656565; position:absolute; right:0; bottom:0;} .main04 .custom_ul .li_in .con_in .con_tx_wrap .bis_more .xi {font-size:23px;} .main04 .custom_ul .li_in .con_in .con_tx_wrap .bis_more:hover .xi {color:#0072c6; transition:.3s;} /************************************************************************************************************************************************************/ /******************************************************************SUB**************************************************************************************/ /************************************************************************************************************************************************************/ /*공통*/ .sub_tit{margin-bottom:10px; font-size:1.250em;} .sub_tit span.tit_dot{ width:0.3em; height:0.3em; border:4px solid #003f87; border-radius:100%; display:inline-block; margin-right:0.3em;} .sub_tit p{display:inline-block; vertical-align:middle; font-size:1.063em;} .photo_w{margin:1em 0 2em 0;} .paging_w{margin-top:5em;} /**/ .agree_wrap{ padding:.5em; font-size:.875em; line-height:1.5} .sub_tit.st{margin-bottom:10px; font-size:1.063em;} .sub_tit.st span.tit_dot.st { display:none;} /**/ .sub_prod_tit{ margin-top:-2em; margin-bottom:3em; position:relative; background-position:center top; background-size:cover; border-bottom-style:solid; border-bottom-width:3px} .sub_prod_tit .tit{ height:20em; position:relative; width:50%; text-align:left} .sub_prod_tit .tit .t1{ font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; font-size:2.5em; color:#111; border-bottom:1px dotted #000; padding-bottom:.5em; margin-bottom:.5em; position:relative} .sub_prod_tit .tit .t1:after{ content:""; position:absolute; right:0; bottom:-.1em; width:.2em; height:.2em; border-radius:100%; background:#111} .sub_prod_tit .tit .t2{ color:#111; font-size:1em; opacity:.8; line-height:1.7; padding-bottom:.5em} .sub_prod_tit .tit .logo{ max-height:4em; margin-top:1em} .sub_prod_tit.st1{ border-bottom-color:#0098be; background-image:url(../images/sub/product_1_bg.jpg)} .sub_prod_tit.st2{ border-bottom-color:#ffcc00; background-image:url(../images/sub/product_2_bg.jpg)} .SEARCH_W {background:none !important; padding:20px 0;} .SEARCH_W.st {margin-bottom:40px;} .prod_search_wrap2{ position:relative; } .prod_search_wrap2 .prod_search_tit{ position:absolute; right:0; top:0; width:170px; height:100%; background:#323b45; color:#fff; text-align:center; font-size:1.25em} .prod_search_wrap2 .prod_search_tit .xi{ display:block; font-size:1.5em; padding-bottom:5px} .prod_search_wrap2 .check_con {} .prod_search_wrap2 .check_con .check_ul {} .prod_search_wrap2 .check_con .check_ul > li {width:20%;} .prod_search_wrap2 .prod_search_con{text-align:center; margin-top:1.5em;} .prod_search_wrap2 .prod_search_con > li{ position:relative; display:inline-block; margin-bottom:3px;} .prod_search_wrap2 .prod_search_con > li.search_st {padding-left:0;} .prod_search_wrap2 .prod_search_con > li .con_tit{ position:absolute; left:0; top:0; width:110px; height:100%; background:#536373; color:#fff; font-size:.875em;} .prod_search_wrap2 .prod_search_con > li .con_tit:before{ content:""; position:absolute; left:0; top:0; width:100%; height:1px; background:rgba(255,255,255,.2)} .prod_search_wrap2 .prod_search_con > li .con_tit .xi{ font-size:1.250em; padding-right:3px; vertical-align:middle} .prod_search_wrap2 .prod_search_con > li .inp_wrap{padding-left:100px; } .prod_search_wrap2 .prod_search_con > li .inp_wrap .inp{ box-sizing:border-box; padding-top:5px; padding-bottom:5px; height:45px; border:1px solid #ddd; color:#666} .prod_search_wrap2 .prod_search_con > li .inp_wrap.wst1 {min-width:1200px;} .prod_search_wrap2 .prod_search_con > li .inp_wrap .inp.wst2 {padding:0 1em; width:130px !important;} .prod_search_wrap2 .prod_search_con > li .inp_wrap .inp.wst2.st {} .prod_search_wrap2 .prod_search_con > li .inp_wrap .inp.wst3 {min-width:250px;} .prod_search_wrap2 .prod_search_con > li .inp_wrap .inp.w1{ min-width:inherit} .prod_search_wrap2 .prod_search_con > li .inp_wrap input.inp{ padding-left:10px; padding-right:10px} .prod_search_wrap2 .prod_search_con > li .inp_wrap .inp.c1{ background:#003A6A; color:#fff; border:none} .prod_search_wrap{ position:relative; /*padding-left:170px*/} .prod_search_wrap .prod_search_tit{ position:absolute; right:0; top:0; width:170px; height:100%; background:#323b45; color:#fff; text-align:center; font-size:1.25em} .prod_search_wrap .prod_search_tit .xi{ display:block; font-size:1.5em; padding-bottom:5px} .prod_search_wrap .prod_search_con{} .prod_search_wrap .prod_search_con > li{ position:relative; padding-left:140px; display:inline-block; margin-bottom:3px;} .prod_search_wrap .prod_search_con > li.search_st {padding-left:0;} .prod_search_wrap .prod_search_con > li .con_tit{ position:absolute; left:0; top:0; width:130px; height:100%; background:#536373; color:#fff; font-size:.938em;} .prod_search_wrap .prod_search_con > li .con_tit:before{ content:""; position:absolute; left:0; top:0; width:100%; height:1px; background:rgba(255,255,255,.2)} .prod_search_wrap .prod_search_con > li .con_tit .xi{ font-size:1.250em; padding-right:3px; vertical-align:middle} .prod_search_wrap .prod_search_con > li .inp_wrap{ padding:10px; border:1px solid #ddd; /*margin-bottom:-1px*/} .prod_search_wrap .prod_search_con > li .inp_wrap .inp{ box-sizing: border-box; padding-top:5px; padding-bottom:5px; height:37px; border:1px solid #ddd; color:#666} .prod_search_wrap .prod_search_con > li .inp_wrap.wst1 {min-width:1016px;} .prod_search_wrap .prod_search_con > li .inp_wrap .inp.wst2 {min-width:194px;} .prod_search_wrap .prod_search_con > li .inp_wrap .inp.wst3 {min-width:397px;} .prod_cate_wrap2{ margin:0; padding:1em; border:1px solid #ddd; border-radius:0 0 10px 10px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2)} .prod_cate_wrap2 .list{ padding:1px 1px 0 0} .prod_cate_wrap2 .list > li{ width:11.1%; margin:-1px -1px 0 0} .prod_cate_wrap2 .list > li > button{ width:100%; border:1px solid #ddd; background:#fff; text-align:center; height:40px; color:#777; letter-spacing:-1px; font-size:.750em; position:relative; } .prod_cate_wrap2 .list > li:hover > button { color:#111; transition:.3s;} .prod_cate_wrap2 .list > li.on > button{ background:#999; border-color:#999; color:#fff; z-index:1; transition:.3s;} .prod_tit_wrap{ } .prod_tit_wrap .list{ padding:1px 1px 0 0} .prod_tit_wrap .list > li{ width:20%; margin:-1px -1px 0 0} .prod_tit_wrap .list > li > button{border:1px solid #ddd; display:block; padding:1em 0; background:#eee; margin:0 -1px -1px 0; text-align:center; height:60px; color:#fff; letter-spacing:-1px; font-size:1em; position:relative; width:100%; font-family:notokrR;} .prod_tit_wrap .list > li:hover > button {transition:.3s; } .prod_tit_wrap .list > li.on > button{ background:#002654; color:#003f87; z-index:1; font-family:notokrB; font-size:1.063em;} .prod_tit_wrap .list > li > button.img01 {background:url(../images/sub/project_01.jpg) no-repeat center center;} .prod_tit_wrap .list > li > button.img02 {background:url(../images/sub/project_02.jpg) no-repeat center center;;} .prod_tit_wrap .list > li > button.img03 {background:url(../images/sub/project_03.jpg) no-repeat center center;;} .prod_tit_wrap .list > li > button.img04 {background:url(../images/sub/project_04.jpg) no-repeat center center;;} .prod_tit_wrap .list > li > button.img05 {background:url(../images/sub/project_05.jpg) no-repeat center center;;} .prod_search_btn {background:#002654; color:#fff; border:none; box-sizing:border-box; height:60px; display:inline-block; min-width:49px; max-width:100%; } .prod_search_btn2 {background:#002654; color:#fff; border:none; box-sizing:border-box; height:45px; display:inline-block; min-width:50px; max-width:100%; } .prod_wrap{ margin:-2em 0 0 -2em} .prod_wrap > li{ width:33.33%} .prod_wrap > li .in{ margin:2em 0 0 2em; border:1px solid #ddd; padding:2em 1em 3em 1em; text-align:center; cursor:pointer} .prod_wrap > li .in .img img{transform:scale(.9,.9); transition:.3s} .prod_wrap > li .in .tit{ font-size:1.5em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; padding:.5em 0} .prod_wrap > li .in .more{ position:relative; width:1.5em; height:1.5em; line-height:1.7em; margin:.5em 0} .prod_wrap > li .in .more:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; background:#f5f5f5; transform:rotate(45deg); transition:.3s} .prod_wrap > li .in .more:after{ content:"\e9c5"; position:relative} .prod_wrap > li .in .info > li{ margin-top:1em} .prod_wrap > li .in .info .t1{ float:left; text-align:right; width:47%; color:#000; font-size:.938em} .prod_wrap > li .in .info .t1:after{ content:" :"} .prod_wrap > li .in .info .t2{ float:right; text-align:left; width:47%; color:#777; font-size:.938em} .prod_wrap > li .in:hover .img img{transform:scale(1,1)} .prod_wrap > li .in:hover .more{ color:#ffcc00} .prod_wrap > li .in:hover .more:before{transform:rotate(135deg); background:#111; border-color:transparent;} .prod_view_top .tit_wrap{ background:#f1f1f1; border-top:2px solid #666; color:#111; padding:.8em 1.5em; font-size:1.625em; margin-bottom:1em; position:relative} .prod_view_top .tit_wrap:before{ content:""; position:absolute; left:0; top:50%; width:1em; height:1px; background:#666} .prod_view_top .img_wrap .small{ width:25%} .prod_view_top .img_wrap .small > li .in{ display:block; border:5px solid #003f87; margin-top:.5em; padding:1em; opacity:.3; transition:.3s} .prod_view_top .img_wrap .small > li:first-child .in{ margin-top:0} .prod_view_top .img_wrap .small > li.on .in{ opacity:1} .prod_view_top .img_wrap .big{ width:55%; padding-right:15%; margin-left:5%; position:relative} .prod_view_top .img_wrap .big .in{ padding:2em} .prod_view_top .img_wrap .big .btn{ position:absolute; left:0; bottom:0; width:100%; text-align:right} .prod_view_top .img_wrap .big .btn:before{ content:""; width:100%; height:1px; position: absolute; left:0; top:50%; background:#000} .prod_view_top .img_wrap .big .btn .more{ position:relative; display:inline-block; *display:inline; zoom:1; padding:0 3em; background:#000; line-height:4em; color:#ffcc00; margin-right:2em; transition:.3s} .prod_view_top .img_wrap .big .btn .more .xi{ font-size:1.625em} .prod_view_top .img_wrap .big .btn .more .tt{ font-size:1.25em; font-family:notokrR, sans-serif} .prod_view_top .img_wrap .big .btn .more:hover{ margin-right:0} .prod_view_middle{ background:#f5f5f5; padding:4em 0; margin-top:2em} /**/ .page_tit{ font-size:1.438em; margin-bottom:.7em} .page_tit:before{ content:""; display:block; width:1.5em; height:.1em; background:#003f87; margin-bottom:.5em} .page_sec{ margin-top:0.2em} /**/ .partner ul { overflow:hidden; margin:-40px 0 0 -20px; } .partner ul li { float:left; width:25%; } .partner ul li div { margin:40px 0 0 20px; cursor:pointer; } .partner ul li div .img { border:1px solid #ddd; padding:10px; box-sizing:border-box; display:table; width:100%; text-align:center;} .partner ul li div .img span { display:table-cell; vertical-align:middle; height:70px; } .partner ul li div .img img { max-height:58%; } .partner ul li div .ti {font-size:1.125em; text-align:center; padding:10px 0 0 0; color:#0072c6;} .partner ul li div .date {padding:15px 0 10px 0;} .partner ul li div .tx {border-bottom:1px dashed #ddd; padding:0 0 15px 0; height:50px; } .partner ul li div .in_tx {vertical-align:middle; font-size:.875em; color:#444; font-family:notokrM; width:140px; display:block;} .partner ul li div:hover .img, .partner ul li div:hover .ti { border-color:#002654; } /**/ .sub_history{ width:100%; margin:auto;} .sub_history .tit{ border-bottom:1px solid #e3e3e3; border-top:1px solid #ddd; padding:10px 20px; cursor:pointer; background-image:url(../images/sub/plus.png); background-repeat:no-repeat; background-position:center right 20px; } .sub_history:first-child .tit{ border-color:#ddd; background:#f9f9f9;} .sub_history .tit .t1{ vertical-align:bottom; font-size:1.6em; color:#333; letter-spacing:-2px; font-weight:500; } .sub_history .tit .t2{ vertical-align:bottom; font-size:1.2em; color:#676767; padding-left:5px} .sub_history .tit.on{ background-image:url(../images/sub/plus.png); } .sub_history .tit.on .t1, .sub_history .tit.on .t2{color:#111} .sub_history .con{border-bottom:1px solid #645d5d; padding:0 25px; display:none} .sub_history .con .history{ border-top:1px dashed #e3e3e3; padding:10px 10px} .sub_history .con .history:first-child{ border-top:none} .sub_history .con .history > li{margin-top:10px} .sub_history .con .history > li:first-child{margin-top:0} .sub_history .con .history > li > span{ display:inline-block; *display:inline; zoom:1; vertical-align:top} .sub_history .con .history > li .year{ width:40px; text-align:right; font-size:1.125em; font-family:notokrM; color:#0072c6; line-height:23px;} .sub_history .con .history > li .month{ width:40px; text-align:right; font-size:1em; font-family:notokrM; color:#888; line-height:23px;} .sub_history .con .history > li .day{ width:19px; text-align:right; font-size:1em; font-family:notokrM; color:#888; line-height:23px;} .history li span.month_1{ padding-left:117px; font-size:.875em;font-weight:600;color:#777; } .sub_history .con .history > li .tt{ width:80%; padding-left:20px; font-size:0.875em; color:#676767; line-height:23px; font-family:notokrR;} .sub_history .con .history > li .tt span.title1{ display:block;} .sub_history .con .history > li .tt span.title2{ display:block; background:url(../images/inc/dot_lnb_on.gif) no-repeat left 5px center; padding-left:15px;} .sub_history .con .history > li .tt span.title3{ display:block; background:url(../images/inc/dot_lnb_on.gif) no-repeat left 5px center; padding-left:15px;} .doc_history {background:url(../images/sub/history_bg.png)no-repeat right top;} .history_t_box .his_tit {font-family:"Times New Roman", Times, serif; font-size:2.5em; text-align:center; color:#777; margin-bottom:5px} /**/ .greetings_tt{ text-align:center; font-size:2em; letter-spacing:-1px; color:#0c83af; vertical-align:top;} .greetings_tt1 { text-align:center; font-size:1.1em; color:#333; margin-bottom:20px;} /*.greetings_txt { padding-top:40px; margin-left:15px; background:url(../images/sub/greetings.png) no-repeat 98% 60%;}*/ .greetings_txt {margin-top:3em;} .greetings_txt > li {float:left;} .greetings_txt > li.left {width:55%;} .greetings_txt > li.right {width:45%;} .greetings_txt > li.right .li_in {margin-left:5%;} .greetings_txt > li .li_in > p {font-size:1em; line-height:2;} .greetings_name {text-align:right; padding-top:3em; } .p_f1{color:#113777; vertical-align:top;} /*.greetings_txt p { width:650px; font-size:1em; line-height:28px; } .greetings_name { margin-top:60px; float:right; margin-right:13%; line-height:28px; color:#222; clear:both; width:50%; display:inline;} .greetings_name > img { vertical-align:middle; } .greetings_name .ceo_name{font-size:1.5em; display:inilne;} .p_f1{color:#113777; vertical-align:bottom;} */ /**/ .os_mac.root_daum_roughmap, .os_mac.root_daum_roughmap button, .os_mac.root_daum_roughmap input, .os_mac.root_daum_roughmap select, .os_mac.root_daum_roughmap td, .os_mac.root_daum_roughmap textarea, .os_mac.root_daum_roughmap th{ width:100% !important;} .table_st.st2.st3{border-top:3px solid #003f87 !important; margin-top:2em;} .bs1{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; padding:0 15px; font-size:0.875em; color:#fff; line-height:22px; border-radius:30px; background:#249f0b; margin-right:5px;} .sub_col {border-radius:30px; padding:0 15px; vertical-align:middle; color:#fff; font-family:notokrM; font-size:0.875em;} .bs1.sub_col1 {background:#fa5f2c} .bs1.sub_col2 {background:#606d00} .bs1.sub_col3 {background:#bf9f1e;} .bs1.sub_col4 {background:#3171d3;} .bs1.sub_col5 {background:#37b42d;} .subway_st {padding:10px 0;} /**/ /*.sub_tit.mg{margin-top:2em;} .sub_tit em.tit_txt{font-size:0.813em; color:#888; text-align:right; display:block; margin-top:-15px;padding-right:0.5em;} .graph_w{border:1px solid #ddd;} .graph_w ul{padding:30px 30px; overflow:hidden;} .graph_w ul li{float:left; padding:0 2em;} .graph_w dl dt{font-size:1.2em; margin-bottom:10px; } .graph_w em.tit_txt{font-size:0.813em; color:#888; text-align:right; display:block; margin-top:-15px; padding-right:0.5em; position:relative; right:0;} .graph_w img{border:1px solid #ddd; vertical-align:bottom;} .graph_w .mg{margin-top:2em;} */ /**/ .sub_tit.mg{margin-top:2em;} .sub_tit em.tit_txt{font-size:0.813em; color:#888; text-align:right; display:block; margin-top:-15px;padding-right:0.5em;} .graph_w{border:1px solid #ddd;} .graph_w ul{padding:30px 30px; overflow:hidden; margin-left:-10px;} .graph_w ul li{float:left; width:33.33%; /*padding:0 2em;*/} .graph_w ul li > dl {margin-left:10px;} .graph_w dl dt{font-size:1.2em; margin-bottom:10px; } .graph_w .tt {font-size:.875em;} .graph_w em.tit_txt{font-size:0.813em; color:#888; padding-top:20px; display:block; margin-top:-15px; padding-right:0.5em; position:relative; right:0; } .graph_w img{border:1px solid #ddd; vertical-align:bottom;} /*.graph_w .mg{margin-top:2em;}*/ /* .SEARCH_W {padding:20px 0; background:#f2f5f8ad;} .SEARCH_W.st {margin-bottom:40px;} .prod_search_wrap{ position:relative;} .prod_search_wrap .prod_search_tit{ position:absolute; right:0; top:0; width:170px; height:100%; background:#323b45; color:#fff; text-align:center; font-size:1.25em} .prod_search_wrap .prod_search_tit .xi{ display:block; font-size:1.5em; padding-bottom:5px} .prod_search_wrap .prod_search_con{} .prod_search_wrap .prod_search_con > li{ position:relative; padding-left:140px; display:inline-block; margin-bottom:3px;} .prod_search_wrap .prod_search_con > li.search_st {padding-left:0;} .prod_search_wrap .prod_search_con > li .con_tit{ position:absolute; left:0; top:0; width:130px; height:100%; background:#536373; color:#fff; font-size:.938em;} .prod_search_wrap .prod_search_con > li .con_tit:before{ content:""; position:absolute; left:0; top:0; width:100%; height:1px; background:rgba(255,255,255,.2)} .prod_search_wrap .prod_search_con > li .con_tit .xi{ font-size:1.063em; padding-right:2px; vertical-align:middle} .prod_search_wrap .prod_search_con > li .inp_wrap{ padding:10px; border:1px solid #ddd;} .prod_search_wrap .prod_search_con > li .inp_wrap .inp{ box-sizing: border-box; padding-top:5px; padding-bottom:5px; height:37px; border:1px solid #ddd; color:#666} .prod_search_wrap .prod_search_con > li .inp_wrap.wst1 {min-width:1016px;} .prod_search_wrap .prod_search_con > li .inp_wrap .inp.wst2 {min-width:194px;} .prod_search_wrap .prod_search_con > li .inp_wrap .inp.wst3 {min-width:397px;} .prod_search_wrap .prod_search_con > li .inp_wrap .inp.w1{ min-width:inherit} .prod_search_wrap .prod_search_con > li .inp_wrap input.inp{ padding-left:10px; padding-right:10px} .prod_search_wrap .prod_search_con > li .inp_wrap .inp.c1{ background:#003A6A; color:#fff; border:none} .prod_cate_wrap{ border:1px solid #ddd; padding:10px; background:#f5f5f5} .prod_cate_wrap .list > li{ width:11.1%} .prod_cate_wrap .list > li > button{ border:1px solid #ddd; margin:0 -1px -1px 0; background:#fff; text-align:center; height:50px; color:#777; letter-spacing:-1px; font-size:.750em; position:relative; width:100%;} .prod_cate_wrap .list > li:hover > button { color:#3399CC} .prod_cate_wrap .list > li.on > button{ background:#0072c6; color:#fff; border-color:#0072c6; z-index:1; box-shadow:1px 1px 3px rgba(0,0,0,.3)} .prod_list_wrap .list{ margin:0 -15px -15px 0} .prod_list_wrap .list > li{ width:25%} .prod_list_wrap .list > li * { transition:.3s} .prod_list_wrap .list > li .prod_st{ border:1px solid #ddd; margin:0 15px 15px 0} .prod_list_wrap .list > li .prod_st .img_wrap{ display:block; padding:10px; overflow:hidden} .prod_list_wrap .list > li .prod_st .con_wrap{ display:block; text-align:center; padding:10px 10px 20px 10px} .prod_list_wrap .list > li .prod_st .con_wrap .tit{ display:block; font-size:1.125em; color:#333; font-family:notokrB, sans-serif; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .prod_list_wrap .list > li .prod_st .con_wrap .t1{ display:block; font-size:.875em; color: #3399CC; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-top:5px} .prod_list_wrap .list > li .prod_st:hover{ box-shadow:1px 1px 3px rgba(0,0,0,.5)} .prod_list_wrap .list > li .prod_st:hover .img_wrap img{ transform:scale(1.1,1.1)} .prod_search_btn {background:#002654; color:#fff; border:none; box-sizing:border-box; height:45px; min-width:48px; max-width:100%;}*/ /*실적 검색탭 .in_search {text-align:right;} .in_search .li_in {display:inline-block; padding:10px 30px; border-radius:29px; background:#002654; cursor:pointer;} .in_search .li_in .xi {padding-right:5px; font-size:17px; vertical-align:bottom; color:#fff;} .in_search .li_in .ti {font-size:1em; color:#fff; font-family:notokrM;}*/ /**/ .TAB_WRAP {position:relative; text-align:center; margin-bottom:30px;} .TAB_WRAP .his_bg { background:#f6f6f6; height:200px; position:absolute; left:0; top:0; width:100%; background-size:cover;} .TAB_WRAP .tab_ul {/*overflow:hidden;*/ position:relative; display:inline-block;} .TAB_WRAP .tab_ul li {float:left; position:relative; } .TAB_WRAP .tab_ul li > a {display:block; text-align:center; transition:.3s; margin:0 0 0 -1px; border:1px solid #ccc; font-size:1em; padding:1em 2em; } .TAB_WRAP.organiziation_st .tab_ul li > a {padding:1em 2em;} .TAB_WRAP.st2 .tab_ul li > a {/*padding:5px 30px;*/} /*.TAB_WRAP .tab_ul li > .tab_dot { background:#0065A4; width:10px; height:10px; border-radius:100%; left:50%; margin-left:-5%; bottom:-5px; position:absolute; cursor:pointer;} .TAB_WRAP .tab_ul li.on > .tab_dot:after{ content:""; position:absolute; top:-4px; bottom:-4px; left:-4px; right:-4px; border:1px solid #0065A4; border-radius:100%;}*/ .TAB_WRAP .tab_ul li.on > a {color:#fff; background:#999; border-color:transparent;} .TAB_WRAP .tab_ul li.on > a:after{ opacity:1; content:"\e935"; font-family:xeicon; font-style:normal; font-size:16px; color:#999; width:100%; position:absolute; text-align:center; bottom:-14px; left:0;} /**/ .oraganization_w {text-align:center; padding-top:50px;} /**/ .fee_plus{float:left; width:100%; } .fee_plus .tab_wrap{ position:relative; /*margin-bottom:30px; margin-top:1em;*/} .fee_plus .tab_wrap .line{ position:absolute; left:0; bottom:-50px; width:100%; height:1px; background:#ddd;} .fee_plus .tab{ text-align:center; padding-left:1px; padding-bottom:1px;} .fee_plus .tab > li{ margin-bottom:30px; letter-spacing:-0.4px;} .fee_plus .tab:after{content:""; clear:both;} .fee_plus .tab > li > a{ position:relative; z-index:101; display:block; border:1px solid #ccc; padding:1em 2em; margin-left:-1px; position:relative; text-align:center;} .fee_plus .tab > li > a .tt{ display:block; font-size:1em; color:#666; font-weight:700} /*.fee_plus .tab > li:hover > a,*/ .fee_plus .tab > li.on > a{z-index:10;background:#999;color:#fff;border-color:transparent;text-align:center;position:relative;border: 1px solid #ccc;} .fee_plus .tab > li.on > a:after{ opacity:1; content:"\e935"; font-family:xeicon; font-style:normal; font-size:16px; color:#999; width:100%; position:absolute; text-align:center; bottom:-14px; left:0; z-index:100001;} /*.fee_plus .tab > li:hover > a:before, .fee_plus .tab > li.on > a:before{ content:""; position:absolute; left:-1px; right:-1px; top:-1px; height:3px; background:#002654; } .fee_plus .tab > li:hover > a:after, .fee_plus .tab > li.on > a:after{ content:""; position:absolute; left:0; bottom:-1px; width:100%; height:1px; background:#fff} */.fee_plus .tab > li:hover .tt, .fee_plus .tab > li.on .tt{ color:#111;} .border_w{/*border-left:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding-bottom:1em;padding:1em 1em; */ margin-top:2em;} .table_st.st2{ margin-bottom:40px;} /*.fee_plus .tab > li.tab_none > a{visibility:hidden;}*/ /*.aboutteam_in:before {position:absolute; content:""; left:0; top:-22px; width:25px; height:25px; transform: rotate(0deg); background:rgba(0,38,84,.7);} .aboutteam_in:after {position:absolute; content:""; right:0; bottom:-22px; width:25px; height:25px; transform:rotate(0deg); background:rgba(0,38,84,.7);}*/ /* .aboutteam_w {border:1px solid #ddd; margin-top:30px; overflow:hidden;} .aboutteam_w:first-child {margin-top:50px;} .aboutteam_in {padding:40px 20px 40px 20px; position:relative;} .aboutteam_in .aboutteam_t {width:70%; float:left;} .aboutteam_in .aboutteam_i {width:30%; float:right;} .aboutteam_in .aboutteam_t .aboutteam_t_in {margin-right:20px;} .aboutteam_in .aboutteam_t .aboutteam_t_in dt {font-size:1.375em; font-family:notokrM,sans-serif; color:#0072c6;} .aboutteam_in .aboutteam_t .aboutteam_t_in dt:after {content:''; display:block; width:15%; height:2px; background:linear-gradient(to right, #0c61b5, rgba(255,255,255,0)); margin:15px 0 20px 0;} .aboutteam_in .aboutteam_t .aboutteam_t_in dd {padding-left:10px;} .aboutteam_in .aboutteam_t .aboutteam_t_in dd.st {padding-top:12px;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt {font-size:.938em; width:95%; line-height:1.7; color:#444; font-family:notokrR; padding:15px 20px; background:#f5f5f5; letter-spacing:0.2px;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt.pd_st {margin-top:51px;} .aboutteam_in .aboutteam_t .aboutteam_t_in .tit {font-size:1.250em; padding:16px 0 10px 0;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt .txt2 {margin-top:20px; display:block; color:#0072c6 !important;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt .in_txw {padding-left:1em; display:block;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt .in_txw > span {display:block;} .aboutteam_in .aboutteam_i.pd_img01 {padding-top:0;} .aboutteam_in .aboutteam_i.pd_img02 {padding-top:112px;} .aboutteam_in .aboutteam_i.pd_img03 {padding-top:113px;} .aboutteam_in .aboutteam_i.pd_img04 {padding-top:320px;} .aboutteam_in .aboutteam_i.pd_img05 {padding-top:270px;} .aboutteam_in .aboutteam_i.pd_img09 {padding-top:127px;}*/ /**/ .aboutteam_w {border:1px solid #ddd; margin-top:30px; overflow:hidden;} .aboutteam_w:first-child {margin-top:50px;} .aboutteam_in {padding:40px 30px; position:relative;} /*.aboutteam_in:before {position:absolute; content:""; left:0; top:-22px; width:25px; height:25px; transform: rotate(0deg); background:rgba(0,38,84,.7);} .aboutteam_in:after {position:absolute; content:""; right:0; bottom:-22px; width:25px; height:25px; transform:rotate(0deg); background:rgba(0,38,84,.7);} */.aboutteam_in .aboutteam_t {width:70%; float:left;} .aboutteam_in .aboutteam_i {width:30%; float:right; margin-top:62px;} .aboutteam_in .aboutteam_t .aboutteam_t_in {margin-right:20px;} .aboutteam_in .aboutteam_t .aboutteam_t_in .dt_top_p{font-size:1em; color:#999; font-family:notokrL;} .aboutteam_in .aboutteam_t .aboutteam_t_in dd{ } .aboutteam_in .aboutteam_t .aboutteam_t_in dt {font-size:1.5em; font-family:notokrM,sans-serif; color:#0072c6; margin-bottom:15px; } .aboutteam_in .aboutteam_t .aboutteam_t_in .txt {font-size:.938em; line-height:1.5; color:#444; font-family:notokrR; letter-spacing:0.2px;} .aboutteam_in .aboutteam_t .aboutteam_t_in .tit {font-size:1.250em; padding-bottom:8px;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt .txt2 {margin-top:20px; display:block; color:#0072c6 !important;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt .in_txw {padding-left:1em; display:block;} .aboutteam_in .aboutteam_t .aboutteam_t_in .txt .in_txw > span {display:block;} /**/ .history_area{ position:relative;} .history_area .history_lst{ margin-left:190px; } .history_area .history_lst .list{ *zoom:1; padding:30px 0; border-bottom:1px solid #ccc;} .history_area .history_lst .list:after{ content:""; display:block; clear:both;} .history_area .history_lst .list:first-child{ margin-top:0;} .history_area .history_lst .list dt{ float:left; width:125px; margin:0 0 0 -145px; text-align:right; position:relative} .history_area .history_lst .list dt span{ display:inline-block; *display:inline; zoom:1; letter-spacing:-1px;} .history_area .history_lst .list dt .year {font-size:2.7em; color:#6b7f98; margin:-5px 10px 0 0; font-family:notokrB;} .history_area .history_lst .list dd{ font-size:16px; margin-left:-10px; padding:5px 0 5px 40px; line-height:24px;} .history_area .history_lst .list dd.first { margin-left:-10px; padding:5px 0 5px 40px; line-height:21px;font-size: 1em;} .history_area .history_lst .list dd strong { color:#888; padding-right:10px; font-size:14px; min-width: 35px; display: inline-block;} /**/ .p_link_w{ } .p_link_w .bn{ margin:-15px 0 0 -15px; overflow:hidden;} .p_link_w .bn > li{ float:left; width:50%; } .p_link_w .bn.sec1{ margin-top:0;} .p_link_w .bn.sec1 > li{ width:100%;} .p_link_w .bn.sec2 > li{ width:50%;} .p_link_w .bn.sec3 > li{ width:33.33%; margin-top:15px;} .p_link_w .bn > li .inner { margin:15px 0 0 15px; cursor:pointer; cursor:pointer; position:relative; background-repeat:no-repeat; background-position:left top; transition:.4s; } .p_link_w .bn > li .over_tit{ position:absolute; z-index:1; top:0; left:0; width:100%; height:70%; text-align:center; transition:.4s; } .p_link_w .bn > li .over_tit .in_t{ font-size:1.8em; color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.3); position:relative;} .p_link_w .bn > li .over_tit:before{ position:absolute; content:''; top:70%; left:0; width:100%; height:2px; background:rgba(255,255,255,0.6); z-index:1;} .p_link_w .bn > li .over_tit:after{ position:absolute; content:''; top:70%; left:50%; margin-left:-100px; width:200px; height:2px; background:#187aef; z-index:1;} .p_link_w .bn > li .bg { position:absolute; z-index:inherit; top:0; left:0; width:100%; height:100%; background:#000; filter:alpha(opacity=30); opacity:0.3; transition:.4s;} .p_link_w .bn > li .tt { position:absolute; z-index:inherit; top:0; left:0; width:100%; height:360px; text-align:center; transition:.4s;} .p_link_w .bn > li .tt1 { display:block;} .p_link_w .bn > li .tt2 { box-sizing:border-box; padding:30px 50px 50px 30px; filter:alpha(opacity=0); opacity:0; top:20px; text-align:left; } .p_link_w .bn > li .tt2 .title { font-size:1.750em; color:#fff; letter-spacing:-0.5px; display:block; margin-bottom:20px; } .p_link_w .bn > li .tt2 .txt { font-size:0.938em; color:#fff; line-height:1.4; height:85px; display:block; overflow:hidden; } .p_link_w .bn > li .tt2 .arr { display:block; font-size:10px; color:#fff; width:55px; height:17px; background:url(../images/sub/more_arr.png) no-repeat bottom; margin-top:30px; } .p_link_w .bn > li:hover { background-position:right top;} .p_link_w .bn > li:hover .over_tit{ filter:alpha(opacity=0);opacity:0; top:-30px;} .p_link_w .bn > li:hover .bg { background:#187aef; filter:alpha(opacity=80); opacity:0.8;} .p_link_w .bn > li:hover .tt2 { filter:alpha(opacity=100);opacity:1; top:-10px;} .p_link_w .bn > li .over_tit2{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; text-align:center; transition:.4s; } .p_link_w .bn > li .over_tit2 .in_t{ font-size:1.5em; color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.3); position:relative;} .p_link_w .bn > li:hover .over_tit2{ filter:alpha(opacity=0);opacity:0; top:-30px;} .p_link_w .bn > li .tt3 { display:block;} .p_link_w .bn > li .tt4 { box-sizing:border-box; padding:50px 20px 40px 30px; filter:alpha(opacity=0); opacity:0; top:50px; text-align:left; } .p_link_w .bn > li .tt4 .title { font-size:1.5em; color:#fff; letter-spacing:-0.5px; display:block; margin-bottom:20px; } .p_link_w .bn > li .tt4 .txt { font-size:0.938em; color:#fff; line-height:1.4; height:85px; display:block; overflow:hidden; } .p_link_w .bn > li .tt4 .arr { display:block; font-size:10px; color:#fff; width:55px; height:17px; background:url(../images/sub/more_arr.png) no-repeat bottom; margin-top:20px; } .p_link_w .bn > li:hover .tt4 { filter:alpha(opacity=100);opacity:1; top:-10px;} /*시공현황*/ .overview_con1 {overflow:hidden;} .overview_con1 > li {margin-bottom:1em; float:left; width:33.33%;} .tit_line {display:inline-block; vertical-align:baseline; width:3px; height:1em; background:#003f87;; margin-right:5px; } .tit01 {padding-top:2em; padding-bottom:1em; font-size:.938em; font-family:notokrM; color:#003f87; display:inline-block} .tit01 .tit_txt {color:#555; font-family:notokrR; font-size:.750em; vertical-align:middle; display:block;} /*기술자현황*/ .enging_con {overflow:hidden;} .enging_con .enging_w {float:left; width:50%; display:inline;}