/*-------------------------layout_02.css------------------------------------*/ @charset "utf-8"; /* 2015-10-05 CSS CENTUMSOFT */ #doc-wrap {position:relative;min-width:1200px;overflow:hidden;} .div-cont {position:relative;max-width:1200px;margin:0 auto;} @media all and (max-width:1200px){ #doc-wrap {min-width:320px} .div-cont {margin:0 30px;} } @media all and (max-width:680px){ .div-cont {margin:0 15px;} } @media all and (max-width:420px){ .div-cont {margin:0 10px;} } /* ìŠ¤í‚µë„¤ë¹„ê²Œì´ì ˜ */ #skipNavi {height:0;} #skipNavi .skipLink {position:absolute;top:-1000px;left:-1000px;overflow:hidden;z-index:5000;} #skipNavi .skipLink:focus, #skipNavi .skipLink:active {top:0;left:0;padding:10px 20px;background:#1e64ba;color:#fff;} /* 레이아웃 */ #mcontainer-wrap {position:relative;width:100%;} #container {position:relative;max-width:1200px;margin:0 auto;} #container:after {content:'';clear:both;display:block;} /* svisual */ #svisual-wrap {position:relative;width:100%;height:210px;overflow:hidden;} #svisual-wrap #visImgWrap {width:100%;position:relative} #svisual-wrap #visImgWrap #visImg {position:relative;height:315px;overflow:hidden;} #svisual-wrap #visImgWrap #visImg .vis-img {display:block;width:2000px;height:auto;position:absolute;top:0;left:50%;margin-left:-1000px} #svisual-wrap .lm-tit {position:absolute;left:0;top:90px;width:100%;text-align:center;display:none;} #svisual-wrap .lm-tit span {display:block;color:#fff;text-shadow:0 0 5px rgba(0, 0, 0, .5)} #svisual-wrap .lm-tit .tit {font-size:46px;letter-spacing:-.025em;line-height:1.1;font-weight:500;transform:translateY(30px);opacity:0;transition:all .3s ease} #svisual-wrap .lm-tit .txt {font-size:18px;font-weight:300;line-height:1.3;margin:14px 0 0;transform:translateY(30px);opacity:0;transition:all .3s ease .15s} body.loaded #svisual-wrap .lm-tit .tit, body.loaded #svisual-wrap .lm-tit .txt {transform:translateY(0px);opacity:1} @media only screen and (min-width:1000px){ #svisual-wrap #visImgWrap #visImg .vis-img {-webkit-animation:bgScale 3000ms 1 ease-out; -o-animation:bgScale 3000ms 1 ease-out; animation:bgScale 3000ms 1 ease-out;-webkit-transform:scale(1); -o-transform:scale(1); transform:scale(1);} } @media all and (max-width:999px) { #svisual-wrap {height:220px;} #svisual-wrap #visImgWrap #visImg {height:220px;} #svisual-wrap #visImgWrap #visImg .vis-img {width:auto;height:100%;margin:0 0 0 -758px} #svisual-wrap .lm-tit {top:55px;} #svisual-wrap .lm-tit .tit {font-size:30px;} #svisual-wrap .lm-tit .txt {font-size:14px;margin-top:10px;} } @media all and (max-width:768px) { #svisual-wrap {height:150px;} #svisual-wrap #visImgWrap #visImg {height:150px;} #svisual-wrap #visImgWrap #visImg .vis-img {margin-left:-476px} #svisual-wrap .lm-tit {display:none;} } /* 서브비쥬얼 animate */ @-webkit-keyframes bgScale { 0% {-webkit-transform:scale(1.1);} 100% {-webkit-transform:scale(1);} } @-o-keyframes bgScale { 0% {-o-transform:scale(1.1);} 100% {-o-transform:scale(1);} } @keyframes bgScale { 0% {transform:scale(1.1);} 100% {transform:scale(1) rotate(0.02deg);} } /* contents */ @media only screen and (min-width:1200px) { #contents {float:right;max-width:880px;width:100%;} } #contents {margin-top:40px;min-height:600px;/* word-break:keep-all;word-wrap:break-word; */} #contents .cont-top {position:relative;overflow:hidden;padding-bottom:35px;margin-bottom:30px;border-bottom:1px solid #e7e7e7;} #contents .cont-top .cont-tit {float:left;font-size:36px;color:#000;font-weight:500;letter-spacing:-0.02em;} #cont-navi {float:right;} #cont-navi .navi-menu {display:inline-block;vertical-align:top;font-size:0;margin-top:10px;} #cont-navi .navi-menu li {float:left;margin-right:8px;padding-right:13px;position:relative;} #cont-navi .navi-menu li:before {content:"";position:absolute;top:4px;right:0;width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-right:5px solid none;border-left:5px solid rgba(0,0,0,.6);} #cont-navi .navi-menu li:last-child:before {display:none;} #cont-navi .navi-menu li a {font-size:14px;color:#555;} #cont-navi .navi-menu li.home a {display:block;width:15px;height:13px;background:url(/resources/_Templet/Layout/layout_02/_Img/ico_home.png) no-repeat 0 0;} #cont-navi .btn-print {width:37px;height:37px;border-radius:37px;border:0;background:url(/resources/_Templet/Layout/layout_02/_Img/ico_navi.png) no-repeat -40px 0;} #contents #cont {padding:0 0 80px 0;font-size:16px;line-height:1.6;word-break:break-all;min-height:600px} #contents #cont:after {clear:both;content:"";display:block;} #contents #cont .cont-charge {position:relative;overflow:hidden;font-size:15px;padding:15px 20px;min-height:30px;border-top:1px solid #e1e1e1;border-bottom:1px solid #e1e1e1;} #contents #cont .cont-charge .txt {display:block;position:relative;height:45px;color:#1c5a96;font-weight:500;line-height:45px;padding:0 0 0 54px} #contents #cont .cont-charge .txt:before {content:"";display:block;position:absolute;width:45px;height:45px;background:url(/resources/_Img/Common/pg_charge_sprite.png) no-repeat 0 0;top:0;left:0} #contents #cont .charge-list {position:relative;font-size:0;padding-left:45px;background:url(/resources/_Templet/Layout/layout_01/_Img/charge_name.gif) no-repeat 0 0;} #contents #cont .charge-list li {position:relative;display:inline-block;padding:8px 5px 8px 15px;color:#666;font-size:15px;margin-right:25px;line-height:1;font-weight:300;} #contents #cont .charge-list li:last-child {margin-right:0;} #contents #cont .charge-list li:before {content:'';position:absolute;left:0;top:15px;width:5px;height:2px;background:#666;} #contents #cont .charge-list li em {font-style:normal;color:#333;font-weight:500;margin-right:5px;} #contents #cont .charge-list li.mail {display:none} #contents #cont .cont-charge .update {position:absolute;right:20px;bottom:20px;display:none;} #contents #cont .cont-charge .update b {font-weight:500;color:#333;margin-right:5px;} @media all and (max-width:999px){ #contents {width:auto;max-width:100%;float:none} #contents #cont {font-size:15px} #header-wrap {height:auto} } @media all and (max-width:768px){ #cont-navi {display:none} #container {margin-top:0} #contents {margin-top:0;} #contents #cont {padding-bottom:40px} #contents .cont-top {padding:20px 0;margin-bottom:0;border:0} #contents .cont-top .cont-tit {font-size:22px;position:relative} } @media all and (max-width:599px){ #contents #cont {padding-bottom:30px} #contents #cont .cont-charge {padding:10px 15px;} #contents #cont .charge-list {padding-left:40px;background-size:auto 26px} #contents #cont .charge-list li {font-size:14px;padding:6px 5px 6px 15px;} #contents #cont .charge-list li:before {top:13px;} #contents #cont .cont-charge .update {position:relative;right:auto;bottom:auto;margin-left:35px;font-size:14px;margin-top:5px;} } /*-------------------------gnavi_eng.css------------------------------------*/ /* global */ #global {position:relative;width:100%;height:45px;background:#002a51;z-index:2100;} #global .glnk-sec {position:absolute;left:0;top:0;z-index:1;} #global .glnk-sec a, #global .glnk-sec button {float:left;font-size:14px;color:#fff;text-align:center;height:45px;padding:0 10px 0 20px;background:#b3005b;border:0} #global .glnk-sec a span, #global .glnk-sec button span {position:relative;display:inline-block;color:#fff;padding-right:35px;margin-top:14px;} #global .glnk-sec button span {margin-top:0;} #global .glnk-sec a span:after, #global .glnk-sec button span:after {content:'';position:absolute;right:0;top:-2px;width:20px;height:20px;border-radius:50%;background-color:rgba(0,0,0,.3);background-image:url(/resources/homepage/kor/_Img/Layout/layout_spr.png);background-position:0 0} #global .glnk-sec button span:after {top:0;} #global .glnk-sec .btn01 span:after, #global .glnk-sec .btn02 span:after {background-position:-22px 0} #global .glnk-sec .btn01 {background:#0092cf;display:none;} #global .glnk-sec .btn02 {background:#003f8c;display:none;} #global .srvc-lnk {position:absolute;right:0;top:0;z-index:1;} #global .srvc-lnk a {float:left;font-size:14px;color:#fff;padding:2px;margin:0 15px;position:relative;margin-top:12px;opacity:1;} #global .srvc-lnk a:before {content:'';position:absolute;left:-14px;top:3px;width:1px;height:12px;background:#fff;opacity:.3;} #global .srvc-lnk a:first-child:before {display:none;} #global .srvc-lnk a:hover, #global .srvc-lnk a:focus, #global .srvc-lnk a:active {text-decoration:underline} #global .toppop-ctrl {float:left;position:relative;height:45px;border-right:1px solid rgba(255,255,255,.2);border-left:1px solid rgba(255,255,255,.2)} /* .isSub #global .toppop-ctrl {display:none;} */ #global .toppop-ctrl button {border:0;text-align:center;background:transparent;padding:11px 15px;border-radius:0;vertical-align:middle} #global .toppop-ctrl button span {display:inline-block;font-size:14px;color:#fff;position:relative;padding:0 0 0 30px;opacity:1;} #global .toppop-ctrl button span:before {content:'';position:absolute;left:0;top:-2px;width:24px;height:24px;border-radius:50%;background:#003f8c url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -44px 0;} @media all and (max-width:1200px){ #global .global-wrap {margin:0;} #global .toppop-ctrl {border-right:0} } @media all and (max-width:999px){ #global .glnk-sec {position:relative;top:auto;left:auto;right:auto;bottom:auto;overflow:hidden} #global .srvc-lnk a {display:none} #global .srvc-lnk {position:absolute;top:0;right:0} #global .toppop-ctrl {float:none;margin-left:0;height:45px;} } @media all and (max-width:640px){ #global {height:40px} #global .glnk-sec a, #global .glnk-sec button {height:40px;box-sizing:border-box;font-size:12px;} #global .glnk-sec a span, #global .glnk-sec button span {margin-top:12px;padding-right:25px;} #global .toppop-ctrl {height:40px;} #global .toppop-ctrl button {padding:9px 15px;} #global .toppop-ctrl button span {font-size:13px;} } #header-wrap .gnavi-panel {position:absolute;left:0;top:45px;width:100%;height:auto;z-index:9999;} #header-wrap .gnavi-panel .btit {position:relative;padding-left:65px;font-size:30px;color:#fff;line-height:50px;margin-bottom:45px;font-weight:400;} #header-wrap .gnavi-panel .btit:before {content:'';position:absolute;left:0;top:0;width:46px;height:46px;border:2px solid #fff;border-radius:50%;background-repeat:no-repeat;background-position:50% 50%;} #header-wrap .gnavi-panel .div-cont {padding:35px 0 50px 0;} #header-wrap .hakgwa-wr {background:#0092cf;display:none;overflow:hidden;} #header-wrap .hakgwa-wr .btit:before {background-image:url(/resources/_Templet/Gnavi/gnavi_01/_Img/site_ico01.png)} #header-wrap .hakgwa-wr .lnk-list {overflow:hidden;border-left:1px solid #42b4e3;border-top:1px solid #42b4e3;} #header-wrap .hakgwa-wr .lnk-list li {float:left;width:14.28%;} #header-wrap .hakgwa-wr .lnk-list li a {display:block;border-right:1px solid #42b4e3;border-bottom:1px solid #42b4e3;font-size:17px;color:#fff;text-align:center;padding:25px 5px;transition:all .3s ease} #header-wrap .hakgwa-wr .lnk-list li a:hover {background:#fff;color:#003f8c;} #header-wrap .ginuehp-wr {background:#003f8c;display:none;overflow:hidden;} #header-wrap .ginuehp-wr .btit:before {background-image:url(/resources/_Templet/Gnavi/gnavi_01/_Img/site_ico02.png)} #header-wrap .ginuehp-wr .lnk-list {overflow:hidden;border-left:1px solid rgba(191,191,191,.3);} #header-wrap .ginuehp-wr .lnk-list li {float:left;width:20%;border-right:1px solid rgba(191,191,191,.3);margin-left:-1px;} #header-wrap .ginuehp-wr .lnk-list li a {position:relative;display:block;font-size:16px;color:#9aaec7;padding:5px 0;margin:5px 20px;transition:all .3s ease} #header-wrap .ginuehp-wr .lnk-list li a:after {content:'';position:absolute;right:0;top:50%;width:8px;height:12px;margin-top:-6px;background:url(/resources/_Templet/Gnavi/gnavi_01/_Img/gnavi_arr.png) no-repeat 0 0;opacity:0;transition:all .3s ease} #header-wrap .ginuehp-wr .lnk-list li a span {position:relative;display:inline-block;} #header-wrap .ginuehp-wr .lnk-list li a span:after {content:'';position:absolute;left:0;bottom:-6px;width:100%;height:1px;background:#fff;opacity:0;transition:all .3s ease} #header-wrap .ginuehp-wr .lnk-list li a:hover {color:#fff;} #header-wrap .ginuehp-wr .lnk-list li a:hover span:after, #header-wrap .ginuehp-wr .lnk-list li a:hover:after {opacity:1;} /*-------------------------logo_01.css------------------------------------*/ /* logo */ #header .logo {position:absolute;left:0;top:18px;} #header .logo a, #header .logo a span {display:block} #header .logo a img {max-height:52px} #header .logo a span em {display:none;font-size:21px;font-style:normal;margin-left:7px;padding-bottom:5px;margin-bottom:3px;letter-spacing:-0.05em;vertical-align:bottom} @media all and (max-width:1200px){ #header .logo {left:20px} } @media all and (max-width:999px){ #header .logo {padding:12px 0;top:1px;} #header .logo a img {width:auto;max-height:38px} #header .logo a span em {font-size:18px} } @media all and (max-width:640px){ #header .logo {left:10px;} } /*-------------------------header_eng.css------------------------------------*/ /* header */ #header-wrap {position:relative;width:100%;height:135px;} #header {position:relative;max-width:1200px;margin:0 auto;z-index:1000;} #menu-wrap .srch-btn {position:absolute;right:10px;top:25px;border:0;background:#fff;border-bottom:2px solid #57c928;z-index:1000;} .isMain #menu-wrap .srch-btn {right:110px;} #menu-wrap .srch-btn span {display:inline-block;font-size:14px;color:#53b02c;line-height:1;padding:10px 0 10px 22px;background:url(/resources/_Img/Templet/Layout/srch_ico.png) no-repeat 0 center;} #menu-wrap .srch-btn.is-open span {background:url(/resources/_Img/Templet/Layout/srch_close.gif) no-repeat 0 center;} @media only screen and (max-width:999px){ #header-wrap {height:110px;} } @media only screen and (max-width:640px){ #header-wrap {height:105px;} } /* 메인 */ /* 1단 ìƒë‹¨íŒì— */ #toppop {position:relative;width:100%;height:0;overflow:hidden;background:#1b2335;} .popups {position:relative;overflow:hidden;height:0px;z-index:2000;width:1000px;margin:0 auto;} .toppop .wpop-list {overflow:hidden;padding:136px 0 0 20px;} .toppop .wpop-list li {float:left;width:50%;} .popups .wpcont {position:absolute;top:0;left:0;width:500px;height:160px;overflow:hidden;} .popups .wpcont img {width:auto;height:160px;display:block;} .wpop-cont .comm {display:none;} /* ë©€í‹°íŒì— */ .top-wide-popups {position:relative;width:100%;height:0;overflow:hidden;z-index:4000;background:url(/resources/_Img/Common/twidepop_bg.gif) no-repeat center top;background-size:cover} .top-wide-popups * {color:#fff} .top-wide-popups .tpop-topwide {position:relative;margin:0 auto;max-width:1200px;padding:15px 0 40px 0;} .top-wide-popups .tpop-topwide .tpop-dir-wrap{display:block;position:absolute;width:100%;height:0;left:0;top:50%;z-index:11} .top-wide-popups .tpop-topwide .tpop-dir-wrap button{display:block;position:absolute;width:48px;height:48px;top:50%;margin:-24px 0 0 0;border:0;background:url(/resources/_Img/Common/toppop_sprite2.png) no-repeat} .top-wide-popups .tpop-topwide .tpop-dir-wrap .btn-prev{background-position:0px 0px;left:0} .top-wide-popups .tpop-topwide .tpop-dir-wrap .btn-next{background-position:-50px 0px;right:0} .top-wide-popups .tpop-topwide .tpop-list-wrap {position:relative;max-width:1200px;height:100px;margin:0 auto;overflow:hidden} .top-wide-popups .tpop-topwide .tpop-list-wrap .wpop-item {position:absolute;overflow:hidden;} .top-wide-popups .tpop-topwide .tpop-list-wrap .wpop-item.first {left:0;} .top-wide-popups .tpop-topwide .tpop-list-wrap .wpop-item .wpop-cont, .wpop-cont > div {position:relative;display:block;height:100%;margin-left:auto;margin-right:auto;overflow:hidden} .top-wide-popups .tpop-topwide .tpop-list-wrap .wpop-item .wpop-cont a {display:block;height:100%;text-align:center;} .top-wide-popups .tpop-topwide .tpop-list-wrap .wpop-item .wpop-cont img {max-width:100%;max-height:100%;} .top-wide-popups .tpop-topwide button {border:0;cursor:pointer;} .top-wide-popups .tpop-topwide .wpop-ctrl-btns {position:absolute;bottom:10px;left:10px;z-index:300} .top-wide-popups .tpop-topwide .wpop-ctrl-btns button {display:inline-block;border:0;width:6px;height:8px;background:url(/resources/_Img/Common/toppop_sprite2.png) no-repeat;overflow:hidden;vertical-align:top;} .top-wide-popups .tpop-topwide .wpop-ctrl-btns button.btn-stop {background-position:-107px 0px} .top-wide-popups .tpop-topwide .wpop-ctrl-btns button.btn-play {background-position:-100px 0px} .top-wide-popups .tpop-topwide .wpop-ctrl-btns .nicons {display:inline-block;} .top-wide-popups .tpop-topwide .wpop-ctrl-btns .nicons button {display:inline-block;position:relative;width:7px;height:7px;padding:0;border:0;margin-right:5px;background:none} .top-wide-popups .tpop-topwide .wpop-ctrl-btns .nicons button:after{content:"";display:block;width:7px;height:7px;background:url(/resources/_Img/Common/toppop_sprite2.png) no-repeat -100px -10px} .top-wide-popups .tpop-topwide .wpop-ctrl-btns .nicons button span {width:1px;height:1px;overflow:hidden;position:absolute;top:-1000em} .top-wide-popups .tpop-topwide .wpop-ctrl-btns .nicons button.over:after, .top-wide-popups .tpop-topwide .wpop-ctrl-btns .nicons button.is-over:after {background-position:-109px -10px} .top-wide-popups .tpop-topwide .close-btns {position:absolute;right:10px;bottom:10px;z-index:10;font-size:0} .top-wide-popups .tpop-topwide .close-btns * {vertical-align:middle} .top-wide-popups .tpop-topwide .close-btns input {display:inline-block;padding:0;margin:0;width:auto;height:auto;vertical-align:middle} .top-wide-popups .tpop-topwide .close-btns label {display:inline-block;margin-left:7px;margin-right:8px;font-size:13px;vertical-align:middle} .top-wide-popups .tpop-topwide .close-btns button {display:inline-block;position:relative;width:22px;height:22px;background-color:#2d2d2d;border-radius:50%;vertical-align:middle} .top-wide-popups .tpop-topwide .close-btns button:after{content:"";display:block;position:absolute;width:10px;height:10px;top:50%;left:50%;margin:-5px 0 0 -5px;background:url(/resources/_Img/Common/toppop_sprite2.png) no-repeat -100px -19px} @media only screen and (max-width:1200px){ .top-wide-popups .tpop-topwide {width:auto;margin:0 20px} } @media only screen and (max-width:799px){ .top-wide-popups .tpop-topwide .tpop-list-wrap {height:146px;} .top-wide-popups .tpop-topwide .wpop-ctrl-btns {bottom:auto;top:15px} .top-wide-popups .tpop-topwide .close-btns {top:auto;bottom:10px} } @media only screen and (max-width:699px){ .top-wide-popups .tpop-topwide .tpop-list-wrap {height:130px;} } @media only screen and (max-width:480px){ .top-wide-popups .tpop-topwide .tpop-dir-wrap button {width:11px;height:27px;top:50%;margin:-13.5px 0 0 0;background:url(/resources/_Img/Common/toppop_sprite2.png) no-repeat;background-size:cover} .top-wide-popups .tpop-topwide .tpop-dir-wrap .btn-prev {background-position:0px 0px;left:10px} .top-wide-popups .tpop-topwide .tpop-dir-wrap .btn-next {background-position:-11px 0px;right:10px} .top-wide-popups .tpop-topwide .tpop-list-wrap {height:90px;} } /* 메뉴 */ #menu-wrap {position:relative;width:1200px;margin:0 auto;z-index:100} #menu-wrap:after {clear:both;display:block;content:"";} #menu-wrap .menu-cont {width:76%;padding-left:24%;} #mn-ctrs-btns {display:none;} #mainNavi .depth2-hTit {display:none;} @media all and (max-width:1200px){ #menu-wrap {width:100%;} } /* 주메뉴 */ @media all and (min-width:1000px){ #menu-wrap .mn-top, #menu-wrap .mem-btn, #menu-wrap .btn-close, #menu-wrap .tmn-box, #menu-wrap .tmn-global {display:none;} #mainNavi-wrap {position:absolute;left:0;top:45px;width:100%;height:90px;background:#fff;z-index:500;overflow:hidden} #mainNavi-wrap:before, #mainNavi-wrap:after {content:"";width:100%;position:absolute} #mainNavi-wrap:before {height:100%;top:90px;left:0;background:#f3f5fc url(/resources/_Img/Content/pttr.png) repeat 0 0;transition:height .3s ease;box-shadow:inset 0px 10px 10px 0px rgba(0,0,0,.08)} #mainNavi-wrap:after {height:1px;background:#ccc;position:absolute;top:90px;left:0} #mainNavi-wrap.over {border-bottom:2px solid #003f8c} #mainNavi-wrap.over:before {display:block} #mainNavi-wrap.over:after {display:block} #mainNavi {height:90px;padding:0 100px 0 270px} #mainNavi .depth1-ul {overflow:hidden;text-align:center;} #mainNavi > ul > li:first-child {padding-left:8px;} #mainNavi .mn_li1 {display: inline-block;text-align:center;margin:0 30px;} #mainNavi .mn_a1 {display:block;font-size:22px;font-weight:500;color:#222;padding:34px 0;} #mainNavi .mn_li1 .mn_a1:hover, #mainNavi .mn_li1 .mn_a1:hover span, #mainNavi .mn_li1.over .mn_a1 span {color:#003f8c;} #mainNavi .depth2-wrap {display:none;position:absolute;width:14.2857%;min-height:280px;top:90px;left:0;z-index:1000;text-align:left;box-sizing:border-box;border-left:1px solid rgba(0, 0, 0, .1);transition:all .3s ease} #mainNavi .mn_li1:hover .depth2-wrap {background:rgba(0,0,0,.03);} #mainNavi .mn_li1:last-child .depth2-wrap {border-right:1px solid rgba(0, 0, 0, .1)} #mainNavi .mn_li1:nth-child(1) .depth2-wrap {left:0} #mainNavi .mn_li1:nth-child(2) .depth2-wrap {left:14.2875%} #mainNavi .mn_li1:nth-child(3) .depth2-wrap {left:28.575%} #mainNavi .mn_li1:nth-child(4) .depth2-wrap {left:42.8625%} #mainNavi .mn_li1:nth-child(5) .depth2-wrap {left:57.15%} #mainNavi .mn_li1:nth-child(6) .depth2-wrap {left:71.4375%} #mainNavi .mn_li1:nth-child(7) .depth2-wrap {left:85.725%} #mainNavi .depth2-wrap .depth2-ul {overflow:hidden;position:relative;font-size:0;padding:25px 0;margin:0 15px;} #mainNavi .depth2-wrap .mn_li2 {margin:10px 0;} #mainNavi .depth2-wrap .mn_a2 {position:relative;display:inline-block;font-size:16px;color:#555;padding-bottom:5px;transition:all .3s ease} #mainNavi .depth2-wrap .mn_a2:after {content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:#333;transition:all .3s ease} #mainNavi .depth2-wrap .mn_a2.over, #mainNavi .depth2-wrap .mn_a2:hover, #mainNavi .depth2-wrap .mn_a2:focus {color:#333;} #mainNavi .depth2-wrap .mn_a2.over:after, #mainNavi .depth2-wrap .mn_a2:hover:after, #mainNavi .depth2-wrap .mn_a2:focus:after {width:100%;} #mainNavi .depth3-wrap {display:none;padding:20px 20px 5px 20px;} #mainNavi .depth3-wrap .mn_li3 {margin-bottom:12px;} #mainNavi .depth3-wrap .mn_a3 {position:relative;display:block;font-size:16px;color:#666;padding:0 10px;} #mainNavi .depth3-wrap .mn_a3:before {content:'';position:absolute;left:0;top:8px;width:3px;height:2px;background:#063761;} #mainNavi .depth3-wrap .mn_a3 span {position:relative;display:inline-block;} #mainNavi .depth3-wrap .mn_a3 span:after {content:'';position:absolute;left:0;bottom:-5px;width:100%;height:1px;background:#003e92;opacity:0;transition:all .3s ease} #mainNavi .depth3-wrap .mn_a3.over, #mainNavi .depth3-wrap .mn_a3:hover, #mainNavi .depth3-wrap .mn_a3:focus {color:#003e92;} #mainNavi .depth3-wrap .mn_a3.over span:after, #mainNavi .depth3-wrap .mn_a3:hover span:after, #mainNavi .depth3-wrap .mn_a3:focus span:after {opacity:1;} #mainNavi .mn_a1[target=_blank] span:after {display:inline-block;content:"";width:15px;height:15px;margin-left:7px;background:url(/resources/_Img/Common/ico_nw2.png) no-repeat 0 0} #mainNavi .mn_a2[target=_blank] span:after, #mainNavi .mn_a3[target=_blank] span:after {content:"";position:absolute;right:-20px;top:4px;width:11px;height:11px;margin-left:7px;background:url(/resources/_Img/Common/ico_nw.png) no-repeat 0 0} #mainNavi .mn_a2[target=_blank].over span:after, #mainNavi .mn_a3[target=_blank].over span:after, #mainNavi .mn_a2[target=_blank]:hover span:after, #mainNavi .mn_a3[target=_blank]:hover span:after, #mainNavi .mn_a2[target=_blank]:focus span:after, #mainNavi .mn_a3[target=_blank]:focus span:after, #mainNavi .mn_a2[target=_blank]:active span:after, #mainNavi .mn_a3[target=_blank]:active span:after {} #mainNavi .tgl-btn {display:none;} #header-wrap .tmn-bg {position:absolute;left:0;top:128px;width:100%;height:0;background:#f3f4f7;border-bottom:1px solid #323b50;z-index:400;} #menu-wrap .allmn-btn {position:absolute;right:0;top:19px;width:48px;height:48px;border:1px solid #ccc;transition:all .3s ease;} #menu-wrap .allmn-btn:before, #menu-wrap .allmn-btn:after, #menu-wrap .allmn-btn .txt:before {content:"";display:block;width:20px;height:2px;background:#5a5a5a;margin-left:14px;transition:all .3s ease;} #menu-wrap .allmn-btn:before {margin-bottom:5px;margin-top:15px;} #menu-wrap .allmn-btn:after {margin-top:5px;} #menu-wrap .allmn-btn:hover {border-color:#003f8c} #menu-wrap .allmn-btn:hover:before, #menu-wrap .allmn-btn:hover:after {background:#003f8c;} #menu-wrap .allmn-btn:hover .txt:before {margin-left:18px;background:#003f8c;} } @media only screen and (max-width:999px){ /* 메뉴 */ #mainNavi-wrap {overflow:inherit;position:absolute;top:0;right:0;width:100%;} #menu-wrap.mn-h-open {right:0;overflow:visible} #menu-wrap.mn-h-open .mn-top {position:relative;display:block;width:100%;color:#fff;z-index:8001;overflow:visible;} #menu-wrap.mn-h-open .mn-top .mn-tit {font-size:18px;color:#fff;letter-spacing:-0.02em;font-weight:normal;line-height:1;text-align:center;background:#2b405b url(/resources/_Img/Templet/Layout/tmn_list.png) no-repeat 90% center;background-size:auto 20px;height:70px;line-height:70px;} #menu-wrap {position:absolute;transition:right 0.3s ease;right:-100%;top:0px;left:auto;width:100%;height:9000px;z-index:8000;background:#fff;overflow-y:scroll;overflow-x:hidden} #menu-wrap .mem-btn {overflow:hidden;background:#2b405b;border-top:1px solid rgba(255,255,255,0.2)} #menu-wrap .mem-btn a {float:left;width:50%;text-align:center;font-size:13px;padding:10px 5px;color:#fff;box-sizing:border-box} #menu-wrap .mem-btn a span {display:inline-block;padding:1px 0 1px 23px;} #menu-wrap .mem-btn a span.login {background:url(/resources/_Img/Templet/Layout/mlogin_ico.png) no-repeat 0 50%;} #menu-wrap .mem-btn a span.mypage {background:url(/resources/_Img/Templet/Layout/my_ico.png) no-repeat 0 50%;} #menu-wrap .tmn-box {position:relative;background:#032e52;padding:40px 20px;border-bottom:1px solid #305575;} #menu-wrap .tmn-box .btn-close {width:32px;height:32px;background:none;border:2px solid #fff;border-radius:50%;position:absolute;top:50%;right:10px;margin-top:-16px;} #menu-wrap .tmn-box .btn-close:before, #menu-wrap .tmn-box .btn-close:after {display:block;content:"";width:2px;height:14px;background:#fff;position:absolute;top:50%;left:50%;margin-top:-7px;margin-left:-1px} #menu-wrap .tmn-box .btn-close:before {transform:rotate(45deg);-ms-transform:rotate(45deg)} #menu-wrap .tmn-box .btn-close:after {transform:rotate(-45deg);-ms-transform:rotate(-45deg)} #menu-wrap .tmn-box .tmn-title {font-size:18px;font-weight:300;color:#fff;} #menu-wrap .tmn-global {background:#032e52;padding:13px 0 14px 15px} #menu-wrap .tmn-global li {display:inline-block;line-height:1} #menu-wrap .tmn-global li a {color:#fff;font-size:13px;padding:0 5px;opacity:.6;} #menu-wrap.mn-h-open #mainNavi {left:auto;right:0;top:0;width:100%} #mainNavi .mn_li1.over:before {display:none;} #mainNavi li.mn_li1 {position:relative;border-top:1px solid #305575;background:#032e52;margin:0;} #mainNavi .mn_li1 .mn_a1 {display:block;padding:25px 0 25px 20px;font-size:20px;color:#fff;font-weight:500;} #mainNavi .mn_li1.is-open {background:#014898;} #mainNavi .mn_li1.is-open .mn_a1 {color:#fff} #mainNavi .mn_li1.is-close .tgl-btn {position:absolute;top:21px;right:15px;width:26px;height:26px;border:0;background:none;z-index:500;} #mainNavi .mn_li1.is-close .tgl-btn:before, #mainNavi .mn_li1.is-close .tgl-btn:after {display:block;content:"";width:16px;height:2px;background:#fff;position:absolute;top:50%;left:50%;margin-top:-1px;margin-left:-8px} #mainNavi .mn_li1.is-close > .tgl-btn:after {display:none;} #mainNavi .mn_li2.is-close .tgl-btn {top:13px;} #mainNavi .mn_li2.is-close .tgl-btn:before, #mainNavi .mn_li2.is-close .tgl-btn:after {width:12px;background:#8e8e8e;} #mainNavi .mn_li2.is-close .tgl-btn:before {transform:rotate(45deg);-ms-transform:rotate(45deg);margin-left:-9px;} #mainNavi .mn_li2.is-close .tgl-btn:after {transform:rotate(-45deg);-ms-transform:rotate(-45deg);margin-left:-2px;} #mainNavi .mn_li2.is-open > .tgl-btn:before, #mainNavi .mn_li2.is-open > .tgl-btn:after {width:16px;background:#063761;transform:rotate(0deg);-ms-transform:rotate(0deg);margin-left:-8px;} #mainNavi .mn_li2.is-open > .tgl-btn:before {display:none;} #mainNavi .depth2-wrap {display:none;position:relative;height:auto;background:#fbf7f7;transition:display .3s ease;} #mainNavi .mn_li2 {position:relative;border-bottom:1px solid #d2d2d2} #mainNavi .depth2-wrap .mn_li2:last-child, #mainNavi .depth2-wrap .mn_li2.is-open {border-bottom:0;} #mainNavi .depth2-wrap .mn_a2 {position:relative;display:block;color:#666;font-size:16px;padding:20px;} #mainNavi .depth2-wrap .mn_a2.over, #mainNavi .depth2-wrap .is-open .mn_a2, #mainNavi .depth2-wrap .mn_a2:hover {font-weight:500;color:#014898} #mainNavi .depth2-wrap .is-open .mn_a2:before, #mainNavi .depth2-wrap .mn_a2.over:before, #mainNavi .depth2-wrap .mn_a2:hover:before {background:#f04e23;} #mainNavi .depth2-wrap .depth3-wrap {display:none;background:#f6f6f6 url(/resources/homepage/kor/_Img/Layout/lm_dot.gif) repeat-x 0 bottom;border-top:4px solid #014898;padding:20px 0;} #mainNavi .depth2-wrap .depth3-wrap li {padding:1px 30px} #mainNavi .depth2-wrap .depth3-wrap li a {position:relative;display:block;padding:5px 0 5px 9px;} #mainNavi .depth2-wrap .depth3-wrap li a:before {display:block;content:"";width:3px;height:2px;background:#063761;position:absolute;top:11px;left:0} #mainNavi .depth2-wrap .depth3-wrap li a span {font-size:14px;} #mainNavi .depth2-wrap .depth3-wrap li.over a {position:relative;color:#014898} #mainNavi .depth2-wrap .depth3-wrap li.over a span {display:inline-block;padding-bottom:4px;border-bottom:1px solid #014898} .body-slide-wr {position:relative;width:100%;height:100%;transition:margin 0.3s ease;} .body-slider-ovclick {display:none;position:fixed;z-index:10;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.6);cursor:pointer;z-index:3000;} #mn-ctrs-btns {display:block;position:absolute;right:20px;top:60px} #mn-ctrs-btns .mn-ctrs-btn {position:relative;width:31px;height:31px;background:transparent;border:0} #mn-ctrs-btns .mn-ctrs-btn:before, #mn-ctrs-btns .mn-ctrs-btn:after, #mn-ctrs-btns .mn-ctrs-btn .txt:before {content:"";display:block;width:25px;height:2px;background:#222;margin-left:3px;transition:all .3s ease;} #mn-ctrs-btns .mn-ctrs-btn:before {margin-bottom:5px;margin-top:0;} #mn-ctrs-btns .mn-ctrs-btn:after {margin-top:5px;} } @media only screen and (max-width:640px){ #mn-ctrs-btns {right:10px;top:55px} } #sch-lay {position:absolute;left:0;top:135px;width:100%;z-index:100;display:none;} #sch-lay .sch-box {position:relative;width:1200px;margin:0 auto;padding:35px 0;text-align:center;background:#0092cf;} #sch-lay .sch-box form {display:inline-block;padding-bottom:5px;border-bottom:2px solid #fff;} #sch-lay .sch-box label.tit {font-family:"sofia-pro";color:#fff;font-size:42px;font-weight:300;margin-right:20px;} #sch-lay .sch-box #keyword {width:400px;color:#fff;font-size:18px;background:transparent;border:0;height:40px;line-height:40px;} #sch-lay .sch-box #keyword::placeholder {color:#fff;font-size:18px;} #sch-lay .sch-box .sch-go {width:40px;height:40px;border:0;vertical-align:top;margin-top:8px;background:url(/resources/_Templet/Layout/layout_01/_Img/sch_ico.png) no-repeat 50% 50%;} #sch-lay .sch-box .sch-close {position:absolute;right:35px;top:50%;width:54px;height:54px;margin-top:-27px;background:transparent;border:2px solid #fff;border-radius:50%;} #sch-lay .sch-box .sch-close:before, #sch-lay .sch-box .sch-close:after {content:'';position:absolute;left:50%;top:12px;width:2px;height:26px;margin-left:-1px;background:#fff;} #sch-lay .sch-box .sch-close:before {transform:rotate(45deg)} #sch-lay .sch-box .sch-close:after {transform:rotate(-45deg)} @media only screen and (max-width:1200px){ #sch-lay .sch-box {width:100%;} } @media only screen and (max-width:999px){ #sch-lay {top:110px;} #sch-lay .sch-box {padding:20px 0;} } /*-------------------------submenu_02.css------------------------------------*/ #side-wrap {display:none} @media all and (min-width:1200px){ #side-wrap {position:relative;float:left;width:250px;padding-bottom:50px;display:block;margin-top:-120px;} .submenu .lm-tit {display:block;padding:47px 0;text-align:center;background:#00387c url(/resources/_Templet/Submenu/submenu_02/_Img/lm_bg.jpg) repeat 0 0;} .submenu .lm-tit .tit {display:block;font-size:26px;color:#fff;font-weight:500;} .submenu .lm-tit .txt {display:none;font-size:13px;color:#f3b8a8;line-height:1.4;} .submenu .depth1 .lm_a1 {display:none;} .submenu .depth2 .lm_l2 {position:relative;} .submenu .depth2 .lm_a2 {display:block;padding:18px 25px 20px 25px;font-size:16px;color:#222;font-weight:500;background:#fff;border-bottom:1px solid #c4c4c4;transition:all 0.3s ease} .submenu .depth2 .lm_a2[target=_blank]:after {content:'';position:absolute;right:18px;top:19px;width:15px;height:15px;background:url(/resources/_Img/Common/ico_nw2.png) no-repeat 0 0;z-index:100} .submenu .depth2 .over .lm_a2, .submenu .depth2 .is-open .lm_a2 {color:#014898;border-bottom:4px solid #014898} .submenu .depth2 .lm_a2:hover, .submenu .depth2 .lm_a2:focus {color:#014898;text-decoration:none;} .submenu .depth3 {display:none;padding:10px 25px;background:#f6f6f6;} .submenu .lm_l2.over .depth3, .submenu .lm_l2.is-open .depth3 {display:block;background:#f6f6f6 url(/resources/homepage/kor/_Img/Layout/lm_dot.gif) repeat-x 0 bottom;} .submenu .depth3 .lm_l3 {margin:5px 0;} .submenu .depth3 .lm_a3 {position:relative;display:block;font-size:15px;color:#666;padding:3px 0 6px 11px;} .submenu .depth3 .lm_a3:before {content:'';position: absolute;left: 0;top:9px;width:4px;height: 2px;background:#8e8e8e;} .submenu .depth2 .lm_a3[target=_blank]:after {content:'';display:inline-block;width:11px;height:11px;background:url(/resources/_Img/Common/ico_nw.png) no-repeat 0 0;z-index:100} .submenu .depth3 .over .lm_a3, .submenu .depth3 .lm_a3:hover, .submenu .depth3 .lm_a3:focus {color:#014898;} .submenu .depth3 .over .lm_a3:before, .submenu .depth3 .lm_a3:hover:before, .submenu .depth3 .lm_a3:focus:before {background:#063761;} .submenu .depth4 {background:#fff;padding:5px 10px;} .submenu .depth4 .lm_l4 {margin:5px 0;} .submenu .depth4 .lm_a4 {position:relative;padding-left:10px;} .submenu .depth4 .lm_a4:before {content:'';position: absolute;left:0;top:9px;width:2px;height:2px;border-radius:50%;background:#8e8e8e;} .submenu .depth4 .over .lm_a4, .submenu .depth4 .lm_a4:hover, .submenu .depth4 .lm_a4:focus {color:#014898;} .submenu .depth4 .over .lm_a4:before, .submenu .depth4 .lm_a4:hover:before, .submenu .depth4 .lm_a4:focus:before {background:#063761;} #side-wrap .lm_a1, #side-wrap .lm_l1 > button {display:none;} #side-wrap .depth2 .has-sub .tgl-btn {position:absolute;top:16px;right:15px;width:20px;height:20px;border:0;background:transparent;} #side-wrap .depth2 .has-sub .tgl-btn:before, #side-wrap .depth2 .has-sub .tgl-btn:after {content:'';position:absolute;background:#8e8e8e;transition:all 0.3s ease} #side-wrap .depth2 .has-sub .tgl-btn:before {width:14px;height:2px;left:3px;top:9px;} #side-wrap .depth2 .has-sub .tgl-btn:after {width:2px;height:14px;left:9px;top:3px;} #side-wrap .depth2 .is-open .tgl-btn:before {left:2px;top:9px;width:16px;background:#063761;} #side-wrap .depth2 .is-open .tgl-btn:after {display:none;} #side-wrap .depth2 .has-sub:focus .tgl-btn:before, #side-wrap .depth2 .has-sub:focus .tgl-btn:after, #side-wrap .depth2 .has-sub:hover .tgl-btn:before, #side-wrap .depth2 .has-sub:hover .tgl-btn:after {background:#063761;} } @media all and (max-width:768px){ #side-wrap {display:block;width:100%;margin-top:-150px;} #side-wrap:after {content:'';position:absolute;left:0;top:150px;width:100%;height:100%;background:rgba(0,0,0,.6);z-index:10;display:none;} .submenu .lm-tit {display:none;} #leftmenu {height:150px} #leftmenu .lm_l1 {height:150px;background:rgba(0,0,0,.4);transition:all .3s ease} #leftmenu .lm_l1.is-open {background:rgba(3,46,82,.9)} #leftmenu .lm_l1 > .tgl-btn {position:absolute;top:0;left:0;width:100%;height:150px;border:0;background:none;z-index:99} #leftmenu .lm_a1 {display:block;width:100%;font-size:26px;color:#fff;font-weight:500;text-align:center;padding-top:35px;} #leftmenu .lm_a1 span {display:block;position:relative} #leftmenu .lm_a1 span:after {content:'';display:block;width:40px;height:40px;margin:10px auto;border-radius:50%;background:#0092cf url(/resources/_Templet/Layout/layout_01/_Img/lm_arr.png) no-repeat 50% 50%;transition:all .3s ease;transform:rotate(180deg);-ms-transform:rotate(180deg)} #leftmenu .lm_l1.is-open .lm_a1 span:after {transform:rotate(0deg);-ms-transform:rotate(0deg)} #leftmenu .depth2 {display:none;position:absolute;top:150px;left:0;width:100%;background:#fff;z-index:1000;} #leftmenu .depth2 .lm_l2 {position:relative;background:#fff;border-bottom:1px solid #c4c4c4} #leftmenu .depth2 .lm_a2 {display:block;padding:20px;font-size:16px;color:#666} #leftmenu .depth2 .lm_l2.is-open {border-bottom:0;padding-bottom:1px;background:url(/resources/homepage/kor/_Img/Layout/lm_dot.gif) repeat-x 0 bottom;} #leftmenu .depth2 .lm_l2.is-open .lm_a2 {color:#014898;font-weight:500;} #leftmenu .lm_l2.is-close .tgl-btn {position:absolute;top:13px;right:15px;width:26px;height:26px;border:0;background:none;z-index:500;} #leftmenu .lm_l2.is-close .tgl-btn:before, #leftmenu .lm_l2.is-close .tgl-btn:after {display:block;content:"";width:2px;height:12px;background:#8e8e8e;position:absolute;top:50%;left:50%;margin-top:-6px;margin-left:-1px} #leftmenu .lm_l2.is-close .tgl-btn:before {transform:rotate(-45deg);-ms-transform:rotate(-45deg);margin-left:-5px;} #leftmenu .lm_l2.is-close .tgl-btn:after {transform:rotate(45deg);-ms-transform:rotate(45deg);margin-left:3px;} #leftmenu .lm_l2.is-open .tgl-btn:before, #leftmenu .lm_l2.is-open .tgl-btn:after {background:#063761;} #leftmenu .lm_l2.is-open .tgl-btn:after {transform:rotate(90deg);-ms-transform:rotate(90deg);height:16px;margin-left:-1px;margin-top:-8px;} #leftmenu .lm_l2.is-open .tgl-btn:before {display:none;} #leftmenu .depth3 {display:none;padding:15px 20px;overflow:hidden;font-size:0;background:#f6f6f6;border-top:4px solid #014898} #leftmenu .depth3 .lm_l3 {display:inline-block;width:50%;} #leftmenu .depth3 .lm_l3 .tgl-btn {width:20px;height:20px;top:0;background-size:20px;} #leftmenu .depth3 .lm_a3 {display:block;font-size:14px;padding:7px 0 7px 11px;color:#444;position:relative} #leftmenu .depth3 .lm_a3:before {content:"";position:absolute;left:0;top:14px;width:3px;height:2px;background:#063761;} #leftmenu .depth3 .lm_a3 span {position:relative} #leftmenu .depth3 .lm_a3 span:after {width:0;height:1px;bottom:0;background:#0097b2;transition:all .3s ease} #leftmenu .depth3 .lm_l3.over .lm_a3 {color:#006376} #leftmenu .depth3 .lm_l3.over .lm_a3 span {display:inline-block;padding-bottom:4px;border-bottom:1px solid #006376} #leftmenu .depth4 {display:none;padding:5px 15px;margin-top:10px;overflow:hidden;background:#f6f6f6;border:1px solid #ddd} #leftmenu .depth4 .lm_l4 {position:relative;margin:10px 0;} #leftmenu .depth4 .lm_l4.over .lm_a4 {color:#1462bc;} } /*-------------------------footer_eng.css------------------------------------*/ /* footer */ #footer-wrap {position:relative;background:#272b34;padding:40px 0 50px 0;line-height:1.2;z-index:3000;} #footer-wrap .service-cont {position:relative;height:64px;border-bottom:1px solid rgba(255,255,255,.1);display:none;} #footer-wrap .service-cont .btn-prev, #footer-wrap .service-cont .btn-next {display:none} #footer-wrap .service-list {padding:25px 0;line-height:1;position:relative} #footer-wrap .service-list li {display:inline-block} #footer-wrap .service-list li a {position:relative;display:block;padding:0 13px} #footer-wrap .service-list li a:after {content:'';position:absolute;left:0;top:0;width:1px;height:100%;background:rgba(255,255,255,0.3);} #footer-wrap .service-list li:first-child a {padding-left:0;margin-left:0} #footer-wrap .service-list li:first-child a:after {display:none;} #footer-wrap .service-list li:last-child a {padding-right:0;margin-right:0} #footer-wrap .service-list li a span {position:relative;font-size:14px;letter-spacing:-0.02em;color:#aaa;} #footer-wrap .service-list li a span:after {content:'';position:absolute;left:0;bottom:-2px;width:100%;height:1px;opacity:0;background:#aaa;transition:all 0.3s ease;} #footer-wrap .service-list li a:hover span:after, .service-cont .service-list li a:focus span:after {opacity:1;} #footer-wrap .family-site-wr {position:absolute;top:0;right:0;font-size:0} #footer-wrap .family-site-wr .family-site {font-size:13px;display:inline-block;background:transparent;width:190px;border-right:1px solid rgba(255,255,255,0.3);z-index:100;position:relative} #footer-wrap .family-site-wr .family-site:first-child {border-left:1px solid rgba(255,255,255,0.3)} #footer-wrap .family-site-wr .family-site dt button {position:relative;color:#d8d8d9;background:none;border:0;width:100%;display:block;padding:0 0 0 19px;height:54px;font-weight:500;transition:all 0.3s ease;text-align:left;vertical-align:middle} #footer-wrap .family-site-wr .family-site dt button:hover, #footer-wrap .family-site-wr .family-site-wr .family-site dt button:focus {background:rgba(0,0,0,0.3);} #footer-wrap .family-site-wr .family-site dt button:after {transition:all .3s ease;content:'';position: absolute;right:20px;top:15px;width:24px;height:24px;background:url(/resources/_Img/Templet/Layout/footer_spr.png) no-repeat 0 0;} #footer-wrap .family-site-wr .family-site dt button.is-open:after {transform:rotate(180deg);-ms-transform:rotate(180deg)} #footer-wrap .family-site-wr .family-site .isSelSub {position:absolute;bottom:54px;left:0;display:none;background:#4d5057;width:100%;} #footer-wrap .family-site-wr .family-site .isSelSub ul {padding:10px 10px 10px 15px;height:150px;overflow-y:scroll} #footer-wrap .family-site-wr .family-site .isSelSub li a {display:inline-block;color:#fff;padding:5px 0;} #footer-wrap .family-site-wr .family-site .isSelSub li a:hover, .service-cont .family-site .isSelSub li a:focus, .service-cont .family-site .isSelSub li a:active {text-decoration:underline;} #footer-wrap .family-site-wr .family-site .btn-fclose {position:absolute;top:0;right:-27px;border:0;cursor:pointer;background:url(/resources/_Img/Templet/Layout/btn_fclose.gif) no-repeat 0 0;width:28px;height:28px;} #footer-wrap .footer {position:relative;font-size:14px;padding:0 0 0 125px;color:#a4a4a4;word-break:keep-all;letter-spacing:0} #footer-wrap .footer .flogo {position:absolute;left:0;top:0;} #footer-wrap .footer .flogo a {display:block} #footer-wrap .footer .flogo .flogo-txt {color:#a8acac;display:block;font-size:17px;text-align:center} #footer-wrap .footer .add-sec {margin-bottom:5px;} #footer-wrap .footer .add-sec .tit {color:#fff;font-weight:500;margin-right:5px;} #footer-wrap .footer .add-sec .number {display:inline-block;margin-right:5px;} #footer-wrap .footer .copyright {color:#6a6a6a;font-size:13px;margin-top:20px;text-transform:uppercase;font-weight:300} #footer-wrap .footer address {display:inline-block;margin-right:10px;font-weight:300} #footer-wrap .fsns-wr {position:absolute;top:0;right:70px} #footer-wrap .fsns li {display:inline-block;margin-left:5px} #footer-wrap .fsns li a {display:block;width:45px;height:45px;border-radius:50%;background:rgba(140,140,140,.2) url(/resources/_Img/Templet/Layout/sns_spr.png) no-repeat} #footer-wrap .fsns .facebook a {background-position:0 0} #footer-wrap .fsns .twitter a {background-position:-46px 0} #footer-wrap .fsns .naverblog a {background-position:-92px 0} #footer-wrap .fsns .youtube a {background-position:-138px 0} #footer-wrap .fsns .insta a {background-position:-184px 0} #footer-wrap .fsns .daumcafe a {background-position:-230px 0} #footer-wrap .topBt {position:fixed;bottom:-60px;right:50%;margin-right:-600px;width:46px;height:46px;text-align:center;background:rgba(0,0,0,.3);border-radius:50%;z-index:3500;transition:all .3s ease} #footer-wrap .topBt span {display:inline-block;color:#fff;font-size:12px;padding:23px 0 0;position:relative;} #footer-wrap .topBt span:before {display:block;content:"";width:10px;height:10px;border:2px solid transparent;border-top:2px solid #fff;border-left:2px solid #fff;position:absolute;top:13px;left:50%;margin-left:-6px;transform:rotate(45deg);-ms-transform:rotate(45deg)} #footer-wrap .topBt.over {bottom:75px;} #footer-wrap .flic-wrap {position:absolute;right:0;bottom:0;} #footer-wrap .flic-wrap li {float:left;margin:0 5px;} #footer-wrap .flic-wrap li a {display:block;} #footer-wrap .fsns li:hover a, #footer-wrap .fsns li:focus a {animation:ico_ani3 1s ease-out infinite} @media all and (max-width:1200px){ #footer-wrap .topBt {right:30px;margin-right:0;} #footer-wrap .topBt.over {bottom:35px;} } @media all and (max-width:999px){ #footer-wrap .service-cont {margin:0;width:100%;height:auto;box-sizing:border-box;padding:0 45px;border-bottom:1px solid rgba(255,255,255,0.3)} #footer-wrap .service-cont .btn-prev, #footer-wrap .service-cont .btn-next {display:block;border:0;background:0;width:45px;height:64px;position:absolute;top:0;} #footer-wrap .service-cont .btn-prev {left:0} #footer-wrap .service-cont .btn-next {right:0} #footer-wrap .service-cont .btn-prev:before, #footer-wrap .service-cont .btn-next:before {display:block;content:"";width:10px;height:10px;border-left:1px solid #fff;border-bottom:1px solid #fff;position:absolute;top:50%;left:50%;margin-top:-5px;margin-left:-5px;z-index:2;} #footer-wrap .service-cont .btn-prev:before {transform:rotate(45deg);-ms-transform:rotate(45deg)} #footer-wrap .service-cont .btn-next:before {transform:rotate(-135deg);-ms-transform:rotate(-135deg)} #footer-wrap .service-cont button:after {content:"";position:absolute;top:0;display:block;width:50px;height:52px;z-index:1;} #footer-wrap .service-cont .btn-prev:after {left:20px;background:linear-gradient(to left, rgba(39, 43, 52, 0) 0, #272b34 50%)} #footer-wrap .service-cont .btn-next:after {right:20px;background:linear-gradient(to right, rgba(39, 43, 52, 0) 0, #272b34 50%)} #footer-wrap .service-list {width:100%;box-sizing:border-box;text-align:center;overflow:hidden;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch} #footer-wrap .family-site-wr {top:auto;bottom:0;text-align:center;width:100%} #footer-wrap .family-site-wr .family-site {width:50%;box-sizing:border-box;text-align:left;border-top:1px solid rgba(255,255,255,0.3)} #footer-wrap .footer {padding:0;text-align:center} #footer-wrap .footer .flogo {position:relative;top:auto;left:auto;right:auto;bottom:auto;margin-bottom:20px} #footer-wrap .footer .flogo .flogo-txt {display:none} #footer-wrap .footer .flogo a {display:inline-block} #footer-wrap .fsns-wr {position:relative;top:auto;left:auto;right:auto;bottom:auto;text-align:center;margin-top:20px} } @media all and (max-width:680px){ #footer-wrap {padding-bottom:30px} } @media all and (max-width:599px){ #footer-wrap .service-cont .btn-prev, #footer-wrap .service-cont .btn-next {height:52px;} #footer-wrap .service-list {padding:0;height:52px;} #footer-wrap .service-list li {padding-top:20px;} #footer-wrap .service-list li a {margin-bottom:7px} #footer-wrap .service-list li span {font-size:13px} #footer-wrap .footer {padding:0;text-align:center} #footer-wrap .footer .add-sec {margin-bottom:15px;} #footer-wrap .footer .add-sec .tit {display:block;margin-bottom:5px;} } @media all and (max-width:499px){ #footer-wrap .service-list li a span {font-size:13px} #footer-wrap .footer {font-size:13px;} #footer-wrap .footer .flogo {display:none;} #footer-wrap .footer .add-sec {position:relative;padding-left:0;text-align:left;} #footer-wrap .footer address {display:block;margin-right:0;margin-bottom:5px;} #footer-wrap .topBt {width:40px;height:40px;right:10px;} #footer-wrap .topBt.over {bottom:20px;} #footer-wrap .topBt span {padding:12px 0 13px;text-indent:-9999px;} #footer-wrap .topBt span:before {top:16px;} #footer-wrap .footer .copyright {font-size:12px;} } /* ì• ë‹ˆë©”ì´ì ˜ */ @keyframes ico_ani { 0%,100% {transform:rotateZ(0deg);-webkit-transform:rotateZ(0deg);} 10%, 30%, 50%, 70%, 90% {transform:rotateZ(-5deg);-webkit-transform:rotateZ(-5deg);} 20%, 40%, 60%, 80% {transform:rotateZ(5deg);-webkit-transform:rotateZ(5deg);} } @-webkit-keyframes ico_ani { 0%,100% {transform:rotateZ(0deg);-webkit-transform:rotateZ(0deg);} 10%, 30%, 50%, 70%, 90% {transform:rotateZ(-5deg);-webkit-transform:rotateZ(-5deg);} 20%, 40%, 60%, 80% {transform:rotateZ(5deg);-webkit-transform:rotateZ(5deg);} } @keyframes ico_ani2 { 0%,50%,100% {transform:translateY(0);-ms-transform:translateY(0)} 25%,75% {transform:translateY(-7%);-ms-transform:translateY(-7%)} } @-webkit-keyframes ico_ani2 { 0%,50%,100% {transform:translateY(0);-ms-transform:translateY(0)} 25%,75% {transform:translateY(-7%);-ms-transform:translateY(-7%)} } @keyframes ico_ani3 { 0%,50%,100% {transform:translateY(0);-ms-transform:translateY(0)} 25%,75% {transform:translateY(-15%);-ms-transform:translateY(-15%)} } @-webkit-keyframes ico_ani3 { 0%,50%,100% {transform:translateY(0);-ms-transform:translateY(0)} 25%,75% {transform:translateY(-15%);-ms-transform:translateY(-15%)} } @keyframes ico_ani4 { 0% {transform:rotate(0deg);-webkit-transform:rotate(0deg);} 100% {transform:rotate(180deg);-webkit-transform:rotate(180deg);} } @-webkit-keyframes ico_ani4 { 0% {transform:rotate(0deg);-webkit-transform:rotate(0deg);} 100% {transform:rotate(180deg);-webkit-transform:rotate(180deg);} }