/*-------------------------layout_dept.css------------------------------------*/ @charset "utf-8"; /* ============================== * 이전, 다음메뉴 검수용 스타일링 ================================= */ html, body {overflow:hidden;overflow-y:visible;font-family:"Spoqa Han Sans Neo","Inter", sans-serif} #doc-wrap {position:relative;min-width:1400px;overflow:hidden;margin:0 auto} a:focus-visible, button[type="button"]:focus-visible, input[type="button"]:focus-visible {outline:rgb(59, 153, 252) solid 3px;outline-offset:-3px} a:focus:not(:focus-visible), button[type="button"]:not(:focus-visible), input[type="button"]:not(:focus-visible) {outline:0} @media all and (max-width:1400px){ #doc-wrap {min-width:320px} } /* 스킵네비게이션 */ #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:20px;background:#1e64ba;color:#fff;} #skipNavi .skipLink:focus-visible {outline:rgb(255, 0, 0) solid 3px;outline-offset:-3px} /* 레이아웃 */ #header-wrap {position:relative;height:90px;width:100%;border-bottom:1px solid rgba(255,255,255,0.2);margin:0 auto;z-index:9999} @media all and (max-width:999px) { #header-wrap {height:70px} } /* svisual */ #svisual-wrap {position:relative;width:100%;height:auto;box-sizing:border-box;padding:0;z-index:10;transition:all .3s ease} #svisual-wrap .svisualWrap {width:100%;position:relative;height:100%;z-index:1} #svisual-wrap .sVis {position:relative;height:100%} #svisual-wrap .sVis .imgBox {display:block;position:relative;height:100%;overflow:hidden;width:100%} #svisual-wrap .sVis .imgBox:before {content:"";display:block;width:0;height:0;padding-top:20.833%} #svisual-wrap .sVis .imgBox img {display:block;position:absolute;width:auto;height:100%;top:0;left:50%;z-index:1;transform:translateX(-50%) scale(1.2);transition:transform 3s ease} .loaded #svisual-wrap .sVis .imgBox img {transform:translateX(-50%) scale(1)} @media all and (max-width:1199px) { #svisual-wrap {height:300px} } @media all and (max-width:999px) { #svisual-wrap {height:270px} } @media all and (max-width:699px) { #svisual-wrap {height:auto} #svisual-wrap .sVis {display:none} } /* subVis-tit-box */ #subVis-tit-box {position:absolute;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;z-index:5} #subVis-tit-box > span {display:block;font-family:"Spoqa Han Sans Neo", sans-serif;line-height:1.2;color:#fff;word-wrap:break-word;word-break:keep-all;white-space:normal;transition:all .3s ease} #subVis-tit-box > .depth2-tit {font-size:60px;font-weight:500;opacity:0;transform:translateY(30px);margin-top:80px} .loaded #subVis-tit-box > .depth2-tit {font-weight:500;opacity:1;transform:translateY(0)} #subVis-tit-box > .depth2-tit .br {display:none} @media all and (max-width:1199px) { #subVis-tit-box > .depth2-tit {font-size:2.88em} } @media all and (max-width:999px) { #subVis-tit-box > .depth2-tit {margin-top:65px} } @media all and (max-width:799px) { #subVis-tit-box > .depth2-tit {font-size:40px} } @media all and (max-width:699px) { #subVis-tit-box {position:static;transform:translate(0,0)} #subVis-tit-box > .depth2-tit {font-size:26px;color:#0D0D0D;margin-top:20px} #subVis-tit-box > .depth2-tit .br {display:block} } /* cont-navi */ #cont-navi {width:100%} #cont-navi .contNavi {text-align:center;font-size:0} #cont-navi dl.cnavi1 {position:absolute;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5} #cont-navi dl dt {display:inline-block} #cont-navi dl dt a {display:block;position:relative;padding:0 40px 0 20px;font-size:0;box-sizing:border-box;text-align:left;transition:all .3s ease} #cont-navi dl dt a:before {content:"";display:inline-block;width:0;height:65px;vertical-align:middle} #cont-navi dl dt a:after {content:"";display:block;position:absolute;width:15px;height:15px;border:solid;border-width:0 0 2px 2px;border-color:transparent transparent #fff #fff;transform:rotate(-45deg);top:50%;right:0;transition:all .3s ease} #cont-navi dl dt a .txt {display:inline-block;position:relative;font-size:60px;font-weight:500;line-height:1.2;color:#fff;vertical-align:middle;word-wrap:break-word;word-break:keep-all;white-space:normal;transition:all .3s ease} #cont-navi dl.over dt a {} #cont-navi dl.over dt a:after {transform:rotate(135deg)} #cont-navi dl.over dt a .txt {} #cont-navi .sub-list {display:none;position:absolute;top:100%;left:0;width:100%;box-sizing:border-box;padding:20px 0 0} #cont-navi .sub-list ul {display:flex;justify-content:center} #cont-navi .sub-list li .mn_a1 {position:relative;display:block;font-size:19px;color:#fff;text-align:left;padding:0 20px;transition:all .3s ease} #cont-navi .sub-list li .mn_a1 span {display:inline-block;padding:0 0 5px;line-height:1.2} #cont-navi .sub-list li .mn_a1[target='_blank']:after {display:inline-block;content:"";width:12px;height:12px;vertical-align:middle;margin:0 0 1px 10px;background:url(./_Img/Common/nwin_spr.png) no-repeat -22px -25px} #cont-navi .sub-list li.isOver a span {font-weight:500;border-bottom:2px solid #fff} #cont-navi .sub-list li .mn_a1:hover span {border-bottom:2px solid #fff} #cont-navi .sub-list .cNaviCloser {display:block;position:absolute;width:30px;height:30px;border:0;background:#fff;right:-30px;bottom:0;background:#fff;box-shadow:5px 5px 5px rgba(0, 0, 0, .05);} #cont-navi .sub-list .cNaviCloser:before, #cont-navi .sub-list .cNaviCloser:after {content:"";display:block;position:absolute;width:14px;height:2px;background:#777;top:0;right:0;bottom:0;left:0;margin:auto;transition:all .3s ease} #cont-navi .sub-list .cNaviCloser:before {transform:rotate(45deg)} #cont-navi .sub-list .cNaviCloser:after {transform:rotate(135deg)} #cont-navi .sub-list .cNaviCloser:hover:before {transform:rotate(135deg);background:#000} #cont-navi .sub-list .cNaviCloser:hover:after {transform:rotate(225deg);background:#000} @media all and (max-width:768px) { #cont-navi {display:none} } /* contents */ #container-wrap {position:relative;margin-top:-92px;z-index:1} #container {position:relative;max-width:1480px;margin:80px auto;z-index:9} #container:after {content:'';clear:both;display:block} #contents {width:100%;min-height:500px;word-break:keep-all;word-wrap:break-word} #contents #cont {font-size:18px;color:#555;letter-spacing:-0.05em;line-height:1.3;word-break:keep-all;word-wrap:break-word;min-height:500px;font-weight:400} #contents #cont:after {clear:both;content:"";display:block} #contents #cont input, button, select, textarea {font-size:18px;color:#555;letter-spacing:-.05em;line-height:1.3} @media all and (max-width:1440px) { #container {margin:50px 30px} } @media all and (max-width:999px){ #container-wrap {margin-top:-72px} #contents {width:auto;max-width:100%;float:none} #contents #cont {font-size:17px} #contents #cont input, button, select, textarea {font-size:16px} } @media all and (max-width:768px){ #container {margin:30px 30px;z-index:1} #contents #cont {font-size:15px} } @media all and (max-width:699px) { #container-wrap {margin-top:0} #container {margin:20px} } @media all and (max-width:599px) { #contents #cont {font-size:14px} #contents #cont input, button, select, textarea {font-size:14px} } /* contents full레이아웃 */ #container.full {max-width:none;max-width:initial;padding:0 !important;margin:0 !important} #contents {padding:0 !important;margin:0 !important} #contents #cont {padding:0 !important;margin:0 !important} /*-------------------------logo.css------------------------------------*/ #header {display:block;position:relative;width:100%;height:90px;margin:0 auto;z-index:11;} #header .logo {display:block;position:absolute;left:60px;left:40px;top:50%;transform:translateY(-50%);width:200px;height:auto;z-index:501} #header .logo a {display:block} #header .logo a span {display:block} #header .logo a span img {display:block;width:100%;height:auto;} #header .logo a span img.mologo {display:none} @media all and (max-width:1860px) { #header .logo {left:30px} } @media all and (max-width:999px) { #header {height:70px} } @media all and (max-width:699px) { #header .logo {width:120px;left:20px} #header .logo a span img.pclogo {display:none} #header .logo a span img.mologo {display:block} .isMain #header .logo a span img.pclogo {display:block} .isMain #header .logo a span img.mologo {display:none} } /*-------------------------header.css------------------------------------*/ #menu-wrap .mGnavi {display:none} /* 메뉴 */ #menu-wrap {display:inline-block;position:relative;width:100%;font-family:"Spoqa Han Sans Neo",sans-serif;background:transparent;z-index:100} #menu-wrap .menu-cont {width:76%;padding-left:24%} #mn-ctrs-btns {display:none} /* 주메뉴 */ @media all and (min-width:1000px) { #menu-wrap .mn-top, #menu-wrap .mem-btn, #menu-wrap .btn-close, #menu-wrap .tmn-box {display:none} #mainNavi-wrap {position:absolute;left:0;top:0;width:100%;height:90px;border-radius:0 0 50px 50px;background:transparent;z-index:500;margin:0;text-align:center;box-sizing:border-box;transition:background .3s ease} #mainNavi-wrap.over {box-shadow:0px 4px 30px 0px rgba(0, 0, 0, 0.25)} #menu-wrap {} #mainNavi {height:90px;box-sizing:border-box;padding:0} #mainNavi .depth1-wrap {display:block;width:auto;text-align:center;box-sizing:border-box;position:relative;max-width:1800px;margin:0 auto;padding:0 270px 0;font-size:0;line-height:1} #mainNavi .depth1-ul {display:inline-block} #mainNavi > ul > li:first-child {padding-left:8px} #mainNavi .mn_li1 {display:inline-block;position:relative;text-align:center;margin:0 20px} #mainNavi .mn_a1 {position:relative;display:block;width:170px;padding:35px 0} #mainNavi .mn_a1 > span {display:inline-block;line-height:1;font-size:20px;font-weight:500;color:#fff;letter-spacing:-.0425em;transition:all .3s ease} #mainNavi .depth2-wrap {display:none;position:absolute;top:90px;left:0;z-index:1000;width:100%;height:auto;font-weight:normal;box-sizing:border-box} #mainNavi .depth2-wrap .depth2-ul {display:block;width:100%;position:relative;font-size:0;background:#fff;border-radius:20px;box-sizing:border-box;padding:30px 20px} #mainNavi .depth2-wrap .depth2-ul:before {content:"";display:block !important;position:absolute;width:0;height:0;border-style:solid;border-width:0 21px 21px 21px;border-color:transparent transparent #fff transparent;left:50%;top:-11px;transform:translate(-50%,11px);transition:all .3s ease;transition-delay:.3s} #header-wrap.over #mainNavi .depth2-wrap .depth2-ul:before {transform:translate(-50%,0)} #mainNavi .depth2-wrap .mn_li2 {display:block;width:100%;position:relative;margin-bottom:20px;box-sizing:border-box} #mainNavi .depth2-wrap .mn_li2:last-child, #mainNavi .depth2-wrap .mn_li2:last-of-type {margin-bottom:0} #mainNavi .depth2-wrap .mn_a2 {display:block;width:auto;height:auto;position:relative;box-sizing:border-box;font-size:0;transition:all .3s ease} #mainNavi .depth2-wrap .mn_a2 span {display:inline-block;position:relative;vertical-align:middle;font-size:15px;color:#333;font-weight:500;letter-spacing:-.025em;line-height:1.2} #mainNavi .depth2-wrap .over .mn_a2, #mainNavi .depth2-wrap .over .mn_a2 span, #mainNavi .depth2-wrap .mn_a2:hover span {color:#E13133;font-weight:600} #mainNavi .tgl-btn {display:none} .pc-topMenu-open .body-slider-ovclick {display:none} } @media all and (max-width:1440px) { #mainNavi .depth1-wrap{padding:0 0 0 270px;text-align:right} #mainNavi .depth2-wrap {left:0;width:100%} } @media all and (max-width:1299px) { #mainNavi .depth2-wrap {left:0;width:100%} } @media all and (max-width:1199px) { #mainNavi .depth2-wrap {left:0;width:100%} #mainNavi .depth2-wrap .depth2-tit {width:260px} } @media all and (max-width:999px) { body.mobile-sideMenu-open {position:fixed;width:100%;height:100%;overflow:hidden} /* 메뉴 */ #mainNavi-wrap {overflow:inherit;position:absolute;top:0;right:0;width:100%;max-width:400px;height:0 !important} #mainNavi-wrap * {outline:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)} #menu-wrap {position:fixed;right:-100%;top:0px;left:auto;width:100%;max-width:400px;height:100%;z-index:8000;background:#fff;overflow-x:hidden;padding:0;box-sizing:border-box;margin:0;transition:right .5s ease, box-shadow .5s ease} #menu-wrap.mn-h-open {right:0;box-shadow:-10px 0 15px rgba(0, 0, 0, .15)} #menu-wrap .mGnavi {display:block;position:absolute;box-sizing:border-box;width:100%;height:70px;background:#fff;font-size:0;text-align:right;left:0;top:0;padding:0 60px 0 21px;z-index:1} #menu-wrap .mGnavi:before {content:"";display:inline-block;width:0;height:100%;vertical-align:middle;} #menu-wrap .mGnavi ul {display:inline-block;vertical-align:middle;font-size:0} #menu-wrap .mGnavi ul li {display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;margin:0 20px 0 0} #menu-wrap .mGnavi ul li:last-child {padding:0;margin:0;} #menu-wrap .mGnavi ul li:last-child:after {display:none} #menu-wrap .mGnavi a {display:block;box-sizing:border-box;position:relative;padding:0;line-height:1} #menu-wrap .mGnavi a span {display:block;font-size:15px;color:#555;box-sizing:border-box;position:relative;height:21px;line-height:21px;letter-spacing:0} #menu-wrap .mGnavi .mlogo {position:absolute;left:20px;top:29px} #menu-wrap .mGnavi .home {width:120px} #menu-wrap .mGnavi .home:after {content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:100%;height:100%;background:url(/_Img/Layout/logo_bk.png) no-repeat;background-size:cover} #menu-wrap .btn-close {display:block;position:absolute;width:24px;height:24px;border:0;background:transparent;top:50%;transform:translateY(-50%);right:20px;border-radius:50%;} #menu-wrap .btn-close:before, #menu-wrap .btn-close:after {content:"";display:block;position:absolute;width:24px;height:2px;background:#444;top:0;right:0;bottom:0;left:0;margin:auto} #menu-wrap .btn-close:before {transform:rotate(45deg)} #menu-wrap .btn-close:after {transform:rotate(135deg)} #mainNavi {display:block;position:absolute;width:100%;height:100%;box-sizing:border-box;padding:80px 0 0;overflow-y:auto;z-index:0} #mainNavi .mn_li1.over:before {display:none} #mainNavi .depth1-wrap {position:relative;width:100%;height:100%;padding:0;overflow-y:auto;overflow-x:hidden} #mainNavi .depth1-ul {position:relative;padding:0 20px;z-index:1} #mainNavi .mn_li1 {position:relative;height:auto} #mainNavi .mn_li1 .tgl-btn {display:block;position:absolute;right:0;top:20px;width:12px;height:12px;border:2px solid #333;border-left:0;border-bottom:0;background-color:transparent;transform:rotate(45deg);margin:3px;transition:transform .3s ease} #mainNavi .mn_li1.has-sub.is-open .tgl-btn {border-color:#E13133;transform:rotate(135deg)} #mainNavi .mn_li1 .mn_a1 {display:block;position:relative;box-sizing:border-box;padding:0;width:100%;height:auto;border-radius:30px;letter-spacing:-.05em;z-index:300;text-align:left;font-size:0;transition:all .3s ease} #mainNavi .mn_li1 .mn_a1:before {content:"";display:inline-block;width:0;height:60px;vertical-align:middle} #mainNavi .mn_li1 .mn_a1 span {display:inline-block;line-height:1.2;font-size:22px;color:#333;vertical-align:middle;word-wrap:break-word;word-break:keep-all;white-space:normal;font-weight:600} #mainNavi .mn_li1.is-open {} #mainNavi .mn_li1 .mn_a1.over span {color:#E13133} #mainNavi .mn_li1 .mn_a1.prd-intro.over span {color:#333} #mainNavi .mn_li1.has-sub .mn_a1 {} #mainNavi .mn_li1.has-sub.is-open .mn_a1 span {color:#E13133} #mainNavi .depth2-wrap {display:none;width:100%;height:auto;box-sizing:border-box;transition:display .3s ease;padding:10px 0;box-sizing:border-box} #mainNavi .depth2-wrap .mn_li2 {position:relative} #mainNavi .is-open .depth2-wrap {} #mainNavi .depth1-wrap .mn_li1.is-close .depth2-wrap {display:none} #mainNavi .depth2-ul {position:relative;z-index:100;box-sizing:border-box} #mainNavi .depth2-wrap .mn_a2 {position:relative;display:block;border-radius:30px;background:#EFEFEF;font-size:0;padding:15px 20px 14px;text-align:left} #mainNavi .depth2-wrap .mn_a2 span {display:block;line-height:1;font-size:16px;color:#555;font-weight:500;word-wrap:break-word;word-break:keep-all;white-space:normal} #mainNavi .depth2-wrap .mn_li2 .tgl-btn {right:20px} #mainNavi .depth2-wrap .mn_li2.has-sub .mn_a2.over:after {display:none} #mainNavi .depth2-wrap .mn_a2.over, #mainNavi .depth2-wrap .is-open .mn_a2 {background:#E13133} #mainNavi .depth2-wrap .mn_a2.over span, #mainNavi .depth2-wrap .is-open .mn_a2 span {color:#fff} #mn-ctrs-btns {display:block;position:absolute;right:30px;top:25px;z-index:0} #mn-ctrs-btns .mn-ctrs-btn {position:relative;display:block;width:30px;height:20px;box-sizing:border-box;border:none;background:transparent} #mn-ctrs-btns .mn-ctrs-btn:before, #mn-ctrs-btns .mn-ctrs-btn span, #mn-ctrs-btns .mn-ctrs-btn:after {content:"";display:block;position:absolute;width:30px;height:2px;background:#fff;top:0;right:0;bottom:0;left:0;font-size:0;transition:all .3s ease} #mn-ctrs-btns .mn-ctrs-btn:before {margin:18px auto auto auto} #mn-ctrs-btns .mn-ctrs-btn span {margin:auto} #mn-ctrs-btns .mn-ctrs-btn:after {margin:auto auto 18px auto} .body-slide-wr {position:relative;width:100%;height:100%;transition:margin 0.3s ease} .body-slider-ovclick {display:block;position:fixed;width:100%;height:0;left:0;top:0;background:rgba(0, 0, 0, .5);cursor:pointer;z-index:999;opacity:0;outline:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);transition:opacity .5s ease} .body-slider-ovclick.show {height:100%;opacity:1} .body-slider-ovclick.hide {opacity:0} } @media all and (max-width:699px) { #mn-ctrs-btns {top:23px;right:20px} #mn-ctrs-btns .mn-ctrs-btn:before, #mn-ctrs-btns .mn-ctrs-btn span, #mn-ctrs-btns .mn-ctrs-btn:after {background:#444} .isMain #mn-ctrs-btns .mn-ctrs-btn:before, .isMain #mn-ctrs-btns .mn-ctrs-btn span, .isMain #mn-ctrs-btns .mn-ctrs-btn:after {background:#fff} } @media all and (max-width:399px) { #menu-wrap .mGnavi .home {width:100px} #menu-wrap .mGnavi ul li {margin:0 8px} #menu-wrap .mGnavi a span {font-size:13px} } /*-------------------------footer.css------------------------------------*/ #footer-wrap {position:relative;z-index:3000;background:#1A1A1A} #footer-wrap .ft-wr {position:relative;padding:60px 0;line-height:1.2;max-width:1480px;margin:0 auto} #footer-wrap .ftSvce {position:relative;box-sizing:border-box;padding:0 440px 0 0} #footer-wrap .top-bt {position:fixed;bottom:-150px;right:20px;width:60px;height:96px;text-align:center;border-radius:20px;overflow:hidden;background:rgba(95, 95, 95, 0.60);z-index:3500;transition:all .3s ease;visibility:hidden;box-sizing:border-box} #footer-wrap .top-bt .top-btT {width:100%;height:48px;display:block;position:relative;box-sizing:border-box} #footer-wrap .top-bt .top-btB {width:100%;height:48px;display:block;position:relative;box-sizing:border-box} #footer-wrap .top-bt .top-btT: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:26px;left:0;right:0;margin:auto;transform:rotate(45deg);-ms-transform:rotate(45deg)} #footer-wrap .top-bt .top-btB: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:6px;left:0;right:0;margin:auto;transform:rotate(-135deg);-ms-transform:rotate(-135deg)} #footer-wrap .top-bt.over {bottom:50px;visibility:visible} #footer-wrap .top-bt.end .top-btB {display:none;} #footer-wrap .top-bt.end .top-btT {height:60px} #footer-wrap .top-bt.end {height:60px} #footer-wrap .top-bt .top-btT:focus, #footer-wrap .top-bt .top-btB:focus {outline-color:red;} #footer-wrap .ftSvce .fts-fmls {position:absolute;height:100%;right:0;top:0;z-index:1} #footer-wrap .ftSvce .fts-fmls .fmlsPkg {display:block;line-height:1;font-size:0;height:100%} #footer-wrap .ftSvce .fts-fmls .fSite {} #footer-wrap .ftSvce .fts-fmls .fSite dl {display:inline-block;box-sizing:border-box;position:relative;height:100%;margin-right:14px} #footer-wrap .ftSvce .fts-fmls .fSite dl:last-child, #footer-wrap .ftSvce .fts-fmls .fSite dl:last-of-type {margin-right:0} #footer-wrap .ftSvce .fts-fmls .fSite dl dt {display:block;height:100%} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button {display:block;box-sizing:border-box;border:0;background:transparent;color:#BDBDBD;font-size:15px;border: 1px solid rgba(255, 255, 255, 0.30);border-radius:5px;padding:10px 21px;transition:all .3s ease;text-align:left} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button:before {content:"";display:inline-block;width:0;height:100%;vertical-align:middle} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button span {display:inline-block;line-height:1;font-size:15px;color:#BDBDBD;word-wrap:break-word;word-break:keep-all;white-space:normal;transition:all .3s ease} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button .arr {display:inline-block;box-sizing:border-box;margin-left:40px;transition:all .3s ease} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button .arr:after {content:"";display:block;width:11px;height:11px;background:url(/_Img/Common/fSite_arr.png) no-repeat;opacity:.6;transition:all .3s ease} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button.is-open, #footer-wrap .ftSvce .fts-fmls .fSite dl dt button:hover span {color:#fff;border-color:#fff} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button.is-open .arr:after, #footer-wrap .ftSvce .fts-fmls .fSite dl dt button:hover .arr:after {opacity:1} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button.is-open .arr:after {transform:rotate(135deg);margin:auto} #footer-wrap .ftSvce .fts-fmls .fSite dl dd {display:none;position:absolute;width:100%;left:0;bottom:100%;box-sizing:border-box;padding:10px 10px 0 0;background:#1A1A1A;border:1px solid #fff;border-bottom:0;border-radius:0 5px 0 0;box-sizing:border-box;z-index:1} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel {box-sizing:border-box;height:180px;overflow-x:hidden;overflow-y:auto;padding:0 2px 9px 18px} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel ul {display:block;box-sizing:border-box} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel ul li {display:block;box-sizing:border-box;border-bottom:1px solid rgba(255, 255, 255, .1);} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel a {display:block;color:#fff;opacity:.6;padding:10px 0;text-align:left;transition:all .3s ease} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel a:hover {opacity:1} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel a span {display:block;font-size:14px;letter-spacing:-.05em} #footer-wrap .ftSvce .fts-fmls .fSite dl dd button {display:block;position:absolute;width:26px;height:26px;left:-1px;bottom:100%;border:1px solid #fff;border-radius:5px 5px 0 0;background:#1A1A1A} #footer-wrap .ftSvce .fts-fmls .fSite dl dd button:before, #footer-wrap .ftSvce .fts-fmls .fSite dl dd button:after {content:"";display:block;position:absolute;width:12px;height:2px;background:#fff;top:0;right:0;bottom:0;left:0;margin:auto} #footer-wrap .ftSvce .fts-fmls .fSite dl dd button:before {transform:rotate(45deg);transition:transform .3s ease} #footer-wrap .ftSvce .fts-fmls .fSite dl dd button:after {transform:rotate(135deg);transition:transform .3s ease} #footer-wrap .ftSvce .fts-fmls .fSite dl dd button:hover:before {transform:rotate(135deg)} #footer-wrap .ftSvce .fts-fmls .fSite dl dd button:hover:after {transform:rotate(225deg)} #footer-wrap .ftSvce .fts-fmls a.privacy {display:block;color:#BDBDBD;font-size:15px;border: 1px solid rgba(255, 255, 255, 0.30);border-radius:5px;padding:10px 21px;margin-right:10px;transition:all .3s ease} #footer-wrap .ftSvce .fts-fmls a.privacy:hover {color:#fff;border-color:#fff} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel::-webkit-scrollbar {width:4px;} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel::-webkit-scrollbar-thumb {background-color: #999ea3;border-radius:10px;background-clip: padding-box;} #footer-wrap .ftSvce .fts-fmls .fSite dl dd .sel::-webkit-scrollbar-track {background-color:#000;border-radius:10px;} #footer-wrap .ftInfo {box-sizing:border-box;position:relative;padding:0} #footer-wrap .ftInfo .fti-logo .flogo a {display:block;width:200px} #footer-wrap .ftInfo .fti-logo .flogo a img {display:block;width:100%;height:auto} #footer-wrap .ftInfo .fti-addr {margin-top:30px;font-weight:500} #footer-wrap .ftInfo .fti-addr dl {display:block;box-sizing:border-box;position:relative;margin:0 0 8px;padding-left:125px} #footer-wrap .ftInfo .fti-addr dl:last-child {margin:0} #footer-wrap .ftInfo .fti-addr dl dt {position:absolute;left:0;top:0;font-size:16px;color:#C1C1C1} #footer-wrap .ftInfo .fti-addr dl dt:after {content:"";display:inline-block;width:1px;height:14px;background-color:rgba(255, 255, 255, 0.30);margin-left:10px;vertical-align:middle} #footer-wrap .ftInfo .fti-addr dl dd {display:inline-block;line-height:1.2;font-size:0;color:#C1C1C1;letter-spacing:-.025em;vertical-align:middle} #footer-wrap .ftInfo .fti-addr dl dd address {display:inline-block;vertical-align:top;font-size:16px;margin:0 10px 5px 0;word-wrap:break-word;word-break:keep-all;white-space:normal} #footer-wrap .ftInfo .fti-addr dl dd ul {display:inline-block;vertical-align:top} #footer-wrap .ftInfo .fti-addr dl dd ul li {display:inline-block;vertical-align:top;margin:0 15px 0 0;font-size:16px;word-wrap:break-word;word-break:keep-all;white-space:normal} #footer-wrap .ftInfo .fti-addr dl dd ul li:last-child {margin:0} #footer-wrap .ftInfo .fti-addr .support {display:inline-block;padding:5px 20px;background-color:rgba(255, 255, 255, 0.05);border-radius:5px;color:#ccc} #footer-wrap .ftInfo .fti-addr .support > span {font-size:15px} #footer-wrap .ftInfo .fti-addr .support .tit {margin-right:19px;font-weight:700} #footer-wrap .ftInfo .fti-copy {display:block;font-size:14px;letter-spacing:-.05em;line-height:1.3;color:#fff;opacity:0.45;margin:16px 0 0 2px} #footer-wrap .ftMark {position:absolute;right:0;top:100px;} #footer-wrap .ftMark ul {display:block;font-size:0;} #footer-wrap .ftMark ul li {display:inline-block;vertical-align:top;margin:0 10px 0 0} #footer-wrap .ftMark ul li:last-child {margin:0;} #footer-wrap .ftMark a {} #footer-wrap .ftMark img {} @media all and (max-width:1440px) { #footer-wrap .ft-wr {margin:0 20px} } @media all and (max-width:1099px) { #footer-wrap .ftSvce {padding:0} #footer-wrap .ftSvce:after {display:none} #footer-wrap .ftInfo {padding:0;margin:0} #footer-wrap .ftMark {top:86px} } @media all and (max-width:999px) { .mobile-sideMenu-open #footer-wrap {z-index:0} #footer-wrap .ft-wr {padding:30px 0} #footer-wrap .ftInfo .fti-addr dl {padding:00;margin:0 0 15px 0} #footer-wrap .ftInfo .fti-addr dl dt {display:block;font-size:16px;position:relative;left:auto;top:auto} #footer-wrap .ftInfo .fti-addr dl dd {font-weight:300;margin:5px 0 0} #footer-wrap .ftInfo .fti-addr dl dd address {display:block} #footer-wrap .ftInfo .fti-addr dl dd address {font-size:16px;line-height:1.4;margin:0 0 1px} #footer-wrap .ftInfo .fti-addr dl dd ul li {font-size:16px} #footer-wrap .ftInfo .fti-copy {margin:20px 0 0;letter-spacing:0} #footer-wrap .ftMark {right:auto;top:auto;position:relative;margin:20px 0 0;} #footer-wrap .ftMark ul {text-align:center;} } @media all and (max-width:699px) { #footer-wrap .ft-wr {padding:25px 0 90px} #footer-wrap .ftSvce {position:absolute;left:0;bottom:30px;width:100%;box-sizing:border-box} #footer-wrap .top-bt {width:42px;height:68px;border-radius:15px} #footer-wrap .top-bt .top-btT, #footer-wrap .top-bt .top-btB {height:34px} #footer-wrap .top-bt .top-btT:before {top:18px} #footer-wrap .top-bt .top-btB:before {top:4px} #footer-wrap .top-bt.end {height:42px} #footer-wrap .ftSvce .fts-fmls {position:static} #footer-wrap .ftSvce .fts-fmls .fSite {text-align:center} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button span {line-height:1.3} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button .arr {margin:auto auto auto 10px} #footer-wrap .ftInfo .fti-logo {display:block;position:relative;left:auto;top:auto} #footer-wrap .ftInfo .fti-logo .flogo a {width:171px;margin:0 auto} #footer-wrap .ftInfo .fti-addr {margin:15px 0 0;text-align:center} #footer-wrap .ftInfo .fti-addr dl {display:block;width:100%;padding:0;margin:0 0 15px 0} #footer-wrap .ftInfo .fti-addr dl dt {font-size:14px;padding:6px 15px} #footer-wrap .ftInfo .fti-addr dl dt:after {display:none} #footer-wrap .ftInfo .fti-addr dl dd address {font-size:13px;line-height:1.7;margin:0 0 3px} #footer-wrap .ftInfo .fti-addr dl dd ul li {font-size:13px} #footer-wrap .ftInfo .fti-copy {font-size:13px;margin:15px 0 0;line-height:1.5} #footer-wrap .ftInfo .fti-copy span {display:block} } @media all and (max-width:399px) { #footer-wrap .ft-wr {padding:25px 0 120px} #footer-wrap .ftSvce .fts-fmls .fSite dl {display:block;margin-right:0;margin-bottom:5px} #footer-wrap .ftSvce .fts-fmls .fSite dl dt button {width:100%;padding:5px 10px} #footer-wrap .ftInfo .fti-addr .support > span {font-size:12px} }