/*숨김*/ .hidden {display:none;} .blind {width:1px;height:1px;overflow:hidden;position:absolute;top:-9999em;left:-9999em;display:block;text-indent:-9999em;font-size:0px;line-height:0;} html,body {font-size:20px;font-weight:400;color:#555;line-height:28px;letter-spacing:-0.05em;} select,input,button,textarea,button{font-family:'Noto Sans KR','Malgun Gothic','맑은 고딕',Nanum Gothic,'나눔 고딕',"돋움",Dotum,Verdana,Arial,helvetica,clean,sans-serif !important;} #doc-wrap {position:relative;min-width:1300px;max-width:1920px;overflow:hidden;margin:0 auto} .div-cont {position:relative;max-width:1300px;margin:0 auto} @media all and (max-width:1699px){ #doc-wrap {min-width:320px} .div-cont {margin:0} } @media all and (max-width:680px){ .div-cont {margin:0} } @media all and (max-width:420px){ .div-cont {margin:0} } /* 스킵네비게이션 */ #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} /* 레이아웃 */ #header-wrap {position:relative;height:115px;margin:0 auto} #mcontainer-wrap {position:relative;width:100%} #container-wrap {padding-left:320px;} #container {position:relative;max-width:1300px;margin:50px auto 0 auto} #container:after {content:'';clear:both;display:block} @media all and (min-width:1000px) { #header-wrap {position:fixed;top:0;left:0;width:320px;height:100%;box-sizing:border-box;margin:0;padding-bottom:36px;background:#fff;z-index:800;border-radius:0 0 60px 0;transition:all .3s ease;} #header-wrap:before {display:block;content:'';position:absolute;top:0;left:0;width:320px;height:100%;background:#fff;/*border-radius:0 0 60px 0;*/box-shadow:0 0 40px rgba(0,0,0,0.1);z-index:-1;} #header-wrap.over {width:590px;background:#ff7746;} @media all and (max-height:860px) { #header-wrap {position:absolute;} } } @media all and (max-width:1699px) { #container {margin-left:60px;margin-right:60px;} } @media all and (max-width:1399px) { #container {margin-left:30px;margin-right:30px;} } @media all and (max-width:1299px) { #container-wrap {padding-left:250px;} #header-wrap {width:250px;} #header-wrap:before {width:250px;} #header-wrap.over {width:520px;} #container {margin-left:20px;margin-right:20px;} } @media all and (max-width:999px) { #container-wrap {padding-left:0;} #header-wrap {width:100%;} #header-wrap:before {display:none;} #header-wrap.over {width:100%;} #container {margin-left:20px;margin-right:20px;} } /* 메뉴 아래 배너 */ .head-banlist {display:none;} @media all and (min-width:1000px){ .head-banlist {display:block;width:100%;max-width:320px;padding:40px 20px 0 20px;box-sizing:border-box;} .head-banlist .banlist {display:block;width:100%;overflow:hidden; padding: 0;} .head-banlist .banlist li {float:left;width:100%; margin-top: 20px; /*font-size: 26px;*/} .head-banlist .banlist li:first-child {margin-right:2.4%;} .head-banlist .banlist li:hover { box-shadow: 0 14px 28px rgba(0,0,0,0.25), 20px 6px 20px rgba(0,0,0,0.22);} .head-banlist .banlist a { border: 1px solid #efefef; display:flex;flex-direction:column;/*align-items:left;*/justify-content:center;position:relative;height:60px;color:#000;font-size:0.941em;line-height:21px;font-weight:300;border-radius:10px;/*background:#48a5d8;*/ padding:0 5px} .head-banlist .banlist a span i { padding: 0 20px; 0 10px; font-size: 28px; } .head-banlist .banlist a span {display:block;font-weight:500;/*text-align:center;*/} .head-banlist .banlist a:before {display:block;content:'';position:absolute;bottom:0;left:4px;width:41px;height:60px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat -59px -157px;} /*.head-banlist .banlist li:first-child a {background:#f86518;}*/ .head-banlist .banlist li:first-child a:before {left:auto;right:20px;background-position:0 -157px;} .head-banlist .banlist a:hover {text-decoration:underline;} .head-banlist .hsnslist {display:block;width:100%;overflow:hidden;text-align:center;padding-top:17px; padding: 0;} .head-banlist .hsnslist li {display:inline-block;padding:0 2px;vertical-align:text-top;} .head-banlist .hsnslist a {display:block;position:relative;width:40px;height:40px;background:#f2f2f2;border-radius:50%;transition:all .3s ease;} .head-banlist .hsnslist a:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:40px;height:40px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat -71px 0;transition:all .3s ease;} .head-banlist .hsnslist li:nth-child(2) a:before {background-position:-118px 0;} .head-banlist .hsnslist li:nth-child(3) a:before {background-position:-449px 0;} .head-banlist .hsnslist li:nth-child(4) a:before {background-position:-165px 0;} .head-banlist .hsnslist li:nth-child(5) a:before {background-position:-212px 0;} .head-banlist .hsnslist li:nth-child(5) a {transition:none;} .head-banlist .hsnslist li:nth-child(1) a:hover {background:#1a4398;} .head-banlist .hsnslist li:nth-child(2) a:hover {background:#e43338;} .head-banlist .hsnslist li:nth-child(3) a:hover {background:#fae300;} .head-banlist .hsnslist li:nth-child(4) a:hover {background:#2fb301;} .head-banlist .hsnslist li:nth-child(5) a:hover {background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat -212px -154px;} .head-banlist .hsnslist li:nth-child(1) a:hover:before {background-position:-71px -50px;} .head-banlist .hsnslist li:nth-child(2) a:hover:before {background-position:-118px -50px;} .head-banlist .hsnslist li:nth-child(3) a:hover:before {background-position:-449px -50px;} .head-banlist .hsnslist li:nth-child(4) a:hover:before {background-position:-165px -50px;} .head-banlist .hsnslist li:nth-child(5) a:hover:before {background-position:-212px -50px;} #mPopup {padding-top:11px;} #mPopup .owl-stage-outer {border-radius:10px;overflow:hidden;} #mPopup .datalist .item {display:block;position:relative;box-sizing:border-box;height:0;padding:0 0 46.43%;background:#eee;} #mPopup .datalist .item.no-data {} #mPopup .datalist .item.no-data p {display:block;width:100%;height:100%;position:absolute;background:url(/resources/_Img/Board/default/ico_nodata.png) no-repeat center 30px;background-size:50px auto;text-align:center;padding:80px 0 0;font-size:15px;} #mPopup .ctrlnums-wrap {display:block;overflow:hidden;font-size:0;text-align:center;height:20px;padding-top:2px;} #mPopup .ctrlnums-wrap button {display:inline-block;position:relative;width:15px;height:15px;border:0;background:transparent;overflow:hidden;font-size:0;letter-spacing:-.9999em;line-height:9999;} #mPopup .ctrlnums-wrap button:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;transition:all 3s ease} #mPopup .ctrlnums-wrap .owl-prev, #mPopup .ctrlnums-wrap .owl-next {display:none;} #mPopup .ctrlnums-wrap .btn-stop:before {width:3px;height:10px;border-left:2px solid #8e8e8e;border-right:2px solid #8e8e8e;} #mPopup .ctrlnums-wrap .btn-play:before {width:0;height:0;border:5px solid transparent;border-left:5px solid #8e8e8e;margin-left:5px} #mPopup .ctrlnums-wrap .btn-play {display:none} #mPopup .ctrl-nums .owl-dot:before {width:8px;height:8px;background:#c5c5c5;border-radius:50%;transition:all .3s ease;} #mPopup .ctrl-nums .owl-dot.active:before {background:#1346a1;} } @media all and (min-width:1000px) and (max-width:1299px) { .head-banlist {max-width:250px;padding-left:10px;padding-right:10px;} .head-banlist .hsnslist li { padding:0 1px;} } /* cont-navi */ #cont-navi {display:block;position:absolute;width:1300px;left:50%;bottom:0;margin:0 0 0 -650px;height:70px;background:rgba(0,0,0,0.4);z-index:11;} #cont-navi .div-cont {position:relative;height:100%} #cont-navi .div-cont:after {content:"";display:block;clear:both} #cont-navi .home {display:block;float:left;position:relative;z-index:1;width:70px;height:100%;background:#f86518;} #cont-navi .home:before {content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:21px;height:19px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 -68px;transition:all .3s ease;z-index:2;} #cont-navi dl {float:left;position:relative;z-index:5;min-width:321px;max-width:321px;width:auto;height:100%;} #cont-navi dt {display:block;height:100%} #cont-navi dt a {display:block;position:relative;height:100%;padding:0 55px 0 30px;font-size:0;border-right:1px solid rgba(255,255,255,0.2);} #cont-navi dt a:before {content:"";display:block;position:absolute;top:22px;right:30px;width:26px;height:26px;background:rgba(0,0,0,0.4);border-radius:50%;transition:all .3s ease} #cont-navi dt a:after {content:"";display:block;position:absolute;right:40px;top:30px;width:6px;height:6px;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg);transition:all .3s ease} #cont-navi dt a .txt {display:flex;align-items:center;position:relative;font-size:17px;color:#fff;padding:0;max-width:95%;height:100%;vertical-align:middle;transition:all .3s ease} #cont-navi dt a:hover:before {background:#f86518;} #cont-navi .on dt a:before {background:#f86518;} #cont-navi .on dt a:after {top:32px;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:rotate(-135deg);transition:all .3s ease} #cont-navi .sub-list {position:absolute;top:100%;left:0;background:#f2f2f2;width:100%;display:none;max-height:350px;} #cont-navi .sub-list ul {display:block;margin:0;} #cont-navi .sub-list .mn_a1 {position:relative;display:block;font-size:17px;color:#444444;padding:0 30px 0 30px;transition:all .3s ease} #cont-navi .sub-list .mn_a1 span {position:relative;display:block;font-size:17px;color:#444444;padding:20px 0 21px 0;border-bottom:1px solid #ddd;transition:all .3s ease} #cont-navi .sub-list li:last-child .mn_a1 span {border-bottom:0} #cont-navi .sub-list .mn_a1 span:before {content:"";display:block;position:absolute;top:22px;right:0;width:26px;height:26px;background:rgba(0,0,0,0.3);border-radius:50%;opacity:0;transition:all .3s ease} #cont-navi .sub-list .mn_a1 span:after {content:"";display:block;position:absolute;right:10px;top:30px;width:6px;height:6px;border-bottom:2px solid #a2a2a2;border-right:2px solid #a2a2a2;transform:rotate(-45deg);transition:all .3s ease} #cont-navi .sub-list .mn_a1[target=_blank] span:after {/*display:inline-block;content:"";width:12px;height:10px;vertical-align:middle;margin:0 0 1px 10px;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -157px -30px*/} #cont-navi .sub-list li.isOver a, #cont-navi .sub-list .isOver .mn_a1:hover, #cont-navi .sub-list .mn_a1:hover {background:#ff7746;} #cont-navi .sub-list li.isOver a span, #cont-navi .sub-list .isOver .mn_a1:hover span, #cont-navi .sub-list .mn_a1:hover span {color:#fff;border-color:#ff7746;} #cont-navi .sub-list li.isOver a span:before, #cont-navi .sub-list .isOver .mn_a1:hover span:before, #cont-navi .sub-list .mn_a1:hover span:before {opacity:1;} #cont-navi .sub-list li.isOver a span:after, #cont-navi .sub-list .isOver .mn_a1:hover span:after, #cont-navi .sub-list .mn_a1:hover span:after {border-color:#fff;} .cont-top .cont-ctrl-btns {position:absolute;right:0;top:0;height:50px;font-size:0} .cont-top .cont-ctrl-btns:after {content:"";display:block;clear:both} .cont-top .cont-ctrl-btns > button {position:relative;width:50px;height:50px;border:0;background:#f2f2f2;border-radius:50%;overflow:hidden;} .cont-top .cont-ctrl-btns > button:before {content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:50px;height:50px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat;z-index:2;transition:all .3s ease;} .cont-top .cont-ctrl-btns .btn-share {margin-left:9px;} .cont-top .cont-ctrl-btns .btn-share:before {background-position:-331px 0} .cont-top .cont-ctrl-btns .btn-share.is-open:after {opacity:.1} .cont-top .cont-ctrl-btns .btn-print:before {background-position:-272px 0} .cont-top .cont-ctrl-btns .btn-print:focus, .cont-top .cont-ctrl-btns .btn-print:hover {background:#3e9da6;} .cont-top .cont-ctrl-btns .btn-share:focus, .cont-top .cont-ctrl-btns .btn-share:hover, .cont-top .cont-ctrl-btns .btn-share.is-open {background:#ff7746;} .cont-top .cont-ctrl-btns .btn-print:focus:before, .cont-top .cont-ctrl-btns .btn-print:hover:before {background-position:-272px -57px} .cont-top .cont-ctrl-btns .btn-share:focus:before, .cont-top .cont-ctrl-btns .btn-share:hover:before, .cont-top .cont-ctrl-btns .btn-share.is-open:before {background-position:-331px -57px} .cont-top .cont-ctrl-btns .sns-list {display:none;position:absolute;top:100%;right:0;z-index:100;width:auto;font-size:0;white-space:nowrap;box-sizing:border-box;border:0;} .cont-top .cont-ctrl-btns .sns-list button {display:block;box-sizing:border-box;border:0;position:relative;background:#e6e6e6;width:50px;height:50px;font-size:0;border-radius:50%;margin-top:2px;} .cont-top .cont-ctrl-btns .sns-list button:before {content:"";display:block;position:absolute;width:50px;height:50px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat;top:0;right:0;bottom:0;left:0;margin:auto;transition:all .3s ease} .cont-top .cont-ctrl-btns .sns-list .btn-fb:before {background-position:-392px 0px} .cont-top .cont-ctrl-btns .sns-list .btn-yt:before {background-position:-392px -52px} .cont-top .cont-ctrl-btns .sns-list .btn-nb:before {background-position:-392px -104px} .cont-top .cont-ctrl-btns .sns-list .btn-in:before {background-position:-392px -156px} @media all and (max-width:1699px) { #cont-navi {width: calc(100% - 120px);left:60px;margin:0;} } @media all and (max-width:1599px) { #cont-navi dl {min-width:250px;max-width:250px;} } @media all and (max-width:1399px) { #cont-navi {width: calc(100% - 60px);left:30px;} } @media all and (max-width:1299px) { #cont-navi {width: calc(100% - 40px);left:20px;} #cont-navi dl {min-width:200px;max-width:200px;} } @media all and (max-width:999px) { #cont-navi {display:none} .cont-top .cont-ctrl-btns {top:10px;} .cont-top .cont-ctrl-btns > button {transform:scale(0.8);} .cont-top .cont-ctrl-btns .btn-share {margin-left:-3px;} .cont-top .cont-ctrl-btns .sns-list button {transform:scale(0.8);margin-top:-3px;} } /* contents */ @media only screen and (min-width:1300px) { #contents {width:100%;min-height:600px;word-break:keep-all;word-wrap:break-word} } #contents .cont-top {position:relative;margin-bottom:54px;} #contents .cont-top .cont-tit {font-size:2.118em;color:#191919;font-weight:700;text-align:left;line-height:1;} #contents #cont {padding:0 0 50px 0;font-size:17px;font-weight:400;color:#555;line-height:28px;/*letter-spacing:-0.05em;*/word-break:keep-all;word-wrap:break-word;min-height:400px} #contents #cont:after {clear:both;content:"";display:block} @media all and (max-width:999px){ #container {margin-top:0;z-index:1} #contents {width:auto;max-width:100%;float:none} #contents #cont {font-size:16px;min-height:600px} #header-wrap {padding-left:0;height:auto} #contents .cont-top {margin-bottom:25px;} #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:799px) { #contents #cont {padding-bottom:40px;line-height:24px} } @media all and (max-width:768px){ } @media all and (max-width:599px){ #contents #cont {padding-bottom:30px;font-size:14px;line-height:22px} } /* 멀티팝업 */ #toppop {position:absolute;left:0;top:0;width:100%;height:0;overflow:hidden;z-index:3001;background:rgba(18, 18, 18, .8);padding-left:320px;box-sizing:border-box;opacity:0;transition:opacity .5s ease} #toppop:after {content:"";display:block;position:absolute;width:100%;height:100%;left:0;top:0;box-sizing:border-box;border:5px solid rgba(59, 153, 252, .5);opacity:0;z-index:0;transition:all .3s ease} #toppop:focus:after {opacity:1} #toppop.show {height:auto;opacity:1} #toppop.hide {opacity:0} #toppop .tp-role-Pkg {width:auto;max-width:1350px;margin:0 auto;padding:146px 0 109px;position:relative;z-index:1} #toppop .tp-role-head {text-align:left;line-height:1;color:#fff;} #toppop .tp-role-head .korName {display:inline-block;font-size:40px;font-weight:700;} #toppop .tp-role-body {margin:49px 0 0} #toppop .tp-role-body .datalist .item {max-width:252px;width:100%;height:240px;margin:0 auto;background:transparent;position:relative;} #toppop .tp-role-body .datalist .item a {position:relative; display:block} #toppop .tp-role-body .datalist .item .comm {display:none} #toppop .tp-role-body .datalist .item .btn-more {display:block;position:absolute;left:50%;bottom:0; background:#505050; text-align:center; line-height:40px;min-width:107px; font-size:14px; color:#fff;letter-spacing:-.05em; transform:translateX(-50%);-ms-transform:translateX(-50%);} #toppop .tp-role-body .datalist .owl-stage-outer {z-index:0} #toppop .tp-role-body .datalist .owl-nav {z-index:1;display:block;text-align:center;margin-top:42px;} #toppop .tp-role-body .datalist .owl-nav button {display:inline-block;position:relative;width:54px;height:54px;border:2px solid #fff;border-radius:50%;background:transparent;font-size:0;margin:0;} #toppop .tp-role-body .datalist .owl-nav button:after {content:"";display:block;position:absolute;width:16px;height:16px;border:solid;border-width:0 0 2px 2px;border-color:transparent transparent #fff #fff;top:0;right:0;bottom:0;left:0;margin:auto;background:none;} #toppop .tp-role-body .datalist .owl-nav button:before {background:none;} #toppop .tp-role-body .datalist .owl-nav .owl-prev:after {transform:rotate(45deg)} #toppop .tp-role-body .datalist .owl-nav .owl-next:after {transform:rotate(225deg)} #toppop .tp-role-body .dataCtrlPkg {text-align:center;font-size:0;box-sizing:border-box;position:absolute;top:151px;right:0;} #toppop .tp-role-body .dataCtrlPkg .datactrl {display:inline-block;font-size:0;display:none} #toppop .tp-role-body .dataCtrlPkg .datactrl > div {display:inline-block;vertical-align:middle} #toppop .tp-role-body .dataCtrlPkg .datactrl button {width:28px;height:28px;box-sizing:border-box;position:relative;border:0;background:transparent} #toppop .tp-role-body .dataCtrlPkg .datactrl button:after {content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;box-sizing:border-box;transition:all .3s ease} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataDots button {display:inline-block;vertical-align:top} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataDots button:after {width:10px;height:10px;border-radius:50%;background:rgba(255, 255, 255, .4)} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataDots button.active:after {background:#fff} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataDots.disabled {display:none} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataDots.disabled + .dataAuto {display:none} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataAuto .btn-stop:after {width:10px;height:12px;border:solid;border-width:0 3px 0 3px;border-color:transparent #fff transparent #fff} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataAuto .btn-play {display:none} #toppop .tp-role-body .dataCtrlPkg .datactrl .dataAuto .btn-play:after {width:0;height:0;border:solid;border-width:6px 0 6px 8px;border-color:transparent transparent transparent #fff} #toppop .tp-role-body .dataCtrlPkg .dataMore {display:block;line-height:1;} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks {display:inline-block;position:relative;} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks input {width:1px;height:1px;overflow:hidden;position:absolute;top:-9999em;left:-9999em;display:block;text-indent:-9999em;font-size:0px;line-height:0;opacity:0} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks label {display:block;line-height:1;box-sizing:border-box;position:relative;font-size:16px;color:#fff;letter-spacing:-.05em;padding:0 33px 0 53px;cursor:pointer;height:50px;line-height:46px;border:2px solid #fff;border-radius:25px;} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks input:focus + label {outline:3px solid rgba(59, 153, 252, .5)} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks label:before, #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks label:after {content:"";display:block;position:absolute;box-sizing:border-box;transition:all .3s ease} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks label:before {left:30px;top:50%;margin-top:-6px;width:12px;height:12px;z-index:1;background:#fff;border-radius:50%;opacity:1;} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks input:checked + label:before {left:32px;top:50%;margin-top:-6px;width:7px;height:10px;background:none;border-radius:0;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg);} #toppop .tp-role-body .dataCtrlPkg .dataMore .close-btn {display:inline-block;width:120px;height:50px;border:0;background:#fff;box-sizing:border-box;border-radius:25px;margin-left:20px;} #toppop .tp-role-body .dataCtrlPkg .dataMore .close-btn span {display:inline-block;position:relative;font-size:16px;color:#333;padding-right:32px} #toppop .tp-role-body .dataCtrlPkg .dataMore .close-btn span:before {content:"";display:block;position:absolute;top:50%;right:0;margin-top:-5px;width:10px;height:10px;background:#333333;} @media all and (max-width:1699px) { #toppop .tp-role-Pkg {margin:0 40px} } @media all and (max-width:1299px) { #toppop {padding-left:250px;} #toppop .tp-role-Pkg {padding:80px 0 80px} #toppop .tp-role-body {margin:40px 0 0;} #toppop .tp-role-body .dataCtrlPkg {top:80px;} } @media all and (max-width:999px) { #toppop {top:0;position:fixed;padding-left:0;} #toppop.show {height:100%} #toppop .tp-role-Pkg {padding:40px 0;height:100%} #toppop .tp-role-body {height:100%} #toppop .tp-role-head .korName {font-size:30px;} #toppop .tp-role-body .dataCtrlPkg {top:40px;} #toppop .tp-role-body .datalist .item .wpTmplMsg .bTit {font-size:15px;padding:0 20px;} #toppop .tp-role-body .datalist .item .wpTmplMsg .sTit {font-size:17px;padding:0 20px;} #toppop .tp-role-body .datalist .item .wpTmplMsg .sTxt {font-size:19px;padding:0 20px;height:44px;} #toppop .tp-role-body .datalist .owl-nav {margin-top:20px;} #toppop .tp-role-body .datalist .owl-nav button {width:36px;height:36px;} #toppop .tp-role-body .datalist .owl-nav button:after {width:10px;height:10px;} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks label {font-size:14px;padding:0 20px 0 40px;height:40px;line-height:36px;} #toppop .tp-role-body .dataCtrlPkg .dataMore .todayChks label:before {width:8px;height:8px;left:20px;margin-top:-4px;} #toppop .tp-role-body .dataCtrlPkg .dataMore .close-btn {width:90px;height:40px;margin-left:10px;} #toppop .tp-role-body .dataCtrlPkg .dataMore .close-btn span {font-size:14px;padding-right:20px} #toppop .tp-role-body .dataCtrlPkg .dataMore .close-btn span:before {margin-top:-3px;width:8px;height:8px;} } @media all and (max-width:599px) { #toppop .tp-role-Pkg {padding:20px 0;} #toppop .tp-role-head {text-align:center;width:100%;} #toppop .tp-role-body {height:auto;margin:20px 0 0} #toppop .tp-role-body .dataCtrlPkg {position:relative;top:auto;right:auto;margin-top:30px;} } @media all and (max-width:499px) { /*#toppop .tp-role-body .datalist .item {max-width:300px;width:100%}*/ } @media all and (max-height:560px) { #toppop.show {height:100%;overflow-x:hidden;overflow-y:auto} #toppop .tp-role-Pkg {height:auto;padding:20px 0} #toppop .tp-role-head {position:relative;left:auto;top:auto;margin:0} #toppop .tp-role-body {height:auto;margin:20px 0 0} #toppop .tp-role-body .datalist {position:relative;left:auto;top:auto;transform:none} #toppop .tp-role-body .dataCtrlPkg {position:relative;left:auto;bottom:auto;margin:20px 0 0} } /*-------------------------gnavi_ipsi.css------------------------------------*/ /* global */ #global {position:relative;width:auto;max-width:246px;height:70px;z-index:700;font-size:13px;margin:0 37px;} #global:after {content:"";display:block;clear:both} #global .glnk-sec {display:block;/*float:left*/ position:absolute; top:17px; left:45px;} #global .glnk-sec a {display:block;float:left;color:#513d3b;box-sizing:border-box;position:relative} #global .glnk-sec a:after {content:"";display:block;position:absolute;width:1px;height:14px;right:0;top:50%;margin:-7px 0 0;background:#e5e5e5} #global .glnk-sec a:last-child:after {display:none} #global .glnk-sec a span {display:block;padding:14px 13px 15px;line-height:1.2;box-sizing:border-box;position:relative;letter-spacing:-.05em;font-weight:500} #global .glnk-sec .whome { } #global .glnk-sec .whome span {padding-left:0} #global .glnk-sec a:focus span, #global .glnk-sec a:hover span {text-decoration:underline} #global .srvc-sec {display:block;float:right;z-index:2200} #global .srvc-sec .srvcLink {position:absolute;top:21px;right:39px;z-index:2} #global .srvc-sec .srvcLink > a.login {display:block;float:left;width:36px;height:38px;} #global .srvc-sec .srvcLink > a.login:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:17px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 0px;} #global .srvc-sec .srvcLink > a.login span {font-size:0;color:transparent;display:inline-block;width:0;height:0;overflow:hidden;} #global .srvc-sec .srvcLink > a.logout {display:block;float:left;width:36px;height:38px;} #global .srvc-sec .srvcLink > a.logout:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:17px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 0px;} #global .srvc-sec .srvcLink > a.logout span {font-size:0;color:transparent;display:inline-block;width:0;height:0;overflow:hidden;} #global .srvc-sec .srvcLink > a.langE {} #global .srvc-sec .srvcLink > a.langE span {padding:14px 0 15px 30px;letter-spacing:0} #global .srvc-sec .srvcLink > a.langE span:before {content:"";display:block;position:absolute;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat;width:14px;height:14px;background-position:-35px 0px;left:11px;top:15px} #global .srvc-sec .srvcLink > a.langE:after {display:none} #global .srvc-sec .srvcLink > a.link3 span {letter-spacing:0} #global .srvc-sec .srvcLink .gsel-lang {display:block;float:left;box-sizing:border-box;position:relative;height:31px;display:none} #global .srvc-sec .srvcLink .gsel-lang dl {height:100%;overflow:hidden;transition:all .3s ease} #global .srvc-sec .srvcLink .gsel-lang dt a {position:relative;display:block;height:auto;font-size:13px;height:31px} #global .srvc-sec .srvcLink .gsel-lang dt a span {display:block;padding:8px 30px 8px 30px;line-height:1.2;box-sizing:border-box;position:relative;letter-spacing:0} #global .srvc-sec .srvcLink .gsel-lang dt a span:before, #global .srvc-sec .srvcLink .gsel-lang dt a span:after {content:"";display:block;position:absolute;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat;transition:all .3s ease} #global .srvc-sec .srvcLink .gsel-lang dt a span:before {width:14px;height:14px;background-position:-35px 0px;left:11px;top:8px} #global .srvc-sec .srvcLink .gsel-lang dt a span:after {width:9px;height:6px;background-position:-59px -0px;right:0;top:14px} #global .srvc-sec .srvcLink .gsel-lang dd {display:block;position:relative} #global .srvc-sec .srvcLink .gsel-lang dd:before {content:"";display:block;position:absolute;width:7px;height:0;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -113px 0px;left:50%;bottom:100%;margin:0 0 0 -3px;transition:all .2s ease} #global .srvc-sec .srvcLink .gsel-lang dd ul {display:block;width:100%;background:#706160} #global .srvc-sec .srvcLink .gsel-lang dd li {display:block;box-sizing:border-box;border-bottom:1px solid rgba(255, 255, 255, .4)} #global .srvc-sec .srvcLink .gsel-lang dd li:last-child {border-bottom:0} #global .srvc-sec .srvcLink .gsel-lang dd a {display:block;padding:12px 0 13px;font-size:14px;text-align:center} #global .srvc-sec .srvcLink .gsel-lang dd a span {color:#b9a5a3;letter-spacing:0;transition:all .3s ease} #global .srvc-sec .srvcLink .gsel-lang dd a:hover span, #global .srvc-sec .srvcLink .gsel-lang dd a:focus span, #global .srvc-sec .srvcLink .gsel-lang dd a:active span {color:#fff} #global .srvc-sec .srvcLink .gsel-lang dl[isopen='1'] dt a span:after {transform:rotate(180deg)} #global .srvc-sec .srvcLink .gsel-lang dl[isopen='1'] dd:before {height:5px} #global .srvc-sec .srvcUtil {display:block;position:absolute;left:0;top:0;width:100%;z-index:1;transition:margin .3s ease} #global .srvc-sec .srvcUtil .toppop-ctrl {position:absolute;top:21px;right:0;} #global .srvc-sec .srvcUtil .toppop-ctrl button {position:relative;width:39px;height:38px;border:0;background:none;} #global .srvc-sec .srvcUtil .toppop-ctrl button:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:17px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat -24px 0px;} #global .srvc-sec .srvcUtil .toppop-ctrl button:after {display:block;content:'';position:absolute;top:9px;right:3px;width:4px;height:4px;background:#ea5405;border-radius:50%;} #global .srvc-sec .srvcUtil .toppop-ctrl button .txt {position:absolute;top:12px;left: calc(100% + 5px);width:69px;height:23px;font-size:12px;color:#fff;font-weight:300;background:#33455b;border-radius:2px;text-align:center;line-height:23px;opacity:0;transition:all .3s ease;} #global .srvc-sec .srvcUtil .toppop-ctrl button .txt:before {display:block;content:'';position:absolute;top:6px;left:-10px;width:0;height:0;border:5px solid transparent;border-right:5px solid #33455b;} #global .srvc-sec .srvcUtil .toppop-ctrl button:hover .txt {top:8px;opacity:1;} #global .srvc-sec .srvcUtil .amenu {position:absolute;top:30px;left:0;width:27px;height:16px;background:none;box-sizing:border-box;border-top:2px solid #212121;border-bottom:2px solid #212121;transition:all .3s ease;} #global .srvc-sec .srvcUtil .amenu span {font-size:0;color:transparent;display:inline-block;width:0;height:0;overflow:hidden;} #global .srvc-sec .srvcUtil .amenu:before {display:block;content:'';position:absolute;top:50%;left:0;margin-top:-1px;width:100%;height:2px;background:#212121;transition:all .3s ease;} #global .srvc-sec .srvcUtil .amenu:hover {border-color:#f86518;} #global .srvc-sec .srvcUtil .amenu:hover:before {background:#f86518;width:50%;} #global .srvc-sec .srvcUtil a:focus:before, #global .srvc-sec .srvcUtil a:hover:before, #global .srvc-sec .srvcUtil button:focus:before, #global .srvc-sec .srvcUtil button:hover:before {opacity:1} #global .srvc-sec .srvcUtil .userGuide {display:none;position:relative;background:#513d3b;} #global .srvc-sec .srvcUtil .userGuide:before {} #global .srvc-sec .srvcUtil .userGuide:after {background-position:-623px -125px} @media all and (max-width:1299px) { #global {margin:0 20px;max-width:210px;} } @media all and (max-width:999px) { #global {height:0; max-width:initial; } #global .glnk-sec {left:auto; right:0;display:none;} #global .srvc-sec .srvcUtil {margin:-4px 0 0;padding:0 49px 0 0;width:auto;left:auto;right:55px;} #global .srvc-sec .srvcUtil .toppop-ctrl button .txt {left:auto;right: calc(100% + 5px);} #global .srvc-sec .srvcUtil .toppop-ctrl button .txt:before {top:6px;left:auto;right:-10px;border:5px solid transparent;border-left:5px solid #33455b;} #global .srvc-sec .srvcUtil .toppop-ctrl button:hover .txt {top:8px;} #global .srvc-sec .srvcUtil a:before, #global .srvc-sec .srvcUtil button:before {display:none} #global .srvc-sec .srvcUtil .amenu {display:none} #global .srvc-sec .srvcUtil .userGuide {display:none} } @media all and (max-width:399px) { #global {margin:0} #global .glnk-sec {left:auto; right:50px; top:14px;} } /*-------------------------logo_ipsi.css------------------------------------*/ /* logo */ #header {display:block;position:relative;padding:0 37px;} #header .logo { width: 244px; padding-top: 10px; display:inline-block;height:auto;z-index:501;font-size:0;line-height:24px;} #header .logo a, #header .logo a span {display:block; text-align: center;} #header .logo a span em {position:relative;display:inline-block;font-size:23px;font-style:normal;font-weight:700;margin-top:20px;color:#000000;vertical-align:middle;} /*#header .logo a span em:before {display:block;content:'';position:absolute;top:3px;left:-34px;width:1px;height:22px;background:#dcdcdc;}*/ @media all and (max-width:1299px) { .logo a span { width: 203px; display: block; text-align: center; } #header {padding:0 20px;} #header .logo a span em { font-size: 20px;} #header .logo a span em:before {left:-9px;} } @media all and (max-width:999px) { #header {height:70px} #header .logo {padding-left:45px;padding-top:22px;} } @media all and (max-width:599px) { } @media all and (max-width:399px) { #header .logo {padding-left:38px;} } /*-------------------------header_ipsi.css------------------------------------*/ /* header */ /* 통합검색 */ #mnavi-search {position:relative;width:100%;max-width:246px;z-index:501;margin-top:28px;} #mnavi-search button {border:0;width:40px;background:#ff7746} #mnavi-search button:before {display:block;content:"";width:20px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 -34px;position:absolute;top:0;left:0;bottom:0;right:0;margin:auto} #mnavi-search .search-box input[type='text'] {width:100%;color:#243045;font-size:14px;height:39px;line-height:39px;box-sizing:border-box;margin:0;background:#fff;border:2px solid #ff7746;border-radius:20px;box-sizing:border-box;padding:0 50px 0 21px;} #mnavi-search .search-box input[type='text']::placeholder {color:#666666;opacity:0.6;font-size:14px;} #mnavi-search .search-box .btn-search {width:40px;height:100%;position:absolute;top:0;right:0;background:#ff7746;border-radius:0 20px 20px 0;} #mnavi-search .mbtn-sch {display:none;} @media all and (min-width:1000px) and (max-width:1299px) { #mnavi-search {max-width:210px;} } @media all and (max-width:999px){ #mnavi-search {position:absolute;margin:0;left:auto;right:0;top:17px;width:100%;z-index:1001} #mnavi-search .mbtn-sch {display:block;position:absolute;top:0;right:20px;width:36px;height:36px;border-radius:50%;background:#ff7746;} #mnavi-search .mbtn-sch:before {display:block;content:"";width:20px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 -34px;position:absolute;top:0;left:0;bottom:0;right:0;margin:auto} #mnavi-search .search-box {display:none;position:absolute;top:0;left:0;transform:translateY(-100%);-ms-transform:translateY(-100%);width:100%;background:rgba(255,255,255, .85);box-sizing:border-box;border-top:1px solid #ddd;padding:15px 20px} #mnavi-search .search-box.on {display:block;transform:translateY(35px);-ms-transform:translateY(35px);} #mnavi-search .search-box input[type='text'] {width:100%} #mnavi-search .search-box .btn-search {left:35px} } #menu-wrap .mGnavi {display:none} /* 메뉴 */ #menu-wrap {display:inline-block;position:relative;width:100%;max-width:1400px;margin-left:0;padding-right:0;background:#fff;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} /* 주메뉴 */ @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:relative;left:auto;top:auto;width:246px;height:324px;min-height:285px;padding-top:6px;z-index:500;} #mainNavi {width:246px;height:auto} #mainNavi .depth1-ul {overflow:hidden;text-align:center} #mainNavi > ul > li:first-child {padding-left:8px} #mainNavi .mn_li1 {display:block;text-align:left;} #mainNavi .mn_a1 {position:relative;display:block;font-size:18px;font-weight:700;color:#444444;padding:15px 0 13px;letter-spacing:-.05em;border-bottom:1px solid #e8e8e8;transition:padding .3s ease} #mainNavi .mn_a1:after {display:block;content:'';position:absolute;right:3px;top:24px;width:9px;height:9px;border-bottom:2px solid #646464;border-right:2px solid #646464;transform:rotate(-45deg);opacity:0.6;transition:all .3s ease} #mainNavi .mn_li1 .mn_a1:hover, #mainNavi .mn_li1 .mn_a1:hover span, #mainNavi .mn_li1.over .mn_a1 span {color:#f86518} #mainNavi .mn_a1:hover:after, #mainNavi .mn_a1:focus:after, #mainNavi .mn_li1.over .mn_a1:after {border-color:#f86518;} #mainNavi .depth2-wrap {display:none;position:absolute;top:0;left:283px;z-index:1000;width:270px;padding:0 0 0 0;text-align:left;font-weight:normal;box-sizing:border-box;} #mainNavi .depth2-wrap .depth1-tit {display:none;} #mainNavi .depth2-wrap .depth2-ul {display:block;width:100%;position:relative;font-size:0;overflow:hidden;box-sizing:border-box;padding:0 30px 0 40px;} #mainNavi .depth2-wrap .mn_li2 {display:block;vertical-align:top;box-sizing:border-box;position:relative;} #mainNavi .depth2-wrap .mn_a2 {display:block;width:auto;height:auto;position:relative;box-sizing:border-box;padding:20px 0 6px 0;border-bottom:1px solid rgba(232,232,232,0.15);} #mainNavi .depth2-wrap .mn_a2:before {content:"";display:block;position:absolute;width:0;height:0;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -50px -137px;right:100%;bottom:17px;margin:0 2px 0 0;transition:all .3s ease} #mainNavi .depth2-wrap .mn_a2 span {display:inline-block;position:relative;font-size:16px;color:#fff;font-weight:500;letter-spacing:-.05em;line-height:1.2;transition:all .3s ease} #mainNavi .depth2-wrap .mn_a2:focus span, #mainNavi .depth2-wrap .mn_a2:hover span, #mainNavi .depth2-wrap .over .mn_a2 span {color:#1c1c1c} #mainNavi .depth3-wrap {display:none;} #mainNavi .depth3-wrap .depth3-ul {display:block;box-sizing:border-box;position:relative;padding:10px 15px;background:rgba(0,0,0,0.2);line-height:1.2;} #mainNavi .depth3-wrap .mn_li3 {display:block;} #mainNavi .depth3-wrap .mn_a3 {position:relative;display:block;padding:7px 0 7px 17px;} #mainNavi .depth3-wrap .mn_a3:before {display:block;content:'';position:absolute;left:0;top:13px;width:3px;height:3px;background:#ffffff} #mainNavi .depth3-wrap .mn_a3 span {display:inline-block;position:relative;font-weight:300;font-size:14px;color:#ffd7c9;letter-spacing:-.05em;transition:all .3s ease} #mainNavi .depth3-wrap .over.mn_a3 span, #mainNavi .depth3-wrap .mn_a3.over span, #mainNavi .depth3-wrap .mn_a3:hover span, #mainNavi .depth3-wrap .mn_a3:focus span {color:#fff;text-decoration:underline;} #mainNavi .depth1-wrap .depth1-ul > li:last-child .depth2-wrap {top:-100px;} #mainNavi .mn_a1[target=_blank] span:after {display:inline-block;content:"";width:13px;height:13px;vertical-align:middle;margin:-4px 0 0px 10px;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -111px -30px} #mainNavi .mn_a1[target=_blank]:focus span:after, #mainNavi .mn_a1[target=_blank]:hover span:after {background-position:-134px -30px} #mainNavi .mn_a2[target=_blank] span:after {display:inline-block;content:"";width:12px;height:10px;vertical-align:middle;margin:0 0 4px 10px;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -157px -30px} #mainNavi .mn_a2[target=_blank]:focus span:after, #mainNavi .mn_a2[target=_blank]:hover span:after {background-position:-179px -30px} #mainNavi .mn_a3[target=_blank] span:after {display:inline-block;content:"";width:12px;height:10px;vertical-align:middle;margin:0 0 4px 10px;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -157px -30px} #mainNavi .mn_a3[target=_blank]:focus span:after, #mainNavi .mn_a3[target=_blank]:hover span:after {background-position:-179px -30px} #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;left:0;top:20px;width:49px;height:48px;border:1px solid #ccc;background:#fff;display:none} #menu-wrap .allmn-btn:before, #menu-wrap .allmn-btn:after, #menu-wrap .allmn-btn .txt:before {content:"";display:block;width:21px;height:2px;background:#5a5a5a;margin-left:14px;transition:all .3s ease} #menu-wrap .allmn-btn:before {margin-bottom:5px;margin-top:16px} #menu-wrap .allmn-btn:after {margin-top:5px} #menu-wrap .allmn-btn:hover:before, #menu-wrap .allmn-btn:hover:after {width:14px;background:#0d5db2} #menu-wrap .allmn-btn:hover .txt:before {width:18px;margin-left:20px;background:#0d5db2} #mainNavi-wrap .go-ys {display:none;} #mainNavi-wrap .toppop-ctrl {position:absolute;right:0;top:0;z-index:100} #mainNavi-wrap .toppop-ctrl button {float:left;border:0;width:90px;height:90px} #mainNavi-wrap .toppop-ctrl button.btn-search {background:#0d4b91 url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -90px -240px} #mainNavi-wrap .toppop-ctrl button.btn-wctrl {background-color:#346dad} .isSub #mainNavi-wrap .toppop-ctrl button.btn-wctrl {/*display:none;*/} #mainNavi-wrap .toppop-ctrl button.btn-wctrl span {display:block;color:#fff;font-size:16px;text-align:center} #mainNavi-wrap .toppop-ctrl button.btn-wctrl span:before {content:'';display:block;width:30px;height:35px;margin:0 auto 10px auto;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -53px -200px} #mainNavi-wrap .toppop-ctrl button.btn-wctrl .num {position:absolute;left:0;top:0;width:24px;height:24px;text-align:center;font-style:normal;font-weight:600;color:#fff;background:#233f58} } @media all and (max-width:1299px) and (min-width:1000px) { #mainNavi-wrap {width:210px;} #mainNavi {width:210px;} #mainNavi .depth2-wrap {left:213px;} } @media only screen and (max-width:999px){ /* 메뉴 */ #mainNavi-wrap {overflow:inherit;position:absolute;top:0;left:0;width:100%;/*max-width:400px*/} #menu-wrap:before {display:block;content:"";width:100%;height:100%;background:#ff7746;position:absolute;top:70px;left:0} #menu-wrap:after {display:block;content:"";width:140px;height:100%;background:#fff;border-top:1px solid #dddddd;position:absolute;top:70px;left:0} #menu-wrap .mGnavi {display:block;box-sizing:border-box;position:relative;height:70px;background:none;font-size:0;text-align:right} #menu-wrap .mGnavi a.login {display:inline-block;position:absolute;top:15px;right:52px;width:28px;height:38px;} #menu-wrap .mGnavi a.login:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:17px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 0px;} #menu-wrap .mGnavi a.login span {font-size:0;color:transparent;display:inline-block;width:0;height:0;overflow:hidden;} #menu-wrap .mGnavi a.logout {display:inline-block;position:absolute;top:15px;right:52px;width:28px;height:38px;} #menu-wrap .mGnavi a.logout:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:17px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 0px;} #menu-wrap .mGnavi a.logout span {font-size:0;color:transparent;display:inline-block;width:0;height:0;overflow:hidden;} #menu-wrap .mGnavi .toppop-ctrl {position:absolute;top:15px;right:20px;} #menu-wrap .mGnavi .toppop-ctrl button {position:relative;width:32px;height:38px;border:0;background:none;} #menu-wrap .mGnavi .toppop-ctrl button:before {display:block;content:'';position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;width:17px;height:20px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat -24px 0px;} #menu-wrap .mGnavi .toppop-ctrl button:after {display:block;content:'';position:absolute;top:9px;right:3px;width:4px;height:4px;background:#ea5405;border-radius:50%;} #menu-wrap .mGnavi .toppop-ctrl button .txt {font-size:0;color:transparent;width:0;height:0;overflow:hidden;} #menu-wrap.mn-h-open {left: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.mn-h-open .btn-close {display:block;position:absolute;width:65px;height:70px;background:transparent;border:0;top:0;left:0;} #menu-wrap.mn-h-open .btn-close:before, #menu-wrap.mn-h-open .btn-close:after {content:"";display:block;position:absolute;width:25px;height:2px;background:#6c5f5e;top:0;right:0;bottom:0;left:0;margin:auto} #menu-wrap.mn-h-open .btn-close:before {transform:rotate(45deg)} #menu-wrap.mn-h-open .btn-close:after {transform:rotate(135deg)} #menu-wrap.mn-h-open .mGnavi a.login {position:fixed;} #menu-wrap.mn-h-open .mGnavi .toppop-ctrl {position:fixed;} #menu-wrap {position:absolute;transition:right 0.3s ease;right:-100%;top:0px;left:auto;width:100%;max-width:400px;height:9000px;z-index:8000;background:none;overflow-y:scroll;overflow-x:hidden;padding:0;margin:0} #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 {background:#fff;padding:14px 0 13px 0;border-bottom:1px solid #b9b9b9;position:relative} #menu-wrap .tmn-box .btn-close {width:52px;height:28px;background:none;border:0;position:absolute;top:16px;right:0;display:block;border-left:1px solid #ccc} #menu-wrap .tmn-box .btn-close:before, #menu-wrap .tmn-box .btn-close:after {display:block;content:"";width:2px;height:24px;background:#5e5e5e;position:absolute;top:50%;left:50%;margin-top:-12px;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;text-align:center} #menu-wrap .tmn-box .tmn-title img {height:32px} #menu-wrap .tmn-box .tmn-global {margin-top:10px} #menu-wrap .tmn-box .tmn-global li {display:inline-block;line-height:1} #menu-wrap .tmn-box .tmn-global li a {color:#fff;font-size:14px;padding:0 14px 0 14px} #menu-wrap .tmn-box .tmn-global li:first-child a {padding-left:0;position:relative} #menu-wrap .tmn-box .tmn-global li:first-child a:after{display:block;content:"";width:1px;height:14px;background:rgba(255,255,255,0.3);position:absolute;top:50%;right:0;margin-top:-7px} #menu-wrap .allmn-btn {display:none} #menu-wrap.mn-h-open #mainNavi {left:auto;right:0;top:0;width:100%} #mainNavi .depth1-tit, #mainNavi .mn_li1.over:before {display:none} #mainNavi .depth1-wrap {position:relative} #mainNavi li.mn_li1 {height:auto} #mainNavi .mn_li1 .mn_a1 {display:block;position:relative;box-sizing:border-box;padding:0 10px 0 20px;width:140px;height:auto;letter-spacing:-.05em;z-index:300;text-align:center} #mainNavi .mn_li1 .mn_a1 span {display:block;line-height:1.2;font-size:18px;color:#444444;font-weight:700;border-bottom:1px solid #e8e8e8;padding:34px 0;} #mainNavi .mn_li1 .mn_a1.over span, #mainNavi .mn_li1.is-open .mn_a1 span {color:#f86518;} #mainNavi .mn_li1.is-close .tgl-btn {position:absolute;top:14px;right:0;width:34px;height:34px;box-sizing:border-box;background:none;z-index:500;display:none;border:0;} #mainNavi .mn_li1.is-close .tgl-btn:before, #mainNavi .mn_li1.is-close .tgl-btn:after {content:"";display:block;position:absolute;width:2px;height:12px;background:#fff;top:0;right:0;bottom:0;left:0;margin:auto} #mainNavi .mn_li1.is-close .tgl-btn:before {width:12px;height:2px;} #mainNavi .depth2-wrap {display:none;width:100%;height:auto;box-sizing:border-box;transition:display .3s ease;position:absolute;top:0;left:0;padding-left:140px;box-sizing:border-box} #mainNavi .depth2-wrap .mn_li2.has-sub .tgl-btn {display:block} #mainNavi .depth2-wrap .mn_li2.is-open .tgl-btn {} #mainNavi .depth2-wrap .mn_li2.is-open .tgl-btn:before, #mainNavi .depth2-wrap .mn_li2.is-open .tgl-btn:after {background:#fff} #mainNavi .depth2-wrap .mn_li2.is-open .tgl-btn:after {width:0} #mainNavi .is-open .depth2-wrap {display:block} #mainNavi .depth2-ul {position:relative;z-index:100;box-sizing:border-box;padding:30px 20px 0 30px;} #mainNavi .mn_li1:first-child .depth2-ul {border-top:0} #mainNavi .mn_li2 {position:relative;padding:0;border-bottom:1px solid rgba(232,232,232,0.15);} #mainNavi .depth2-wrap .mn_a2 {position:relative;display:block;color:#fff;font-size:16px;font-weight:500;padding:21px 34px 19px 0} #mainNavi .depth2-wrap .mn_a2[target='_blank']:before, #mainNavi .depth2-wrap .mn_a2[target='_blank']:after {content:"";display:none;position:absolute} #mainNavi .depth2-wrap .mn_a2[target='_blank']:before {width:25px;height:25px;box-sizing:border-box;border:1px solid #a0a0a0;right:20px;top:13px} #mainNavi .depth2-wrap .mn_a2[target='_blank']:after {width:12px;height:10px;background:url(/resources/homepage/kor/_Img/Layout/layout_spr.png) no-repeat -157px -30px;right:26px;top:20px} #mainNavi .depth2-wrap .mn_a2 span {display:block;line-height:1} #mainNavi .depth2-wrap .mn_a2.over, #mainNavi .depth2-wrap .is-open .mn_a2, #mainNavi .depth2-wrap .mn_a2:hover {color:#1c1c1c;} #mainNavi .depth2-wrap .depth3-wrap {display:block;background:#f4f4f4;padding:10px 0} #mainNavi .depth2-wrap .mn_li2.is-close .depth3-wrap {display:none} #mainNavi .depth2-wrap .mn_li2.is-open .depth3-wrap {display:block} #mainNavi .depth2-wrap .depth3-wrap {background:rgba(0,0,0,0.2);padding:10px 15px;} #mainNavi .depth2-wrap .depth3-wrap li {} #mainNavi .depth2-wrap .depth3-wrap li a {position:relative;display:block;padding:0 0 0 17px;color:#ffd7c9;} #mainNavi .depth2-wrap .depth3-wrap li a:before {display:block;content:"";width:3px;height:3px;background:#fff;position:absolute;top:13px;left:0} #mainNavi .depth2-wrap .depth3-wrap li a span {font-size:14px} #mainNavi .depth2-wrap .depth3-wrap li.over a, #mainNavi .depth2-wrap .depth3-wrap li a:hover {color:#fff;text-decoration:underline;} .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%;right:0;top:70px;background:rgba(0,0,0,0.6);cursor:pointer;z-index:3001} .headerFixed .body-slider-ovclick {top:0;} #mn-ctrs-btns {display:inline-block;position:absolute;top:0;left:0;font-size:0;line-height:0;z-index:1000} #mn-ctrs-btns .mn-ctrs-btn {position:relative;width:65px;height:70px;background:none;box-sizing:border-box;border:0;transition:all .3s ease;} #mn-ctrs-btns .mn-ctrs-btn:after {display:block;content:'';position:absolute;top:0;left:0;bottom:0;right:0;margin:auto;width:27px;height:16px;border-top:2px solid #212121;border-bottom:2px solid #212121;box-sizing:border-box;transition:all .3s ease;} #mn-ctrs-btns .mn-ctrs-btn:before {display:block;content:'';position:absolute;top:0;left:0;bottom:0;right:0;margin:auto;width:27px;height:2px;background:#212121;transition:all .3s ease;} #mainNavi-wrap .go-ys {position:absolute;top:20px;right:20px;font-size:14px;display:none;} } /*-------------------------submenu_ipsi.css------------------------------------*/ #side-wrap {display:none} @media all and (min-width:1199px){ #side-wrap {position:relative;float:left;width:220px;display:none} } @media all and (max-width:999px){ #side-wrap {position:relative;display:block;width:auto;padding:0 0 0 20px;margin-top:-50px;position:relative;z-index:12;} #side-wrap .home {position:absolute;top:0;left:20px;width:55px;height:50px;background:#f86518;z-index:1;} #side-wrap .home:before {content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:21px;height:19px;background:url(/resources/homepage/ipsi/_Img/Layout/layout_spr.png) no-repeat 0 -68px;transition:all .3s ease;z-index:2;} .submenu .lm-tit {display:none} #leftmenu {height:50px;} #leftmenu .lm_l1 {position:relative;background:rgba(0,0,0,0.4);background-size:cover;} #leftmenu .lm_a1 {position:relative;display:block;padding:0 30px;height:50px;font-size:0;margin-left:55px;} #leftmenu .lm_a1 span {display:flex;align-items:center;height:100%;width:100%;vertical-align:middle;position:relative;font-size:15px;color:#fff;line-height:1.3} #leftmenu .lm_a1:before {content:"";display:block;position:absolute;top:14px;right:22px;width:26px;height:26px;background:rgba(0,0,0,0.4);border-radius:50%;transition:all .3s ease} #leftmenu .lm_a1:after {content:"";display:block;position:absolute;top:22px;right:32px;width:6px;height:6px;border-bottom:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg);transition:all .3s ease} #leftmenu .depth2 {display:none;position:absolute;top:100%;left:0;width:100%;z-index:1000;} #leftmenu .depth2 .lm_l2 {position:relative;background:#f2f2f2;box-sizing:border-box} #leftmenu .depth2 .lm_l2.is-open {border-bottom:0} #leftmenu .depth2 .lm_l2:last-child.is-open {padding-bottom:20px} #leftmenu .depth2 .lm_a2 {position:relative;display:block;padding:0 20px;} #leftmenu .depth2 .lm_a2 span {display:block;vertical-align:middle;position:relative;font-size:15px;color:#444444;line-height:1.3;border-bottom:1px solid #dadada;padding:15px 0;} #leftmenu .depth2 .lm_a2 span:before {display:none;content:'';position:absolute;top:14px;right:2px;width:22px;height:22px;background:rgba(0,0,0,0.3);border-radius:50%;} #leftmenu .depth2 .lm_a2 span:after {display:block;content:'';position:absolute;top:22px;right:11px;width:5px;height:5px;border-bottom:1px solid #a2a2a2;border-right:1px solid #a2a2a2;transform:rotate(-45deg);} #leftmenu .depth2 .lm_l2.has-sub .lm_a2 span:before {display:none;} #leftmenu .depth2 .lm_l2.has-sub .lm_a2 span:after {display:none;} #leftmenu .depth2 > li:last-child .lm_a2 span {border-bottom:0;} #leftmenu .depth2 .over .lm_a2 {background:#ff7746;} #leftmenu .depth2 .over .lm_a2 span {border-color:#ff7746;color:#fff;} #leftmenu .depth2 .over .lm_a2 span:before {display:block;} #leftmenu .depth2 .over .lm_a2 span:after {border-color:#fff;} #leftmenu .lm_l1 > .tgl-btn {position:absolute;top:50%;right:20px;width:43px;height:43px;background:none;z-index:500;transform:translateY(-50%);border:0;z-index:5;} #leftmenu .lm_l2 > .tgl-btn {position:absolute;top:14px;right:22px;width:22px;height:22px;border:0;background:none;border-radius:50%;z-index:500;} #leftmenu .lm_l2 > .tgl-btn:after {display:block;content:'';position:absolute;top:7px;right:8px;width:5px;height:5px;border-bottom:1px solid #a2a2a2;border-right:1px solid #a2a2a2;transform:rotate(45deg);} #leftmenu .lm_l2.is-open > .tgl-btn {} #leftmenu .lm_l2.is-open > .tgl-btn:after {top:9px;right:8px;transform:rotate(-135deg);} #leftmenu .lm_l2.is-open.over > .tgl-btn {background:#B25331} #leftmenu .lm_l2.is-open.over > .tgl-btn:after {top:9px;right:8px;transform:rotate(-135deg);border-color:#fff;} #leftmenu .lm_l2.over.is-close > .tgl-btn {background:#B25331} #leftmenu .lm_l2.over.is-close > .tgl-btn:after {border-color:#fff;} #leftmenu .depth3 {display:none;padding:0;overflow:hidden;background:#fff;font-size:0;text-align:left;margin:0 20px;} #leftmenu .depth3 .lm_l3 {float:left;display:inline-block;width:50%;position:relative;vertical-align:top;box-sizing:border-box} #leftmenu .depth3 li:nth-child(odd) {clear:both;} #leftmenu .depth3 .lm_l3 > .tgl-btn {display:none} #leftmenu .depth3 .lm_a3 {display:block;color:#666;position:relative;padding:12px 0 12px 30px;} #leftmenu .depth3 .lm_a3 span {display:inline-block;position:relative;font-size:14px;color:#7f7f7f;vertical-align:middle} #leftmenu .depth3 .lm_l3:before {content:"";display:block;position:absolute;left:20px;top:26px;width:2px;height:2px;background:#888181;} #leftmenu .depth3 .lm_l3.over .lm_a3 {} #leftmenu .depth3 .lm_l3.over .lm_a3 span {color:#ff7746} #leftmenu .depth3 .lm_l3.over:before {background:#ff7746;} #leftmenu .depth4 {display:none} #leftmenu .lm_l1.is-open .lm_a1 span:after {transform:rotate(180deg);-ms-transform:rotate(180deg)} } /* 애니메이션 */ @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)} }