@charset "UTF-8";

/* **************************************** *
 * portal-layout
 * **************************************** */
.portal-layout{display:flex; flex-direction:column; position:relative; min-height:100vh; overflow-x:hidden;  box-sizing:border-box}

body.fixed #portal-header{position:fixed}
body.mobile-gnb-open{overflow:hidden}


/* **************************************** *
 * portal-header
 * **************************************** */
#portal-header{position:absolute; top:0; right:0; left:0; height:8.4rem; background-color:#fff; box-shadow:0 .4rem 1.2rem 0 rgba(0, 0, 0, 0.12); z-index:999; box-sizing:border-box}
#portal-header .header-core{display:flex; align-items:center; position:relative; width:150rem; height:8.4rem; margin:0 auto; box-sizing:border-box}

#portal-header #logo{display:inline-flex; z-index:9}
#portal-header #logo a{display:block; width:13.8rem; height:3rem; background: url("../img/layout/logo-top.png") no-repeat 50% 50%; background-size:13.8rem 3rem}

/* gnb */
#gnb{ margin-left:auto}
#gnb .gnb-container{display:flex; align-items:center; gap:9.8rem}
#portal-header.logged-in #gnb .gnb-container{gap:7.35rem}
#portal-header.logged-in .header-mypage{margin-left:7.35rem}
#gnb .gnb-item > span{color:#202020; font-family:'NEXON-Lv2-Gothic', 'PretendardGOV'; font-size:1.8rem; font-weight:300; letter-spacing:-0.08rem; transition:all .35s ease}
#gnb .gnb-item:hover > span{color:#006fff}

/* gnb-dropdown */
#gnb .gnb-dropdown{position:relative; cursor:pointer}
#gnb .gnb-dropdown > span{display:inline-flex; align-items:center}
#gnb .gnb-dropdown .gnb-dropdown-menu{display:none; position:absolute; top:calc(100% + 1.6rem); left:50%; transform:translateX(-50%); min-width:0; padding:0.8rem 0; background:#fff; border-radius:1.2rem; box-shadow:0 .4rem 1.6rem rgba(0,0,0,0.12); z-index:100}
#gnb .gnb-dropdown .gnb-dropdown-menu:before{content:''; position:absolute; top:-1.6rem; left:0; right:0; height:1.6rem}
#gnb .gnb-dropdown:hover .gnb-dropdown-menu{display:block}
#gnb .gnb-dropdown .gnb-dropdown-menu a{display:block; padding:1rem 2rem; text-decoration:none; transition:background .2s}
#gnb .gnb-dropdown .gnb-dropdown-menu a:hover{background:#f5f7ff}
#gnb .gnb-dropdown .gnb-dropdown-menu a span{color:#202020; font-family:'NEXON-Lv2-Gothic', 'PretendardGOV'; font-size:1.5rem; font-weight:300; letter-spacing:-0.02rem; white-space:nowrap}
#gnb .gnb-dropdown .gnb-dropdown-menu a:hover span{color:#006fff}
.gnb-badge-active{display:inline-block; margin-left:0.5rem; padding:0.2rem 0.6rem; background:#10b981; color:#fff; font-size:1.1rem; font-style:normal; font-weight:500; border-radius:0.8rem; vertical-align:middle; letter-spacing:0}
.gnb-badge-soon{display:inline-block; margin-left:0.5rem; padding:0.2rem 0.6rem; background:#006fff; color:#fff; font-size:1.1rem; font-style:normal; font-weight:500; border-radius:0.8rem; vertical-align:middle; letter-spacing:0}

/* mobile gnb-dropdown */
.mobile-gnb-layer #mobile-gnb .gnb-dropdown{display:flex; flex-direction:column; border-bottom:1px solid #ebebeb}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown > span{display:flex; align-items:center; gap:0.6rem; padding-bottom:1rem; cursor:pointer}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown > span:after{content:'\ea4e'; font-family:'remixicon'; font-size:1.8rem; color:#808080; transition:transform .25s ease}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown.active > span:after{transform:rotate(180deg)}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown .gnb-dropdown-menu{display:none; flex-direction:column; gap:0.8rem; padding:1.2rem 0 0.8rem 0}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown.active .gnb-dropdown-menu{display:flex}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown .gnb-dropdown-menu a{display:flex; align-items:center; gap:0.8rem; padding:1.2rem 1.6rem; text-decoration:none; background:#f5f7fa; border-radius:1rem; transition:background .2s}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown .gnb-dropdown-menu a:before{content:'\ea6e'; font-family:'remixicon'; font-size:1.8rem; color:#93a3b8}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown .gnb-dropdown-menu a span{color:#202020; font-family:'NEXON-Lv2-Gothic', 'PretendardGOV'; font-size:2.4rem; font-weight:400; letter-spacing:-0.05rem}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown .gnb-dropdown-menu a:hover span{color:#006fff}
.mobile-gnb-layer #mobile-gnb .gnb-dropdown .gnb-dropdown-menu a:active{background:#e8edf3}

/* header-mypage */
.header-mypage{display:flex; align-items:center; justify-content:center; width:3.6rem; height:3.6rem; margin-left:2rem; border-radius:50%; background:#f0f4ff; color:#006fff; font-size:1.8rem; text-decoration:none; transition:background .2s}
.header-mypage:hover{background:#dbeafe; color:#1a56db}

/* allgnb-handle */
.allgnb-handle{display:none; position:absolute; right:2rem; top:1.5rem}
.allgnb-handle .allgnb-open{display:flex; flex-direction:column; justify-content:center; align-items:flex-end; gap:0.7rem; position:relative; width:5rem; height:5rem; background:none; border:0; cursor:pointer; box-sizing:border-box}
.allgnb-handle .allgnb-open:before,
.allgnb-handle .allgnb-open:after{content:''; width:3rem; height:0.3rem; background:#202020; transition:all .20s ease}
.allgnb-handle .allgnb-open strong{width:2.2rem; height:0.3rem; background:#006fff; transition:all .20s ease}
.allgnb-handle .allgnb-open:hover:before,
.allgnb-handle .allgnb-open:hover:after{width:2.2rem}
.allgnb-handle .allgnb-open:hover strong{width:3rem}

/* mobile-gnb */
.mobile-gnb-layer{display:none; position:fixed; top:0; right:0; bottom:0; left:0; background-color:#fff; overflow:hidden; z-index:9999}
.mobile-gnb-layer:before{content:''; position:absolute; left:-35rem; top:-35rem; width:60rem; height:60rem; background-color:#006fff; border-radius:1000rem; filter:blur(140px); display:none;}
.mobile-gnb-layer:after{content:''; position:absolute; right:-34rem; bottom:-34rem; width:64.4rem; height:54.8rem; background-color:#006fff; border-radius:1000rem; filter:blur(140px); display:none;}
.mobile-gnb-layer.active{display:block}
.mobile-gnb-layer .mobile-gnb-wrap{display:flex; flex-direction:column; height:100%; box-sizing:border-box}

.mobile-gnb-layer .mobile-gnb-login{display:flex; flex-direction:column; gap:2.5rem; position:relative; padding:5rem 2rem 4rem; background-color:#fff; box-shadow:0 .4rem 1.2rem 0 rgba(0, 0, 0, 0.12); box-sizing:border-box}
.mobile-gnb-layer .mobile-gnb-login .msec-top{display:flex}
.mobile-gnb-layer .mobile-gnb-login .msec-top .top-tit{display:flex; flex-direction:column; gap:0.8rem; width:100%}
.mobile-gnb-layer .mobile-gnb-login .msec-top .top-tit .tit{line-height:1.4em; color:#202020; font-family:'NEXON-Lv2-Gothic', 'PretendardGOV'; font-size:2.8rem; font-weight:600; letter-spacing:-0.08rem}
.mobile-gnb-layer .mobile-gnb-login .msec-top .top-tit .info{display:flex; align-items:center; line-height:1.4em; color:#505050; font-size:1.6rem; font-weight:normal; letter-spacing:-0.02rem}
.mobile-gnb-layer .mobile-gnb-login .msec-top .top-tit .info:after{content:''; flex:1; position:relative; top:0.5rem; height:1px; margin-left:2rem; background-color:#e8e8e8}

.mobile-gnb-layer .mobile-gnb-login .login-platform{display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem}
.mobile-gnb-layer .mobile-gnb-login .login-item{flex:1; display:flex; align-items:center; justify-content:center; position:relative; width:6.4rem; height:6.4rem; border-radius:1.2rem; box-sizing:border-box}
.mobile-gnb-layer .mobile-gnb-login .login-item:before{content:''}
.mobile-gnb-layer .mobile-gnb-login .login-item.kakao:before{width:2.6rem; height:2.6rem; background:url(/resources/img/main/login-kakao.svg) 50% 50% no-repeat; background-size:2.6rem}
.mobile-gnb-layer .mobile-gnb-login .login-item.naver:before{width:1.8rem; height:1.8rem; background:url(/resources/img/main/login-naver.svg) 50% 50% no-repeat; background-size:1.8rem}
.mobile-gnb-layer .mobile-gnb-login .login-item.kakao{background-color:#fae100; flex:none}
.mobile-gnb-layer .mobile-gnb-login .login-item.naver{background-color:#00c300; flex:none}

.mobile-gnb-layer .mobile-gnb-login .login-after{display:flex; align-items:center; flex-wrap:wrap; gap:1.4rem}
.mobile-gnb-layer .mobile-gnb-login .login-item.mypage:before,
.mobile-gnb-layer .mobile-gnb-login .login-item.logout:before{content:'\ea6c'; font-family:'remixicon'; font-size:2rem}
.mobile-gnb-layer .mobile-gnb-login .login-item.mypage:before{content:'\f256'; color:#fff}
.mobile-gnb-layer .mobile-gnb-login .login-item.logout:before{content:'\eede'; color:#202020}

.mobile-gnb-layer .mobile-gnb-login .login-item span{line-height:1.4em; font-size:1.6rem; font-weight:300; letter-spacing:-0.05rem}
.mobile-gnb-layer .mobile-gnb-login .login-item.mypage{background-color:#006fff}
.mobile-gnb-layer .mobile-gnb-login .login-item.mypage span{color:#fff}
.mobile-gnb-layer .mobile-gnb-login .login-item.logout{background-color:#f8f8f8}
.mobile-gnb-layer .mobile-gnb-login .login-item.logout span{color:#202020}

.mobile-gnb-layer #mobile-gnb{flex:1; display:flex; position:relative; padding:6rem 2rem; overflow-y:auto; box-sizing:border-box}
.mobile-gnb-layer #mobile-gnb .gnb-container{flex:1; display:flex; flex-direction:column; gap:3.5rem}
.mobile-gnb-layer #mobile-gnb .gnb-container:after{content:''; min-height:3.5rem}
.mobile-gnb-layer #mobile-gnb .gnb-item{padding-bottom:1rem; border-bottom:1px solid #ebebeb}
.mobile-gnb-layer #mobile-gnb .gnb-item > span{color:#202020; font-family:'NEXON-Lv2-Gothic', 'PretendardGOV'; font-size:2.8rem; font-weight:300; letter-spacing:-0.05rem}
.mobile-gnb-layer #mobile-gnb .gnb-item:hover > span{color:#006fff}

.mobile-gnb-layer .mobile-gnb-close{display:flex; align-items:center; justify-content:center; position:absolute; top:0; right:0; width:8rem; height:8rem; margin:0; padding:0; background-color:transparent; border:0; cursor:pointer; box-sizing:border-box}
.mobile-gnb-layer .mobile-gnb-close .more-ico{position:relative; width:100%; height:100%; transform:rotate(225deg)}
.mobile-gnb-layer .mobile-gnb-close .more-ico:before,
.mobile-gnb-layer .mobile-gnb-close .more-ico:after{content:''; position:absolute; left:50%; top:50%; background-color:#202020; transition: all .35s ease}
.mobile-gnb-layer .mobile-gnb-close .more-ico:before{width:4rem; height:0.3rem; margin-left:-2rem; margin-top:-0.15rem}
.mobile-gnb-layer .mobile-gnb-close .more-ico:after{width:0.3rem; height:4rem; margin-left:-0.15rem; margin-top:-2rem}



/* **************************************** *
 * container
 * **************************************** */
#portal-mcontainer{flex:1; padding-top:8.4rem; box-sizing:border-box}
#portal-mcontainer .page-content{position:relative; padding:6rem 0 12rem; box-sizing:border-box}
#portal-mcontainer .page-content .dev-content{display:flex; flex-direction:column; gap:10rem}

#portal-container{flex:1; padding-top:8.4rem; box-sizing:border-box}
#portal-container .page-content{position:relative; width:150rem; margin:0 auto; padding:3rem 0 12rem; box-sizing:border-box}
#portal-container .page-content .dev-content{}

body.map-test #portal-container .page-content{width:100%; padding:0; box-sizing:border-box}



/* **************************************** *
 * footer
 * **************************************** */
#portal-footer{background-color:#efefef}
#portal-footer .footer-inner{display:flex; position:relative; width:150rem; margin:0 auto; padding:4rem 0; box-sizing:border-box}
#portal-footer .footer-logo{display:flex; flex-direction:column; justify-content:center; min-width:18rem; max-width:18rem}
#portal-footer .footer-logo .logo{width:13.8rem; height:3rem; background: url("../img/layout/logo-foot.png") no-repeat 50% 50%; background-size:13.8rem 3rem}
#portal-footer .footer-info{display:flex; flex-direction:column; flex:1}
#portal-footer .footer-info .info-fnb{display:flex; align-items:center; gap:2rem}
#portal-footer .footer-info .info-fnb .fnb-item span{position:relative; line-height:1.4em; color:#202020; font-size:1.5rem; font-weight:300; letter-spacing:-0.02rem}
#portal-footer .footer-info .info-fnb .fnb-item:hover span{color:#006fff}

#portal-footer .footer-info .info-local{display:flex; align-items:center; margin-top:1rem}
#portal-footer .footer-info .info-local .local-corporate{display:inline-flex; align-items:center; gap:2rem}
#portal-footer .footer-info .info-local .local-corporate .local-item{position:relative}
#portal-footer .footer-info .info-local .local-corporate .local-item:after{content:''; position:absolute; top:50%; right:-1rem; width:1px; height:1.6rem; margin-top:-0.7rem; background-color:#ccc}
#portal-footer .footer-info .info-local .local-corporate .local-item:last-child:after{display:none}
#portal-footer .footer-info .info-local .local-corporate .local-item span{line-height:1.4em; color:#505050; font-size:1.5rem; font-weight:normal; letter-spacing:-0.02rem}
#portal-footer .footer-info .info-local .copyright{margin-left:auto; line-height:1.4em; color:#808080; font-family:Poppins; font-size:1.5rem; font-weight:normal; letter-spacing:normal}
#portal-footer .footer-info .info-local .fnb-item{position:relative; margin-left:2rem; padding-left:2rem}
#portal-footer .footer-info .info-local .fnb-item:before{content:''; position:absolute; left:0; top:50%; width:1px; height:1.6rem; margin-top:-0.8rem; background-color:#ccc}
#portal-footer .footer-info .info-local .fnb-item span{line-height:1.4em; color:#808080; font-size:1.3rem; font-weight:normal; letter-spacing:-0.02rem}
#portal-footer .footer-info .info-local .fnb-item:hover span{color:#006fff}
#portal-footer .footer-info .info-fnb .footer-credit{line-height:1.4em; color:#808080; font-size:1.3rem; font-weight:normal; letter-spacing:-0.02rem}
#portal-footer .footer-info .info-fnb .footer-credit i{margin-right:0.4rem; font-size:1.4rem; vertical-align:middle}

.page-top{position:absolute; right:0; top:-1.2rem}
.page-top .top-btn{display:flex; align-items:center; justify-content:center; width:3.8rem; height:3.8rem; margin:0; padding:0; background-color:#505050; border:0; border-radius:1.4rem; opacity:0; cursor:pointer; transition:all .35s ease; box-sizing:border-box}
.page-top .top-btn.active{opacity:1}
.page-top .top-btn:before{content:'\ea78'; color:#fff; font-family:remixicon; font-size:2.6rem}

.portal-admin{position:absolute; right:0; bottom:0; width:1.4rem; height:1.4rem}


/* **************************************** *
 * page-current
 * **************************************** */
.page-current{height:27rem; background-color:#fafafa}
.page-current .current-container{display:flex; align-items:center; justify-content:space-between; position:relative; width:150rem; margin:0 auto; height:27rem; box-sizing:border-box}
.page-current .current-container:before,
.page-current .current-container:after{content:''; position:absolute; border-radius:50%; filter:blur(120px)}
.page-current .current-container:before{left:33.5rem; top:-14rem; width:36rem; height:36rem; background:#006fff; background:linear-gradient(90deg,#2fdaa6, #006fff); opacity:0.14}
.page-current .current-container:after{right:-30rem; bottom:-34rem; width:48rem; height:48rem; background:#006fff; background:linear-gradient(90deg,#006fff, #2fdaa6); opacity:0.18}

.page-current .current-tit{display:flex; flex-direction:column; gap:1rem}
.page-current .current-tit .tit{line-height:1.4em; color:#202020; font-family:'NEXON-Lv2-Gothic', 'PretendardGOV'; font-size:3.2rem; font-weight:600; letter-spacing:-0.1rem}
.page-current .current-tit .info{line-height:1.4em; color:#202020; font-size:1.6rem; font-weight:300; letter-spacing:-0.05rem}
.page-current .current-tit .info-notice{margin-top:0.4rem; padding:0.8rem 1.4rem; line-height:1.5em; color:#1e40af; font-size:1.36rem; font-weight:400; letter-spacing:-0.03rem; background-color:#eff6ff; border-left:3px solid #006fff; border-radius:0 0.6rem 0.6rem 0}
.page-current .current-tit .tit-row{display:flex; align-items:center; gap:1.2rem}
.page-current .current-tit .btn-guide-link{display:inline-flex; align-items:center; padding:0.4rem 1.2rem; line-height:1.4em; color:#808080; font-size:1.3rem; font-weight:500; letter-spacing:-0.02rem; border:1px solid #a0a0a0; border-radius:10rem; text-decoration:none; white-space:nowrap; transition:background-color 0.2s, color 0.2s}
.page-current .current-tit .btn-guide-link:hover{background-color:#707070; color:#fff; border-color:#707070}
.page-current .current-tit .tit-guide{display:inline-flex; align-items:center; gap:0.4rem; margin-top:0.6rem; padding:0.6rem 1.4rem; color:#1e40af; font-size:1.36rem; font-weight:400; letter-spacing:-0.03rem; background-color:#eff6ff; border-radius:0.8rem; text-decoration:none; transition:background-color 0.2s}
.page-current .current-tit .tit-guide:hover{background-color:#dbeafe}
.page-current .current-tit .tit-guide i{font-size:1.6rem}


.page-current .current-search{display:flex; flex-direction:column; align-items:stretch; position:relative; min-width:48rem; max-width:48rem; box-sizing:border-box}
.page-current .current-search .search-key{position:relative; flex:1}
.page-current .current-search .search-key .key-form{display:flex; align-items:center; position:relative}
.page-current .current-search .search-key .key-form .form-input{position:relative; width:100%; height:6.4rem; border:0; background:#fff; border-radius:1.8rem; box-shadow:0 .4rem 1.2rem 0 rgba(0, 0, 0, 0.12); z-index:1; box-sizing:border-box}
.page-current .current-search .search-key .key-form .form-input:before{content:'\f0d1'; display:flex; align-items:center; position:absolute; left:2.8rem; top:0; height:100%; font-family:'remixicon'; font-size:2.2rem; color:#505050}
.page-current .current-search .search-key .key-form .form-input input{width:100%; height:6.4rem; margin:0; padding-left:6rem; padding-right:2rem; background:none; color:#202020; font-size:1.7rem; font-weight:600; text-align:left; letter-spacing:-0.05rem; border:0; border-radius:0; cursor:pointer; outline:none; box-sizing:border-box}
.page-current .current-search .search-key .key-form .form-input input::-webkit-input-placeholder{color:#909090; font-size:1.5rem; font-weight:normal; letter-spacing:-0.02rem}

.page-current .current-search .key-record{position:absolute; top:calc(100% + 0.4rem); left:0; right:0; max-height:32rem; background:#fff; border:1px solid #dadada; border-radius:1.8rem; box-shadow:0 .4rem 1.2rem 0 rgba(0, 0, 0, 0.12); overflow-y:auto; scrollbar-gutter:stable; scrollbar-width:thin; z-index:1000; box-sizing:border-box}
.page-current .current-search .key-record .key-record-item{display:flex; align-items:center; justify-content:space-between; padding:1.2rem 1.6rem; background-color:transparent; border-bottom:1px solid #f3f4f6; cursor:pointer; box-sizing:border-box}
.page-current .current-search .key-record .key-record-item:hover{background-color:#f8f8f8}
.page-current .current-search .key-record .key-record-item .item-name{flex:1; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; text-overflow:ellipsis; word-wrap: break-word; word-break:keep-all; overflow:hidden; box-sizing:border-box}
.page-current .current-search .key-record .key-record-item .item-name span{line-height:1.4em; color:#202020; font-size:1.7rem; font-weight:normal; letter-spacing:-0.02rem}
.page-current .current-search .key-record .key-record-item .item-count{flex:none; margin-left:1rem}
.page-current .current-search .key-record .key-record-item .item-count span{line-height:1.4em; color:#808080; font-size:1.5rem; font-weight:normal; letter-spacing:-0.02rem}
.page-current .current-search .key-record .no-results{display:flex; align-items:center; justify-content:center; gap:0.5rem; padding:2rem 1.6rem; text-align:center}
.page-current .current-search .key-record .no-results span{line-height:1.2em; color:#505050; font-size:1.5rem; font-weight:normal; letter-spacing:-0.02rem}