@import url(font-awesome.min.css);

#wrapper {background-size:contain; min-height:calc(100% - 216px);}

.menu_btn{display:inline-block; padding:0;width:65px; height:90px; vertical-align:middle; cursor: pointer;border-left: 0px solid #505972; display: flex; align-items: center;}
.menu_btn .icon-bar{padding: 0; width: 26px; height: 18px;margin: 0 auto;}
.menu_btn p{color:#fff; font-size:11px; text-align:center;}
.menu_btn span{display: block; margin-bottom: 6px; height:3px; background:#222; width: 26px; border-radius: 5px;}
.menu_btn:hover{background:#0077e5;}

.session_wrap{display:contents; text-align: center; font-size:18px; padding:0 8px;}
.session_wrap span{color:#d2e7e7; width:42px; margin-right: 5px;}
.session_wrap .btn{padding: 5; background: #1a95a9; font-size: 14px; margin-right: 10px;}

.id_box_wrap{position:absolute; top:72px; background:#f9f9f9; width:260px; right:10px; padding:10px 0 0; box-shadow:3px 3px #cccccc4d; border-radius:5px;}
.id_box_wrap:before{content: ' '; top:-10px; left:64%; height: 0;  width: 0; position: absolute; border:10px solid transparent; border-top-width: 0;  border-bottom-color: #f9f9f9;}
.id_box_wrap .loge{ background:#fff; border: 1px solid #ddd; border-radius:3px; padding:5px;}
.id_box_wrap .loge:hover{background:#e5e5e5;}
.id_box_wrap span{border: 1px solid #ddd;  background:#d2d2d2; border-radius: 50px; overflow: hidden; display: inline-block; width: 30px; height:30px; text-align: center; margin-right:10px;}
.id_box_wrap .no_img{padding-top:5px;}
.id_box_wrap .id_box{display:flex; justify-content: space-evenly; padding-bottom: 10px;}
.id_box_wrap .id_box .id_name{align-items: center; display:flex;}

.id_box_wrap .my_page{width:100%; text-align: center; border-top: 1px solid #ddd; display: block;  padding: 8px; background: #f1f2f3;}
.id_box_wrap .my_page:hover{background: #e4e5e8;}

.pb2r {padding-bottom: 2rem !important;}
.vote-subtit {text-align: center; padding-bottom: 4rem; font-size: 4rem;}
.intro-subtit {text-align: center; padding-bottom: 6rem; font-size: 4rem;}

.mobile_menu{display:none;}

/* 상위메뉴 hover시 백그라운드 */
.header_bg{display: none; width:100%;background:linear-gradient(153deg, #ffffff, #ffffff); height:140px; position: absolute;  top:89px; border-top: 1px solid #eceef2; z-index:0; box-shadow: 7px 7px 5px rgb(234 234 234 / 70%)}


    
.sitemap_wrap{width:660px; min-height: calc(100% - 216px);}
.sitemap_wrap .modal-body{background: url(/images/npps/sales_obj02.png) no-repeat right bottom;}
.sitemap{display:flex; flex-wrap:wrap;}
.sitemap h5{font-size:25px; padding-bottom:5px;  color:#041030;}
.sitemap li{width:50%; padding:8px;}
.sitemap .nav_dapth2{font-size:15px;;}
.sitemap .nav_dapth2 li{width:100%;}
.sitemap .nav_dapth2 li{padding:12px 10px; background: #fff; line-height: 1.2; display: inline-block; border: 1px solid #e5e5e5; width: 94%; border-radius: 3px; margin:2px; font-size:16px;}
.sitemap .nav_dapth2 li:hover{border:1px solid #AF8E65; background: #fafaf9;}
.sitemap .nav_dapth3 { padding-top:6px;}
.sitemap .nav_dapth3 li{border:none; padding:3px; background:none; position: relative;}
.sitemap .nav_dapth3 li:before{content: ''; width:8px; height: 1px; position: absolute; display: block; background:#8c8c8c; left:0px;  top:11px;}
.sitemap .nav_dapth3 li:hover{border:none; background:none;}
.sitemap .nav_dapth3 li a{padding-left:11px;font-size: 14px;}

/*서브*/
#sub_wrapper{min-height:calc(100% - 216px); width: 1950px;  overflow: hidden; margin: 0 auto;}

#container {width:1400px; margin: 0 auto;}
#container h3{font-size:60px; text-align: center;  padding:60px 0;}

.m_call_wrap{display:flex; place-self:flex-end; flex-direction:column;}
.m_call_wrap h3{color:#1c396e; font-size:24px;background: url(/images/npps/m_call.png) no-repeat 0 3px; width: 295px; background-size: 32px; padding-left: 40px;}
.m_call_wrap p{color: #1c396e; letter-spacing:-0.8; font-size:15px;}


/* Skip navigation */
.skipnavi {margin-bottom: 0}
.skipnavi a {display:block; position:absolute; top:-10000px; left:0; z-index:100; width:100%; text-align: center}
.skipnavi a:focus {position:absolute; top:0; z-index:100; padding:10px 0; background:#50B587 ; font-weight:500; color:#fff}

/* header pc */
.header-pcarea {
    width:100%;
    background: url('/images/npps/mbnagnd/main/main-bg01-header.png') no-repeat top center;
    background-size: cover;
}

.header-pcarea a{
	text-decoration:none;
}

.side-toplist a{
     color:#fff;
 }

.gnb-inner {
    width:100%;
    box-sizing: border-box;
    padding:0 5%;
    /* 20260713 수정-str */
    height:90px;
    display: flex;
    justify-content: space-between;
    /* 20260713 수정-end */
    line-height:60px;
    border-bottom:1px rgba(255, 255, 255, 0.15) solid;
}
.gnb-list {
    /* 20260713 수정-str */
    height: fit-content;
    margin-top: 1.4rem;
    /* 20260713 수정-end */
}

.gnb-list li {
    display: inline-block;
    padding-left:25px;
    font-size: 26px;
    font-weight: 600;
    color:#fff;
}
.gnb-list li a {color:#fff}
.header-mobilearea {display: none ;}
.header-pcarea {
    border-bottom:1px rgba(255, 255, 255, 0.20) solid;
    position: relative;
}
nav {
    width:100%;
    padding:0 5%;
    box-sizing: border-box;
    /* 20260713 수정-str */
    height:80px;
    /* 20260713 수정-end */
    display: flex !important;
    align-items: center;
    justify-content:space-between;
}
.sub-menu {
    display: none;
    position: absolute;
    border-top:1px #e5e5e5 solid;
    background-color:#fff;
    width: 100%;    
    box-shadow: 0 5px 6px rgba(0,0,0,0.2);
    left: 0;
    top: 100%;
    z-index:9999;
    text-align: right;
    }
.nav-item {
    width: 100%;
    padding-top:30px;
    margin:0px auto;
}
.logo-area {
    font-size:40px;
    font-weight:600;
    color:#fff;   
}

.logo-area h1{
    font-size:40px;
    font-weight:600;
    color:#fff;   
    /* 20260713 수정-str */
    margin: 1rem 0;
    /* 20260713 수정-end */
}

.logo-area a:hover{
    color:#fff;   
}

.nav-listarea {
    padding-top:2px;
    font-size: 0;
    /* 20260713 수정-str */
    width:100%;
    /* 20260713 수정-end */
}
/* 20260713 수정-str */
.nav-listarea ul {
    margin:0;
    width: 100%;
    display: flex;
    justify-content: space-between;
}
/* 20260713 수정-end */
.nav-listarea li a {
	color:#fff;
}

.nav-listarea li {
    /* 20260713 수정-str */
    display: inline-flex;
    font-size: 28px;
    color:#fff;
    font-weight: 700;
    padding-left:0;
    margin:0;
    /* 20260713 수정-end */
}
.nav-bg {
    width: 300px;
    text-align: center;
    vertical-align: top;
}
.nav-listarea li .nav-linkbg {
    box-sizing: border-box;
    padding:0;
    margin:0;
    width:60%;
}
.nav-slist {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding:0;   
}
.nav-slist li {
    box-sizing: border-box;
    padding-right:5%;
    border-bottom:0px #ccc dashed;
    margin-bottom:30px;
    padding-left:0;
    text-align: left;
}
.nav-listarea li:nth-child(2) .nav-linkbg  {
    padding-left:6%
}
.nav-listarea li:nth-child(3) .nav-linkbg  {
    padding-left:17%
}
.nav-listarea li:nth-child(4) .nav-linkbg  {
    padding-left:32%
}
.nav-listarea li:nth-child(5) .nav-linkbg  {
    padding-left:47%
}
.nav-slist li a {
    color:#222;
    font-size: 24px;
}
.nav-slist li a:hover {
    color:#1764c4;
}
.nav-slist li .smenu-pres {
    background: url('/images/npps/common/smenu-listarr.png')no-repeat 100% 10px;
    padding-right:20px;
}
.nav-slist li:hover .smenu-pres {
    background: url('/images/npps/common/smenu-listarr1.png')no-repeat 100% 10px;
    padding-right:20px;
}
.nav-slist li:nth-child(3),
.nav-slist li:nth-child(6),
.nav-slist li:nth-child(9),
.nav-slist li:nth-child(12),
.nav-slist li:nth-child(12) {
    margin-right:0;
}

.nav-comment {
    display: block;
    font-size: 14px;
    color:#666;
    padding:5px 0 10px 0;
    font-weight: 500;
    line-height: 1.3;
    word-break: keep-all;
}
.smenu-listarea {
    display: block;
    flex-wrap: wrap;
    background-color: #f0f7ff;
    padding:5px 10px 10px 15px; 
    border-radius: 10px;
    margin-bottom:20px;
    font-size: 18px;
}
.nav-slist li .smenu-listarea a {
    border-bottom:0px;
    font-size: 18px;
    color:#555;
    padding:0 10px 0px 7px;
    text-align: left;
    font-weight: 500;
    background: url('/images/npps/common/smenu-listdot.png') no-repeat 0 10px;
    transition: 0.3s;
}
.nav-slist li .smenu-listarea a:hover {
    color:#1764c4;
    background: url('/images/npps/common/smenu-listdot1.png') no-repeat 0 10px;
}
.smenu-listarea a.act{
    color:#1764c4
}
.smenu-listarea a.link {
    background: url('/images/npps/sub/instit-link.png') no-repeat 100% 3px;
    padding-right:20px;
    margin-right:10px;
}
.l-link {
    background: url('/images/npps/sub/l-link.png') no-repeat 100% 6px;
    padding-right:25px;
    margin-right:0px;
}
.nav-smenuarea {display: none;}


/* 모달팝업, 사이트맵 */
 .dialog {
  display:none;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

.dialog>.tb {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.dialog>.tb .inner {
  width: 100%;
  padding: 30px;
  background: #fff;
  border-radius: 16px;
}

.dialog .top {
  display: flex;
  align-items: center;
  border-bottom: 2px solid #222;
  justify-content: space-between;
  padding-bottom: 10px;
  margin-bottom: 20px;
}

.dialog .title {
  font-weight: bold;
  font-size: 20px;
  color:#222
}

.dialog .ct {
  max-height: 60vh;
  height: 60vh;
  overflow-y: auto;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #fff;
}
.dialog .ct::-webkit-scrollbar {
    width: 7px; 
  }
.dialog .ct::-webkit-scrollbar-thumb {
    background-color: #dedede;
    border-radius: 50px;
}
.dialog .ct::-webkit-scrollbar-track {
    background-color: #f6f6f6;
    border:1px #dedede solid;
    border-radius: 50px;
} 

.accordion {
  width: 100%;  
  margin: 0 auto;
  padding-right:3%;
  box-sizing: border-box;
}
.accordion div:last-child {
    border-bottom:0px;
    padding-bottom:0;
    margin-bottom:0
}
.accordion-btn {
  display: block;
  width: 100%;
  text-align: left;
  background-color: inherit;
  outline: none;
  border: none;
  /* padding: 15px 20px 15px 45px; */
  color:#222;
  font-size: 28px;
  font-weight: 700;
  cursor: pointer;  
  transition: background-color 0.3s;
}

.accordion-active, .accordion-btn:hover {
 color:#1764c4
}


.panel-content .sub_menu_list {
  padding: 15px 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap:10px;
  
}
.panel-content .sub_menu_list li {
    width: 24%;
    padding:0;
    margin:0;
    box-sizing: border-box;    
}
.panel-content .sub_menu_list li a {
    display: block;
    background-color: #f1f1f1;
    border-radius: 10px;
    font-size: 18px;
    color:#222;
    font-weight: 500;
    text-align: left;
    padding:0px 20px; 
}
.panel-content .sub_menu_list li a:hover {
    background-color: #f3f5f9;
    color:#1764c4;
}
.panel-content li .sub-smenuList {
    padding:0;
}
.panel-content li .sub-smenuList li{
    width: 100%;
    padding:0;
    margin:0;
    vertical-align: top;
}
.panel-content li .sub-smenuList li a {
    padding:0px 0 0 7px;
    background: url('/images/npps/sub/sitemap-dot.png') no-repeat 0 6px;
    border-radius: 0;    
    text-align: left;
    background-color: #fff;
    margin:0;
    padding:0;
    min-height:30px;
    word-break: keep-all;
    transition: 0.3s;
}
.panel-content .sub_menu_list li.has-menu a{
    background: #f1f1f1 url('/images/npps/sub/sitemap-arrow.png') no-repeat 95% 20px;
}
.panel-content .sub_menu_list li.has-menu a:hover{
    background: #f3f5f9 url('/images/npps/sub/sitemap-arrow1.png') no-repeat 95% 20px;
}
.panel-content .sub_menu_list li.has-menu .sub-smenuList li a {
    background: #fff url('/images/npps/sub/sitemap-dot.png') no-repeat 0 6px;
    font-size: 16px;
    color:#666;
    transition: 0.3s;
}
.panel-content .sub_menu_list li.has-menu .sub-smenuList li a:hover {
    background: #fff url('/images/npps/sub/sitemap-dot.png') no-repeat 0 6px;
    font-size: 16px;
    color:#222;
}
.panel-content {
  overflow: hidden;
  transition: max-height 0.3s;
  padding: 0px 0px 20px 0;
  margin-bottom:20px;
  border-bottom:1px #ddd dashed;
}


/*footer*/
footer {
    background-color: #e1e2e7;
    border-top:1px #d3d4db solid;
}
.footer-contain-banner {
    width: 100%;
    padding:20px 5%;
    display: flex;
    justify-content: end;
    align-items: flex-end;
    background: #D8E5FD;
}
.footer-contain {
    width: 100%;
    padding:20px 5%;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    font-size: 16px;
    color:#595d74;
    line-height: 1.8;   
    border-bottom:1px #d3d4db solid; 
}
address span {font-weight: 600;}
.footer-rightarea {
    vertical-align: bottom;
    text-align: right;
}
.copyright {
    font-size: 14px;
    text-align: right;
}
.privacy {
    width: 100%;
    padding: 20px 0 0;
    background-color: #e1e2e7;
    color:#3a70c2;
    font-weight: 600;
}
.privacy a:hover {
    text-decoration: underline;
}

/*스크롤*/
::-webkit-scrollbar {width:10px; height:10px;}
::-webkit-scrollbar-thumb {background-color:#ddd; border-radius: 10px; background-clip: padding-box; border: 2px solid transparent;}
::-webkit-scrollbar-track {background-color:#f8f8f8; border-radius:10px;}

@media (max-width:1950px) {	
#sub_wrapper{width:100%;}
}

@media all and (max-width:1800px) { 
    .gnb-inner {
        padding: 0 1%;
    }
    nav {
        padding: 0 1%;
    }
}

@media all and (max-width:1500px) { 
    .gnb-inner {
        width:100%;
    }
    .logo-area {
        font-size:36px;
        font-weight:600;
        color:#fff;   
    }
    nav {
        width:100%;
        display: flex;
        box-sizing: border-box;
        justify-content:space-between;
    }
    .nav-listarea li {
        display: inline-block;
        font-size: 24px;
        color:#fff;
        font-weight: 700;
        /* 20260713 수정-str */
        padding-left:0;
        /* 20260713 수정-end */
        margin:0;    
    }
    
    .nav-bg {
        width: 300px;
        text-align: center;
        vertical-align: top;
    }
    .nav-listarea li .nav-linkbg {
        box-sizing: border-box;
        padding:0;
        margin:0;
        width:76%;
    }
    .nav-slist {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        padding:0;   
    }
    .nav-slist li {
        box-sizing: border-box;
        padding-right:5%;
        border-bottom:0px #ccc dashed;
        margin-bottom:30px;
        padding-left:0;
        text-align: left;
    }
    .nav-listarea li:nth-child(2) .nav-linkbg  {
        padding-left:8%
    }
    .nav-listarea li:nth-child(3) .nav-linkbg  {
        padding-left:22%
    }
    .nav-listarea li:nth-child(4) .nav-linkbg  {
        padding-left:42%
    }
    .nav-listarea li:nth-child(5) .nav-linkbg  {
        padding-left:58%
    }
    .nav-slist li a {
        color:#222;
        font-size: 24px;
    }
    .nav-slist li a:hover {
        color:#1764c4;
    }
    .nav-slist li .smenu-pres {
        background: url('/images/npps/common/smenu-listarr.png')no-repeat 100% 10px;
        padding-right:20px;
    }
    .nav-slist li:hover .smenu-pres {
        background: url('/images/npps/common/smenu-listarr1.png')no-repeat 100% 10px;
        padding-right:20px;
    }
    .nav-slist li:nth-child(3),
    .nav-slist li:nth-child(6),
    .nav-slist li:nth-child(9),
    .nav-slist li:nth-child(12),
    .nav-slist li:nth-child(12) {
        margin-right:0;
    }

    .nav-comment {
        display: block;
        font-size: 14px;
        color:#666;
        padding:5px 0 10px 0;
        font-weight: 500;
        line-height: 1.3;
        word-break: keep-all;
    }
    .smenu-listarea {
        display: block;
        flex-wrap: wrap;
        background-color: #f0f7ff;
        padding:5px 10px 10px 15px; 
        border-radius: 10px;
        margin-bottom:20px;
        font-size: 18px;
    }
    .nav-slist li .smenu-listarea a {
        border-bottom:0px;
        font-size: 18px;
        color:#555;
        padding:0 10px 0px 7px;
        text-align: left;
        font-weight: 500;
        background: url('/images/npps/common/smenu-listdot.png') no-repeat 0 10px;
        transition: 0.3s;
    }
    .nav-slist li .smenu-listarea a:hover {
        color:#1764c4;
        background: url('/images/npps/common/smenu-listdot1.png') no-repeat 0 10px;
    }
    .smenu-listarea a.act{
        color:#1764c4
    }
    .smenu-listarea a.link {
        background: url('/images/npps/sub/instit-link.png') no-repeat 100% 3px;
        padding-right:20px;
        margin-right:10px;
    }

    footer {
        width:100%;
    }
    .footer-menu  ul {
        width:100%;
        margin:0 auto;
        padding:0 2%;
        box-sizing: border-box;
    }
    .footer-contain {
        width: 100%;
        padding-bottom:40px;
        padding:0 5%;
        margin:40px 0 0 0;
    }
}

@media (max-width:1400px) {	
 #container{width:100%; padding:0 20px;}
}

@media all and (max-width:1300px) { 
    .gnb-inner {
        width:100%;
    }
    nav {
        width:100%;
        display: flex;
        box-sizing: border-box;
        justify-content:space-between;
    }
    .logo-area {
        font-size:32px;
        font-weight:600;
        color:#fff;   
    }
    .nav-list li {
        font-size: 26px;
        color:#fff; 
        /* 20260713 수정-str */
        padding-left:0;
        /* 20260713 수정-end */
    }
    .nav-listarea li a {
        color:#fff
    }

    .nav-listarea li .nav-linkbg {
        box-sizing: border-box;
        padding:0;
        margin:0;
        width:74%;
    }
    .nav-slist {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        padding:0;   
    }
    .nav-slist li {
        box-sizing: border-box;
        padding-right:5%;
        border-bottom:0px #ccc dashed;
        margin-bottom:30px;
        padding-left:0;
        text-align: left;
    }
    .nav-listarea li:nth-child(2) .nav-linkbg  {
        padding-left:12%
    }
    .nav-listarea li:nth-child(3) .nav-linkbg  {
        padding-left:23%
    }
    .nav-listarea li:nth-child(4) .nav-linkbg  {
        padding-left:40%
    }
    .nav-listarea li:nth-child(5) .nav-linkbg  {
        padding-left:58%
    }
    .nav-slist li a {
        color:#222;
        font-size: 24px;
    }

    footer {
        width:100%;
    }
    .footer-menu  ul {
        width:100%;
        margin:0 auto;
        padding:0 5%;
        box-sizing: border-box;
    }

}


/* pad area */
@media all and (max-width:1280px) { 
    
    .gnb-inner {
        width:100%;
        box-sizing: border-box;
        padding:0 1%;
        /* 20260713 수정-str */
        height:90px;
        display: flex;
        justify-content: space-between;
        /* 20260713 수정-end */
        line-height:60px;
        border-bottom:1px rgba(255, 255, 255, 0.15) solid;
    }
    .gnb-list {text-align: right;}
    .gnb-list li {
        display: inline-block;
        padding-left:25px;
        font-size: 26px;
        font-weight: 600;
        color:#fff;
    }
    .gnb-list li a {color:#fff}
    .header-mobilearea {display: none ;}
    .header-pcarea {
        border-bottom:1px rgba(255, 255, 255, 0.20) solid;
        position: relative;
    }
    nav {
        width:100%;
        padding:0 1%;
        box-sizing: border-box;
        /* 20260713 수정-str */
        height:78px;
        /* 20260713 수정-end */
        display: flex;
        align-items: center;
        justify-content:space-between;
    }
    .sub-menu {
        display: none;
        position: absolute;
        border-top:1px #e5e5e5 solid;
        background-color:#fff;
        width: 100%;    
        box-shadow: 0 5px 6px rgba(0,0,0,0.2);
        left: 0;
        top: 100%;
        z-index:9999;
        text-align: center;
        }
    .nav-item {
        width: 100%;
        padding-top:30px;
        margin:0px auto;
    }
    .logo-area {
        font-size:40px;
        font-weight:600;
        color:#fff;   
    }
    .nav-listarea {
        padding-top:2px;
        font-size: 0;
    }

    .nav-listarea li {
        display: inline-block;
        font-size: 32px;
        color:#fff;
        font-weight: 700;
        padding-left:85px;
        margin:0;    
    }
    
    
    .nav-list li {
        font-size: 20px;
        color:#fff; 
        /* 20260713 수정-str */
        padding-left:0;
        /* 20260713 수정-end */
    }
    
    .header-pcarea {
	    background: url('/images/npps/mbnagnd/main/main-bg01-header.png') no-repeat top center;
	}
}

@media (max-width:1200px) {	

#container h3 {font-size:55px;}

.m_call_wrap {padding:0 0 10px;}
.m_call_wrap h3{margin: 0 auto; padding-left:0px; font-size:20px; width:252px; background-size: 27px;}
}


@media all and (max-width:1150px) { 
    .nav-list li {
        font-size: 18px;
        color:#fff; 
        /* 20260713 수정-str */
        padding-left:0;
        /* 20260713 수정-end */
    }
}

@media all and (max-width:1024px) { 
    /* header mobile*/
	#container h3 {font-size:40px;}
    .header-pcarea {display: none;}
    .nf-header {
        display: block;  
        position: relative; 
        z-index: 90; top: 0; left: 0; right: 0; 
        width: 100%; 
        height: 110px;
        line-height: 110px;
        min-height: var(--header-height); 
        border-bottom:1px rgba(255, 255, 255, 0.20) solid;
        background: url('/images/npps/mbnagnd/main/main-bg1-header.png') no-repeat top center;
    }
    .nf-toolbar {
        display:flex; 
        padding: 0 3%;
    }
    .nf-toolbar .logo {
        display:flex; 
        margin-right: auto;       
        transition: margin 0.3s ease-in-out;
        
    }
    .nf-toolbar .logo a {
        display:block; 
        color:#fff;
        font-size: 30px;
        font-weight: 600;
    }

    html.mobilemenu-open {
        overflow: hidden;
    }
    
    .mobilemenu-open {
        width: 29px;
        height: 25px;
        position: absolute;
        right: 3%;
        top: 40px;
        z-index: 1;
        background-size: 50%;
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
        text-align: right;
    }
    .mobilemenu-area {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
    .mobilemenu-open span {
        display: block;
        width: 29px;
        height: 4px;
        background-color: #fff;
        border-radius: 50px;
    }
    .mobilemenu-open span:nth-child(2) {
        width: 19px;
        margin:5px 0
    }

    .mobilemenu-close {
        width: 40px;
        height: 40px;
        position: absolute;
        right:20px;
        top: 20px;
        background: url('/images/npps/common/side-close.png') no-repeat 50% 50%;
        cursor: pointer;
        z-index: 999;
    }
    
    #menu {
        width: 480px;
        height: 100%;
        max-height:100%;
        position: fixed;
        top: 0px;
        right: -482px;
        z-index: 10;
        background-color: white;
        transition: All 0.3s ease;
        -webkit-transition: All 0.3s ease;
        -moz-transition: All 0.3s ease;
        -o-transition: All 0.3s ease;
        overflow: auto;
    }
    
    #menu.open {
        right: 0px;
    }
    
    .page_cover.open {
        display: block;
    }
    
    .page_cover {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0px;
        left: 0px;
        background-color: rgba(0, 0, 0, 0.7);
        z-index: 4;
        display: none;
    }


    .btn-menu-burger {
        position: absolute; 
        bottom:30px;
        right:3%;
        cursor: pointer; 
        background-color: transparent; 
        width: 29px; 
        height: 22px;
    }
    .btn-menu-burger .menu-icon-burger {
        position: relative;   
        display: flex;
        flex-direction: column;
    }
    .btn-menu-burger .menu-icon-burger span {
        display: block;
        height: 4px; 
        border-radius:50px;
        background-color: #222; 
        transition: transform 250ms cubic-bezier(.2,.6,.3,1),width 250ms cubic-bezier(.2,.6,.3,1); 
        will-change: transform,width;
    }
    .btn-menu-burger .menu-icon-burger .top-bun, 
    .btn-menu-burger .menu-icon-burger .bottom-bun {
        width: 29px;                
        }
    .btn-menu-burger .menu-icon-burger .patty {
        width: 20px;  
    }
    .btn-menu-burger .menu-icon-burger .top-bun {
        transform: translateY(-6px);
    }
    .btn-menu-burger .menu-icon-burger .bottom-bun {
        transform: translateY(6px);
    }

    .btn-menu-burger.active .menu-icon-burger .top-bun, 
    .btn-menu-burger.active .menu-icon-burger .patty, 
    .btn-menu-burger.active .menu-icon-burger .bottom-bun { 
        background-color: #222;
    }
    .btn-menu-burger.active .menu-icon-burger .patty {
        opacity: 0;
    }
    .btn-menu-burger.active .menu-icon-burger .top-bun { 
        transform: translateX(3.5px) rotate(-135deg); 
        width: 28px;
    }
    .btn-menu-burger.active .menu-icon-burger .bottom-bun { 
        transform: translateX(3.5px) rotate(135deg); 
        width: 28px;
    }

    .nf-header-btns {
        display:flex;
        align-items: center; 
        margin: 24px 0 0 auto; 
        transition: margin 0.3s ease-in-out
    }
    .nf-header-btns .btn-header-profile {
        position: relative; 
        margin-right: 20px; 
        line-height: 1; 
        color: #2B2A29;
    }
    .nf-header-btns .btn-header-profile .user-name {
        font-size: 18px; 
        font-weight: 600; 
        margin-right: 5px;
    }

    .nf-header-btns .btn-header-logout {
        position: relative; 
        padding: 9px 0 8px; 
        line-height: 1; 
        color: #50B587; 
        font-weight: 600
    }
    .nf-header-btns .btn-header-logout::after {
        display: block; 
        content: ''; 
        position: absolute; 
        left: 0; 
        right: 24px; 
        bottom: 7px;
        height: 1px; 
        background: #50B587; 
        line-height: 0; 
        font-size: 0; 
        transition: background-color 150ms;
    }
    .nf-header-btns .btn-header-logout .svg-icon {
        width: 17px; 
        height: 16px; 
        margin-left: 4px; 
        vertical-align: -2px;
    }

    .nf-header-close {
        display: flex; 
        align-items: center;
        position:absolute; 
        z-index:10; 
        top:15px; 
        right:30px; 
        width:42px; 
        height:42px;
        transition: all 0.3;
    }
    .nf-header-close::before,
    .nf-header-close::after {
        content:""; 
        display:block; 
        position:absolute; 
        top:auto; 
        left:13px; 
        height:3px; 
        width: 18px; 
        background-color:#242424; 
        font-size:0; 
        line-height:0; 
        transform: rotate(0); 
        transition: all 0.5s;
    }
    .nf-header-close::before {
        transform: rotate(45deg);
    }
    .nf-header-close::after {
        transform: rotate(-45deg);
    }
    .nf-header .nf-header-close:hover::before,
    .nf-header .nf-header-close:hover::after {
        background-color:#1a1a1a;
    }

    /* mobile-side menu */
    .side-toparea {
        width:100%;
        padding:0 30px;
        height: 80px;
        line-height: 80px;
        background-color: #083b85;
        margin:0;
        border:0px;
    }
    .side-toplist {
        display: flex;
        width:100%;
    }
    .side-toplist span {
        display: inline-block;
        font-size: 18px;
        font-weight: 600;
        color:#fff;    
        padding-right:20px;
        text-transform: uppercase;
    }
    #sidemenu,
    #sidemenu ul,
    #sidemenu ul li,
    #sidemenu ul li a {
        margin: 0;
        padding: 0;
        border: 0;
        list-style: none;
        line-height: 1;
        display: block;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #sidemenu {
        width: 100%;
        font-family: 'PretendardGOV', sans-serif;
        padding:30px;
    }
    #sidemenu ul ul {
        display: none;
    }
    .align-right {
        float: right;
    }
    #sidemenu > ul > li > a {
        border:1px solid #c5c5c5; 
        margin-bottom:3px;
        border-radius:10px;
        font-size:24px;
        font-weight:600px;
        color:#666;
        /* background: #fff url('/images/npps/sub/lnb-on.png') no-repeat 90% 50%; */
        transition: 0.2s;
        display: block;
        padding: 18px 20px ; 
    }
    #sidemenu > ul > li > a:hover,
    #sidemenu > ul > li.active > a,
    #sidemenu > ul > li.open > a {
        color: #fff; 
        background: #1764c4 url('/images/npps/sub/lnb-off.png') no-repeat 90% 50%;
        border-radius:10px;    
        border:1px solid #1764c4; 
    }
    #sidemenu > ul > li.open > a {
        color:#fff;
        box-shadow: none;
        border-radius: 10px;
        font-weight:600px;
    }
    #sidemenu > ul > li:last-child > a,
    #sidemenu > ul > li.last > a {
        border-bottom:1px solid #c5c5c5; 
        font-weight:600px;
    }
    #sidemenu ul ul li a {
        display: block;
        padding: 18px 20px ; 
        font-size: 20px;
        font-weight: 500;
        background: #f3f5f9;
        margin-bottom:3px;
        border-radius: 10px;
        color:#666;
    }
    #sidemenu ul ul li.open > a,
    #sidemenu ul ul li.active > a {
        background: #f3f5f9;
        color: #1764c4;  
        margin-bottom:0;  
    }
    #sidemenu ul ul li:first-child > a {
        box-shadow: none;
    }
    #sidemenu ul ul ul li:first-child > a {
    /* box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); */
        border-radius:0px;
    }

    #sidemenu ul ul ul {
        padding:0 0 10px 0;
        border-radius:0 0 10px 10px;
        margin-bottom:3px;
    }
    #sidemenu ul ul ul li a {
        padding: 0 0 10px 20px;
        font-size:16px;
        font-weight: 500;
        color:#666;
    }
    #sidemenu ul ul ul li a:hover {
        color:#000
    }
    #sidemenu > ul > li > ul > li:last-child > a,
    #sidemenu > ul > li > ul > li.last > a {
        border-bottom: 0;
    }
    #sidemenu > ul > li > ul > li.open:last-child > a,
    #sidemenu > ul > li > ul > li.last.open > a {
        border-bottom: 0px solid #32373e;
    }
    #sidemenu > ul > li > ul > li.open:last-child > ul > li:last-child > a {
        border-bottom: 0;
    }
    #sidemenu ul ul li.has-sub {
        border-radius: 10px;
        /* background: #f3f5f9 url('/images/npps/sub/lnb-on.png') no-repeat 90% 10%; */
        margin-bottom:3px;

    }
    .link-site {
        width: 14px;
        height: 14px;
        padding-right:20px;
        background: url('/images/npps/common/link-site.png') no-repeat 100% 50%;
    }
    /* mobile-side menu */

    /* sidebar */
    .sidebar-wrap {
        position: fixed; 
        right: 0; 
        top: 150px; 
        bottom: 0; 
        z-index: 95; 
        display:none; 
        width: 0;
    }
    .sidebar-wrap.active {
        display: block; 
        width: 100%; 
        animation:sidebar-wrap-open 0.3s ease;
    } 
    .sidebar-wrap.active.inactive {
        width: 0; 
        animation:sidebar-wrap-close 0.3s;
    }
    @keyframes sidebar-wrap-open {
        from {width: 0;}
        to {width: 380px;}
    }
    @keyframes sidebar-wrap-close {
        from {width: 380px;}
        to {width: 0;}
    }
    .dimmed{ 
        display: none; 
        position: fixed; 
        top: 0; 
        left: 0; 
        width: 100%; 
        height: 100%; 
        z-index: 2; 
        background: rgba(0,0,0,.5); 
    }
    .dimmed.on{ 
        display: block; 
    }

    .sidebar-wrap .sidebar {
        position: absolute; 
        top: 0px; right: 0px; 
        bottom: 0px; 
        width: 380px;
        transition: width 0.3s; 
        font-size:14px; 
        box-shadow: 0 2px 4px -1px rgb(0 0 0 / 6%), 2px 6px 13px 0 rgb(0 0 0 / 7%); 
        background-color: #fff; 
        transform:translateX(100%);
    }
    .sidebar-wrap.active .sidebar {
        transform:translateX(0); 
        animation:sidebar-open 0.3s ease;
    }
    .sidebar-wrap.active.inactive .sidebar {
        animation:sidebar-close 0.3s ease-in-out;
    }
    @keyframes sidebar-open {
        from {transform:translateX(100%);}
        to {transform:translateX(0);}
    }
    @keyframes sidebar-close {
        from {transform:translateX(0);}
        to {transform:translateX(100%);}
    }
    .sidebar .sidebar-toolbar {
        min-height: 48px; 
        margin: 25px 0; 
        display: flex; 
        align-items: center;
    }
    .sidebar .sidebar-toolbar .title {
        margin-top: 13px; 
        font-size: 22px; 
        letter-spacing:0; 
        font-weight: 500; 
        color: #0d0c22; 
        font-family: 'PretendardGOV',sans-serif; 
        text-transform: capitalize;
    }
    .sidebar .sidebar-toolbar .btns {margin-left: auto;}

    .sidebar .sidebar-body { 
        position: absolute; 
        top:0; left:0; right:0; 
        bottom:0; padding: 30px; 
        overflow-x:hidden; 
        overflow-y:auto; 
        will-change:scroll-position; 
        -webkit-overflow-scrolling:auto; 
        -ms-overflow-style: none; 
    }
    .sidebar .sidebar-body::-webkit-scrollbar{-webkit-appearance:none;width:10px}
    .sidebar .sidebar-body::-webkit-scrollbar-thumb{
        border-radius:5px;
        background-color:rgba(116, 113, 117, 0.6);
        -webkit-box-shadow: 0 0 1px rgba(116, 113, 117, 0.6)
    }
    .sidebar-action {
        min-height: 30px; 
        padding: 0 25px; 
        margin: 0 0 0; 
        display: flex; 
        align-items: center;
    }
    .sidebar-body .title {
        margin-top: 13px; 
        padding-bottom: 20px; 
        font-size: 22px; 
        letter-spacing:0; 
        font-weight: 500; 
        color: #0d0c22; 
        text-transform: capitalize;
    }
    .sidebar-body .title > svg:first-child {
        margin-right: 6px; 
        width: 24px; 
        height: 24px; 
        vertical-align: -3px; 
        transform: scale(1.6);
    }
    .sidebar-close {
        position:absolute; 
        z-index:10; 
        top:35px; 
        right:30px; 
        width:40px; 
        height:40px; 
        transition: all 300ms ease;
    }

    .sidebar-close::before,
    .sidebar-close::after {
        display:inline-block; 
        content:""; 
        display:block; 
        position:absolute; 
        top:19px; 
        left:12px; 
        height:2px; 
        width: 60%; 
        background-color:#222227; 
        font-size:0; 
        line-height:0; 
        transform: rotate(0); 
        transition:all 0.2s ease-out;
    }
    .sidebar-close::before {
        transform: rotate(45deg);
    }
    .sidebar-close::after {
        transform: rotate(-45deg);
    }
    .sidebar .sidebar-close:hover::before,
    .sidebar .sidebar-close:hover::after {
        background-color:#111;
    }

    .sidebar-nav {
        display:block; 
        position:relative; 
        color:#0e0e19; 
        font-size:16px; 
        line-height:18px; 
        font-weight: 400; 
        letter-spacing:-0.48px;
    }

    .sidebar-nav .nav {
        position:relative; 
        height:100%; 
        padding-top:20px;
    }
    .sidebar-nav .nav>li ~ li {
        margin-top: 10px
    }
    .sidebar-nav .nav>li a {
        transition:all 0.3s; 
        -webkit-transition:all 0.3s;
    }
    .sidebar-nav .nav>li>:first-child,
    .sidebar-nav .nav>li>a {
        position:relative; 
        z-index:1; 
        display:block; 
        width:auto; 
        padding:10px 20px 10px 9px; 
        color:inherit; 
        margin-left: -8px; 
        margin-right: -8px; 
        border-radius: 8px; 
        transition: background .2s ease, width .2s ease;
    }
    .sidebar-wrap.active-2-level .sidebar-nav .nav>li>a {
        width:200px;
    }
    .sidebar-nav .nav>li>a:hover {
        background-color: #f6f6f6;
    }

    .sidebar-nav .nav>li.on>a {
        background:#e8fcf3; 
        color:#177340; 
        font-weight:400;
    }
    .sidebar-nav .nav>li>a .svg-arrow-right {
        position:absolute; 
        top:50%; 
        right:9px; 
        transform: translateY(-50%); 
        width: 10px; 
        height: 12px;
    }

    .sidebar-nav .nav>li>ul {
        display:none; 
        position:absolute; 
        top:20px; 
        left:auto; 
        right:0;
    }
    .sidebar-nav .nav>li.on>ul {
        display:block; 
        animation:builder-menu-ul-ani 0.7s ease;
    }
    @keyframes builder-menu-ul-ani {
        from {opacity: 0;}
        to {opacity: 1;}
    }

    .sidebar-nav .nav>li>ul {
        width: 200px;
    }
    .sidebar-nav .nav>li>ul>li ~ li {
        margin-top: 20px;
    }
    .sidebar-nav .nav>li>ul>li>a {
        position:relative; 
        display:block; 
        font-size: 18px; 
        font-weight:500; 
        padding: 20px; 
        border: 1px solid #f2f3f6; 
        border-radius: 12px; 
        box-shadow: 0 6px 14px rgb(0 0 0 / 0.06);
    }
    .sidebar-nav .nav>li>ul>li>a.on,
    .sidebar-nav .nav>li>ul>li>a.on:focus {
        color:#000;
    }
    .sidebar-nav .nav>li>ul>li.toggle>a.on,
    .sidebar-nav .nav>li>ul>li.toggle>a.on:focus {
        color:#0e0e19; 
        font-weight:normal;
    }
    .sidebar-nav .nav>li>ul>li.toggle>a::before {
        display:block; 
        content:""; 
        position:absolute; 
        left:0; 
        right:0; 
        top:auto; 
        bottom:-1px;
        width:100%; 
        height:1px; 
        background:#ebebeb;
    }
    .sidebar-nav .nav>li>ul>li.toggle>a::after {
        display:inline-block; 
        content:""; 
        position:absolute; 
        top:50%; 
        right:18px; 
        width:16px; 
        height:16px; 
        margin:-8px 0 0 -8px; 
        background-size:26px auto; 
        transition:all 0.2s ease-in-out; opacity:.6;
    }
    .sidebar-nav .nav>li>ul>li.toggle>a.on::before {
        background:#bcbccc;
    }
    .sidebar-nav .nav>li>ul>li.toggle>a.on::after {
        -webkit-transform:rotate(180deg); 
        transform:rotate(180deg); 
        opacity:1;
    }

    .sidebar-nav .nav>li>ul>li>ul {
        display:none; 
        padding:15px 0 15px 0;
    }
    .sidebar-nav .nav>li>ul>li>ul li>a {
        position:relative; 
        display:block; 
        padding:10px 10px; 
        font-size:14px;
    }
    .sidebar-nav .nav>li>ul>li>ul li>a::before {
        display:inline-block; 
        content:""; 
        position:absolute; 
        left:0; 
        top:19px; 
        width:2px; 
        height:2px; 
        background:#0e0e19; 
        opacity:.4;
    }
    .sidebar-nav .nav>li>ul>li>ul li>a.on, .sidebar-nav .nav>li>ul>li>ul li>a:focus {
        color:#1f7af7;
    }
    .sidebar-nav .nav>li>ul>li>ul li>a.on::before, .sidebar-nav .nav>li>ul>li>ul li>a:focus::before {
        background:#1f7af7;
    }
    .sidebar-nav .nav>li>ul>li>ul ul {
        padding:5px 0 5px 10px;
    }
    #lnbmenu {display: none;}
    .gnb-inner {
        width:100%;
        margin:0 auto;
        padding:0 3%;
        display: flex;
        justify-content:space-between;
        height:45px;
        line-height:45px;
    }
    .gnb-list {text-align: right;}

    nav {
        width:100%;
        margin:0 auto;
        height:130px;
        padding:55px 3% 0 3%;
        display: flex;
        justify-content:space-between;
        box-sizing: border-box;
    }
    .gallery-list ul {
        width:100%;
        border-bottom:1px #eee solid;
        padding:20px 0; 
        display: flex;
        flex-wrap: wrap;
        justify-content : space-between;
        gap: 15px 0
    }
    .gallery-list ul:last-child {
        border-bottom:1px #d5d5d5 solid;
    }
    .gallery-list ul li{
        box-sizing: border-box;   
        width: calc(25% - 15px); 
    }
    .gallery-info {
        padding-top:8px;
    }
    .gallery-info a {
        font-size: 16px;
        color:#222;
        font-weight: 600;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    .gal-infolist {
        padding-top:0px
    }
    .gal-infolist span {
        display: inline-block;
        font-size: 14px;
        color:#666;
        background: url('/images/npps/sub/gallery-bar.png') no-repeat 10px 45%;
        padding-left:20px;
    }
    .gal-infolist span:first-child {
        padding-left:0;
        background-image: none;
    }

    /* location */
    .location-area {
        display: flex;
        border-bottom:0px #e0e0e0 solid;
        padding-bottom:0px;
        margin-bottom:3%;
        justify-content:flex-start;
        flex-wrap: wrap;
    }
    .location-area h3 {
        font-size: 28px;
        width: 100%;
    }
    .loca-listarea span {
        display: inline-block;
        background: url('/images/npps/sub/loca-bar.png') no-repeat 0% 45%;
        color:#666;
        font-size:16px;padding-left:15px;
        margin-left:7px;
    }
    .loca-listarea span:last-child {
        color:#222
    }
    .loca-listarea span:nth-child(2) {
        background: none;
        padding-left:0px
    }
    .loca-listarea span:first-child {
        background: none;
        padding-left:0px;
        margin-left:0px;
    }
    .loca-listarea span.home {
        width: 15px;
        height: 15px;
        overflow: hidden;
        font-size: 0;
        background: url('/images/npps/sub/icon-home.png') no-repeat 0 55%;
        background-size: 13px;  
    
    }
    .location-area .loca-listarea {
        font-size: 15px;
        text-align: left;
        height: 100%;
    }

    footer { width:100%; padding:0 }
    .footer-contain { margin:20px 0 0 0; padding:0 2%; display: flex; justify-content: space-between; align-items: baseline; }
    .footer-menu  ul { width:100%; margin:0 auto; padding:0 5%; box-sizing: border-box; }
    .footer-rightarea { vertical-align: top; text-align: right; }
    .privacy{ font-size: 14px; padding:0 2%;}
    
    .header-pcarea {
	    background: url('/images/npps/main/main-bg1-header.png') no-repeat top center;
	}
	
	
	.session_wrap{display:block; text-align: center; font-size:18px; padding:0 8px; margin-right: 50px; line-height: 0px;}
	.session_wrap span{color:#d2e7e7; width:42px; margin-right: 5px;}
	.session_wrap .btn{padding: 5; background: #1a95a9; font-size: 14px;}
	.session_wrap a{color: #fff;}

}


@media (max-width:1000px) {
	#container h3 {font-size:50px; padding:40px 0 40px;}
}



@media (max-width:850px) {
	#container h3 {font-size:40px; padding:40px 0 10px;}
	#sub_wrapper {min-height:calc(100% - 313px);}
	.vote-subtit {text-align: center; padding-bottom: 4rem; font-size: 2.75rem;}
    .intro-subtit {text-align: center; padding-bottom: 6rem; font-size: 2.75rem;}
}


/* mobile area */
@media all and (max-width:780px) {
    /* header mobile*/
    .logo-area h1 {
        margin: 1rem;
    }
    .logo-area h1 img {
        height: 4rem;
    }
    .header-pcarea {display: none;}
    .nf-header {
        display: block;  
        position: relative; 
        z-index: 90; top: 0; left: 0; right: 0; 
        width: 100%; 
        height: 66px;
        line-height: 65px;
        min-height: 66px; 
        border-bottom:1px rgba(255, 255, 255, 0.20) solid;
    }
    .nf-toolbar {
        display:flex; 
        padding: 0 5%;
    }
    .nf-toolbar .logo {
        display:flex; 
        margin-right: auto;       
        transition: margin 0.3s ease-in-out;
        
    }
    .nf-toolbar .logo a {
        display:block; 
        color:#fff;
        font-size: 26px;
        font-weight: 600;
    }

    html.mobilemenu-open {
        overflow: hidden;
    }
    
    .mobilemenu-open {
        width: 29px;
        height: 25px;
        position: absolute;
        right: 3%;
        top: 22px;
        z-index: 1;
        background-size: 50%;
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
        text-align: right;
    }
    .mobilemenu-area {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
    .mobilemenu-open span {
        display: block;
        width: 29px;
        height: 4px;
        background-color: #fff;
        border-radius: 50px;
    }
    .mobilemenu-open span:nth-child(2) {
        width: 19px;
        margin:5px 0
    }

    .mobilemenu-close {
        width: 18px;
        height: 18px;
        position: absolute;
        right:20px;
        top: 30px;
        background: url('/images/npps/common/side-close.png') no-repeat 50% 50%;
        background-size: 18px auto;
        cursor: pointer;
        z-index: 999;
    }
    .side-toparea {
        padding:0px 0 0 20px;
    }
    .side-toplist {
        padding-right:30px;
    }

    .side-toplist span {
        display: inline-block;
        font-size: 18px;
        font-weight: 600;
        color:#fff;    
        padding-right:10px;
        text-transform: uppercase;
    }
    #sidemenu {
        height: 100%;
    }
    #sidemenu,
    #sidemenu ul,
    #sidemenu ul li,
    #sidemenu ul li a {
        margin: 0;
        padding: 0;
        border: 0;
        list-style: none;
        line-height: 1;
        display: block;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #sidemenu {
        width: 100%;
        font-family: 'PretendardGOV', sans-serif;
        padding:5%;
    }
    #sidemenu ul ul {
        display: none;
    }
    .align-right {
        float: right;
    }
    #sidemenu > ul > li > a {
        border:1px solid #c5c5c5; 
        margin-bottom:3px;
        border-radius:10px;
        font-size:22px;
        font-weight:600px;
        color:#666;
        /* background: #fff url('/images/npps/sub/lnb-on.png') no-repeat 90% 50%; */
        transition: 0.2s;
        display: block;
        padding: 15px 20px ; 
    }
    #sidemenu > ul > li > a:hover,
    #sidemenu > ul > li.active > a,
    #sidemenu > ul > li.open > a {
        color: #fff; 
        background: #1764c4 url('/images/npps/sub/lnb-off.png') no-repeat 90% 50%;
        border-radius:10px;    
        border:1px solid #1764c4; 
    }
    #sidemenu > ul > li.open > a {
        color:#fff;
        box-shadow: none;
        border-radius: 10px;
        font-weight:600px;
    }
    #sidemenu > ul > li:last-child > a,
    #sidemenu > ul > li.last > a {
        border-bottom:1px solid #c5c5c5; 
        font-weight:600px;
    }
    #sidemenu ul ul li a {
        display: block;
        padding: 15px 20px ; 
        font-size: 18px;
        font-weight: 500;
        background: #f3f5f9;
        margin-bottom:3px;
        border-radius: 10px;
        color:#666;
    }
    #sidemenu ul ul li.open > a,
    #sidemenu ul ul li.active > a {
        background: #f3f5f9;
        color: #1764c4;  
        margin-bottom:0;  
    }
    #sidemenu ul ul li:first-child > a {
        box-shadow: none;
    }
    #sidemenu ul ul ul li:first-child > a {
    /* box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); */
        border-radius:0px;
    }

    #sidemenu ul ul ul {
        padding:0 0 10px 0;
        border-radius:0 0 10px 10px;
        margin-bottom:3px;
    }
    #sidemenu ul ul ul li a {
        padding: 0 0 10px 20px;
        font-size:15px;
        font-weight: 500;
        color:#666;
    }
    #sidemenu ul ul ul li a:hover {
        color:#000
    }
    #sidemenu > ul > li > ul > li:last-child > a,
    #sidemenu > ul > li > ul > li.last > a {
        border-bottom: 0;
    }
    #sidemenu > ul > li > ul > li.open:last-child > a,
    #sidemenu > ul > li > ul > li.last.open > a {
        border-bottom: 0px solid #32373e;
    }
    #sidemenu > ul > li > ul > li.open:last-child > ul > li:last-child > a {
        border-bottom: 0;
    }
    #sidemenu ul ul li.has-sub {
        border-radius: 10px;
        /* background: #f3f5f9 url('/images/npps/sub/lnb-on.png') no-repeat 90% 10%; */
        margin-bottom:3px;

    }
    
    .location-area {
        display: flex;
        border-bottom:0px #e0e0e0 solid;
        padding-bottom:0px;
        margin-bottom:3%;
        justify-content:flex-start;
        flex-wrap: wrap;
    }
    #lnbmenu {display: none;}
    .nf-content {
        max-width: 100%;
        padding:0 3%;
        margin: auto; transition: margin-left 0.3s;
    }
    .content-right{
        flex-grow: 1;
        margin-left:0px;
        padding:20px 0 60px 0;
    }
    
    .vote-subtit {text-align: center; padding-bottom: 4rem; font-size: 2.25rem;}
    .intro-subtit {text-align: center; padding-bottom: 6rem; font-size: 2.25rem;}
    /* footer */
    footer {
        width:100%;
    }
    .footer-menu {
        width:100%;
        padding:15px 3%;
        text-align: center;
    }
    .footer-menu  ul {padding: 7px 10px}
    .footer-menu  ul li {
        display: inline-block;
        padding: 3px 10px;
        margin-left:0px;
        font-size: 14px;
        background-image: none;
        font-weight: 500;
    }

    .footer-contain {
        width: 100%;
        margin-top:3%;
        padding:0 3%;
        font-size: 14px;
        flex-wrap: wrap;
    }

    .f-logo {
        width: 160px;
        height: 32px;
        background: url('/images/npps/common/f-logo.png') no-repeat 0 50%;
        font-size: 20px;
        color:#666;
        font-weight: 500;
        font-family: 'ROKG_R',sans-serif;
        padding-left:40px;
        margin-bottom:10px
    }
    
    .side-logoarea {
        padding-top:30px;
        display: flex;
        padding-bottom:0px;
    }
    .wa-icon {
        display: inline-block;
        width: 28px;
        height: 23px;
        background: url('/images/npps/common/wa-logo.png') no-repeat 50% 50%;
        font-size: 0;
    }
    .copyright {
        font-size: 13px;
        text-align: left;
    }
    .privacy {
        font-size: 14px;
        padding: 0;
    }
    .footer-leftarea {
        width:100%
    }

    .footer-contain-banner .footer-rightarea div { float: right; }
    
    .footer-rightarea {
        vertical-align: bottom;
        text-align: left;
    }
    .footer-rightarea div { float: left; }
    .footer-rightarea div img { width: 18rem; }
	
	.header-pcarea {
	    background: url('/images/npps/mbnagnd/main/main-bg2-header.png') no-repeat top center;
	}
	
	.nf-header {
		background: url('/images/npps/mbnagnd/main/main-bg2-header.png') no-repeat top center;
	}
    
    
	
	.session_wrap{display:block; text-align: center; font-size:16px; padding:0 8px; margin-right: 25px; line-height: 0px;}
	.session_wrap span{color:#d2e7e7; width:42px; margin-right: 5px;}
	.session_wrap .btn{padding: 5; background: #1a95a9; font-size: 12px;}
	.session_wrap a{color: #fff;}
}


@media (max-width:768px) {
	.ple_link img {width:72px;}
	
	 #container {padding:0 10px;}
	 #container h3 {font-size:34px; padding:30px 0 10px;}

}


@media all and (max-width:640px) {
    /* 기상정보 */
    .pollen-list li {
        padding: 30px 15px 10px 15px;
        font-size: 16px;
        font-weight: 600;
        text-align: center;
    }
    .pollen-list li span{
        display: block;
        width: 75px;
        height: 75px;
        margin-bottom:5px;
        border-radius: 50%;
        overflow: hidden;
    }
    .bsTable table {
        width: 800px;
        border-collapse: separate;
        border-spacing: 0;
    }
    .web-linklist li {
        display: inline-block;
        background-color: #fff;
        border:1px #c8c8c8 solid;
        box-shadow: 3px 0 5px rgba(0, 0, 0, 0.12);
        border-radius: 50px;
        height: 100%;
        line-height: 1.4;
        padding:5px 20px;
        font-size: 16px;
        font-weight: 600;
        color:#222;
        text-align: center;
        margin-right:5px;
        margin-bottom:10px
    }

    /* 민방위 */
    .civil-listarea {
        width: 100%;
        padding-top:40px;
    }
    .civil-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .civil-list li {
        width: 80%;
        margin-right:0%;
        margin-bottom:3%;
        padding-right:0%;
        text-align: center;
        border-bottom:2px #d9d9d9 dashed;
        background: none;
    }
    .civil-list li:last-child {
        margin-right:0;
        padding-right:0;
        background: none;
        border-bottom:0
    }
    .civil-list li h4 {
        display: inline-block;
        background-color: #1764c4;
        color:#fff;
        font-size: 16px;
        font-weight: 600;
        padding:10px 25px;
        border-radius: 50px;
        text-align: center;
        margin-bottom:20px
    }
    .civil-list li p {
        font-size: 15px;
        color:#555;
        line-height: 1.3;
        padding-bottom:10px
    }

    .civil-list1 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .civil-list1 li {
        width: 80%;
        margin-right:0%;
        padding-right:0%;
        margin-bottom:3%;
        text-align: center;
        border-bottom:2px #d9d9d9 dashed;
        background: none;
    }
    .civil-list1 li:last-child {
        margin-right:0;
        margin-bottom:0;
        padding-right:0;
        background: none;
        border-bottom:0
    }
    .civil-list1 li h4 {
        display: inline-block;
        background-color: #1764c4;
        color:#fff;
        font-size: 18px;
        font-weight: 600;
        padding:10px 25px;
        border-radius: 50px;
        text-align: center;
        margin-bottom:20px
    }
    .civil-list1 li p {
        font-size: 16px;
        color:#555;
        line-height: 1.3;
        padding-bottom:10px
    }

    .downloard-list {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        
    }
    .downloard-list li {
        width: 48%;
        box-sizing: border-box;
        padding:15px 30px 15px 15px;
        border:1px #dfdfdf solid;
        margin-right:2%;
        margin-bottom:2%;
        font-size: 16px;
        font-weight: 600;
        border-radius: 10px;
        color:#666;
        background: #fff url('/images/npps/temp/btn-down2.png') no-repeat 93% 18px;
        transition: 0.3s;
    }
    .downloard-list li a {
        color:#666
    }
    .downloard-list li:hover {
        border:1px #222 solid;
        background: #222 url('/images/npps/temp/btn-down02.png') no-repeat 93% 20px;
        box-shadow: 3px 0 5px rgba(0, 0, 0, 0.12);
    }
    .downloard-list li:hover a {
        color:#fff
    }
    .downloard-list li:last-child {
        margin-right:0
    }
    .downloard-list li:nth-child(2) {
        margin-right:0
    }

    /* 입력폼 TABLE */
    .bbs-view {
        width: 100%;
        border-top:2px #222 solid;
        border-bottom:0px #ddd solid;
        padding:0px 0
    }
    .bbs-view li {
        display: flex;
        flex-wrap: wrap;
        padding:15px 0;
        border-bottom:1px #ddd solid
        /* border-bottom:1px #ccc solid */
    }

    .info-titarea {
        font-size: 16px;
        font-weight: 600;
        color:#222;
        width: 100%;
    }
    .info-titarea1 {
        font-size: 16px;
        font-weight: 600;
        color:#222;
        width: 100%;
    }
    .info-titarea1.lh {
        font-size: 16px;
        font-weight: 600;
        color:#222;
        padding-top:4px
    }
    .info-formarea {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        padding-top:5px;        
    }
    .info-formarea1 {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }
    .info-formarea input, .info-formarea select .info-formarea button{
        height:40px;
        border-radius: 5px;
        margin-bottom:5px;
    }
    .form-radioarea {
        padding-top:10px;
    }
    .form-radioarea1 {
        padding-top:10px;
    }
    .info-formarea.ta-c {
        justify-content: center;
    }
    .info-address .info-formarea input {
        width:77%;
        margin-bottom:5px;
        font-size: 14px;
        color:#666
    }
    .info-address .info-formarea input:last-of-type {
        width:77%;
        margin-bottom:0px
    }
    .info-address .info-formarea .btn-address {
        height: 40px;
        width:20%;
        text-align: center;
        line-height: 40px;
        font-size: 14px;
    }
    .info-address .info-formarea .btn-address:hover {
        background-color: #054788;
        border: 1px #054788 solid;
    }



    .robot-area .robot-list {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        
    }
    .robot-area .robot-list li{
        margin:0 15px 0 0 !important;
        display: inline-block;
        height:18px !important;
        line-height:18px !important;
        vertical-align: middle !important;
        padding:0 0 5px 0;
        font-weight: 600; border-bottom:0px
    }
}

@media (max-width:500px) {
	#container h3 {font-size:25px;padding:20px 0 10px; line-height:1.2;}
    #container h3.pb2r {padding-bottom: 1rem;} 
}

@media all and (max-width:480px) {
    .header-pcarea {display: none;}
    .nf-toolbar .logo a {
        display:block; 
        color:#fff;
        font-size: 22px;
        font-weight: 600;
    }
    .mobilemenu-open span {
        display: block;
        width: 25px;
        height: 3px;
        background-color: #fff;
        border-radius: 50px;
    }
    .mobilemenu-open span:nth-child(2) {
        width: 16px;
        margin:4px 0
    }
    #menu {
        width: 80%;
        height: 100%;
        position: fixed;
        top: 0px;
        right: -81%;
        z-index: 10;
        background-color: white;
        transition: All 0.3s ease;
        -webkit-transition: All 0.3s ease;
        -moz-transition: All 0.3s ease;
        -o-transition: All 0.3s ease;
    }
    .mobilemenu-close {
        width: 18px;
        height: 18px;
        position: absolute;
        right:20px;
        top: 20px;
        background: url('/images/npps/common/side-close.png') no-repeat 50% 50%;
        background-size: 18px auto;
        cursor: pointer;
        z-index: 999;
    }
    .side-toparea {
        padding:20px;
    }
    .side-toplist {
        padding-right:30px;
        display: flex;
        flex-wrap: wrap;
    }

    .side-toplist span {
        display: inline-block;
        font-size: 15px;
        font-weight: 500;
        color:#fff;    
        padding-right:20px;
        text-transform: uppercase;
    }
    
    #sidemenu > ul > li > a {
        border:1px solid #c5c5c5; 
        margin-bottom:3px;
        border-radius:10px;
        font-size:20px;
        font-weight:600px;
        color:#666;
        /* background: #fff url('/images/npps/sub/lnb-on.png') no-repeat 90% 50%; */
        transition: 0.2s;
        display: block;
        padding: 15px 20px ; 
    }
    
    .vote-subtit {text-align: center; padding-bottom: 2rem; font-size: 1.8rem;}
    .intro-subtit {text-align: center; padding-bottom: 3rem; font-size: 1.8rem;}    
    
    /* footer */
    footer {
        width:100%;
    }
    .footer-menu {
        width:100%;
        padding:15px 3%;
        text-align: center;
    }
    .footer-menu  ul {padding: 5px 7px}
    .footer-menu  ul li {
        display: inline-block;
        padding: 3px 10px;
        margin-left:0px;
        font-size: 13px;
        background-image: none;
        font-weight: 600;
    }
    
    .footer-contain {
        width: 100%;
        margin-top:3%;
        padding:0 3%;
        font-size: 13px;
        flex-wrap: wrap;
    }


    .f-logo {
        width: 160px;
        height: 32px;
        background: url('/images/npps/mbnagnd/common/f-logo.png') no-repeat 0 50%;
        font-size: 18px;
        background-size: 28px;
        color:#666;
        font-weight: 500;
        font-family: 'ROKG_R',sans-serif;
        padding-left:33px;
        margin-bottom:5px
    }
    .footer-rightarea {
        vertical-align: bottom;
        text-align: left;
    }

    .side-logoarea {
        padding-top:30px;
        display: flex;
        padding-bottom:0px;
    }
    .wa-icon {
        display: inline-block;
        width: 28px;
        height: 23px;
        background: url('/images/npps/common/wa-logo.png') no-repeat 50% 50%;
        font-size: 0;
    }
    .copyright {
        font-size: 12px;
        text-align: left;
    }

    .footer-leftarea {
        width:100%
    }
        
    .footer-rightarea { width:100%; vertical-align: bottom; text-align: left; padding-bottom:0;}
    .footer-rightarea div { float: left; }
    .footer-rightarea div img { width: 14rem; }
    
    .radio svg {
        position: absolute; 
        top: 50%; left: 4px;
         width: 10px; 
         height: 10px; 
         margin-top: -5px; 
         pointer-events: none;
    }
    
    .header-pcarea {
	    background: url('/images/npps/mbnagnd/main/main-bg3-header.png') no-repeat top center;
	}
	
	.nf-header {
		background: url('/images/npps/mbnagnd/main/main-bg3-header.png') no-repeat top center;
	}
}

/* 정책숙성 추가 css---str */

.ripen-warp {margin-bottom: 10rem; width: 100%; height: auto; border-top: 1px solid #111111;}
.ripen-warp .ripen-box {border: 1px solid #ddd; border-radius: 1.2rem; margin: 3rem 0}
.ripen-warp .ripen-box .ripen-header {display: flex; justify-content: space-between; align-items: center; padding: 2.4rem 3.2rem; border-radius: 1.2rem 1.2rem 0 0; background: #F9F9F9;}
.ripen-warp .ripen-box .ripen-header .ripen-h1 {font-size: 3.2rem; font-weight: 600;     display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; width: 80%;}
.ripen-warp .ripen-box .ripen-header .ripen-view {background: #eee; padding: 0 2rem; border-radius: 2rem; height: 4rem; display: flex; align-items: center;}
.ripen-warp .ripen-box .ripen-header .ripen-num {color: #ccc; text-align: center}
.ripen-warp .ripen-box .ripen-cont {padding: 1.6rem 3.2rem 4rem;}
.ripen-warp .ripen-box .ripen-cont .survey-progress {font-size: 1.6rem;padding: 0.6rem;color: #FFF;border-radius: 0.6rem;min-inline-size: fit-content;background: #FFB114;display: flex;margin-right: 1.5rem;}
.ripen-warp .ripen-box .ripen-cont .acco-btn .l-bar{position: absolute;left: 0.5rem;background: url(/images/npps/mbnagnd/common/icon-l.png) no-repeat;top: 0; width: 20px; height: 20px;}
.ripen-warp .ripen-box .ripen-cont .acco-btn .acco-label {font-size: 1.6rem; padding: 0.6rem; color: #FFF; border-radius: 0.6rem; min-inline-size: fit-content; display:flex; margin-right: 1rem}
.ripen-warp .ripen-box .ripen-cont .acco-btn .acco-tit {font-size: 2.1rem; font-weight: 500}

.ripen-warp .ripen-box .ripen-cont .acco-btn { background-color: #FFF; color: #444; cursor: pointer; padding: 0 4rem; width: 100%; border: none; text-align: left; outline: none; font-size: 21px; transition: 0.4s; position: relative; display: inline-flex; align-items: center; margin: 1.8rem 0; }
/* .ripen-warp .ripen-box .ripen-cont .acco-btn span.arrow { position: absolute; width: 24px; height: 24px; right:3rem; background: url(/images/npps/mbnagnd/common/arrow-down.svg) no-repeat right; } */    
/* .ripen-warp .ripen-box .ripen-cont .acco-active span.arrow { position: absolute; right:3rem; background: url(/images/npps/mbnagnd/common/arrow-top.svg) no-repeat right; } */
.ripen-warp .ripen-box .ripen-cont .acco-btn span.arrow { position: absolute; width: 24px; height: 24px; right:3rem; background: url(/images/npps/pres/cmmn/icon_linkArr.png) no-repeat right; }    

.ripen-warp .ripen-box .ripen-cont .pl-content { background-color: #F9F9F9; border-bottom:1px solid #ddd; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; position: relative; margin-left: 4rem;}
.ripen-warp .ripen-box .ripen-cont .pl-content .acco-txt { font-size: 1.6rem; padding: 1.8rem; }
.ripen-warp .ripen-box .ripen-cont .pl-content p { margin-bottom: 0 !important; }
.ripen-warp .ripen-box .ripen-cont .pl-content .btn-area {padding: 1.2rem; text-align: right; width: 100%; border-top:1px solid #ddd}
.ripen-warp .ripen-box .ripen-cont .pl-content .pl-btn {font-size: 1.4rem; padding: 0.6rem 1.2rem; color: #FFF; text-align: center; margin-left: 1rem}

.heart {background: url(/images/npps/mbnagnd/common/heart_icon.svg) no-repeat 0 50%; background-size:20px; font-size: 18px; color:#8A949E; font-weight: 500; padding-left:30px;}




@media all and (max-width:1024px) { 
    .heart { font-size: 13px; padding-left: 24px;background-size: 19px;}
    .talk { padding-top: 0; }
    .ripen-warp .ripen-box .ripen-cont .acco-btn .acco-tit { display: -webkit-box; text-overflow: ellipsis; line-height: 2.4rem; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; width: 84%}
    .ripen-warp .ripen-box .ripen-header .ripen-view {background: #FFF; padding: 0; border-radius: 0rem; height: 0rem; display: flex; flex-flow: row; margin-top: 1rem;}
    .ripen-warp .ripen-box .ripen-header .ripen-view .e-icon{background: #eee; padding: 0 1rem; border-radius: 2rem; height: 3rem; display: inline-flex;}
    .ripen-warp .ripen-box .ripen-header .ripen-view .e-icon .talk{padding-top: 0.75rem;}
    
}
@media all and (max-width:820px) {
    .ripen-warp .ripen-box .ripen-header .ripen-h1 { font-size: 2.8rem; font-weight: 600; display: -webkit-box; text-overflow: ellipsis; line-height: 4rem; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; width: fit-content;}
	.ripen-warp .ripen-box .ripen-cont .acco-btn .acco-label {font-size: 1.2rem;padding: 0.6rem;color: #FFF;border-radius: 0.6rem;text-align: center; min-inline-size: fit-content; margin-right: 1rem;}
	.ripen-warp .ripen-box .ripen-cont .survey-progress {font-size: 1.2rem;padding: 0.6rem;color: #FFF;border-radius: 0.6rem;background: #FFB114;text-align: center;min-inline-size: fit-content;margin-right: 1rem;}
    .ripen-warp .ripen-box .ripen-header .btn1 {margin-top: 2.5rem; display: flex; justify-content: flex-start; width: 100%; background: #F9F9F9;}
    .ripen-warp .ripen-box .ripen-header .ripen-view {background: #FFF; padding: 0; border-radius: 0rem; height: 0rem; margin-top: 1.5rem; margin-bottom: 1.5rem;}
}
@media all and (max-width:768px) {
    .ripen-warp .ripen-box .ripen-cont .acco-btn .acco-tit {font-size: 1.8rem; display: -webkit-box; text-overflow: ellipsis; line-height: 2.4rem; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; width: 75%}
    .ripen-warp .ripen-box .ripen-header .ripen-h1 { font-size: 2.4rem; font-weight: 600; display: -webkit-box; text-overflow: ellipsis; line-height: 3rem; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; width: fit-content;}
}
@media all and (max-width:820px) {
	/* .ripen-warp .ripen-box .ripen-header .ripen-view {background: #white; padding: 0; border-radius: 0rem; height: 0rem; display: flex; flex-flow: row; margin-top: 1rem;} */
    .ripen-warp .ripen-box .ripen-header .ripen-view .e-icon{background: #eee; padding: 0 1rem; border-radius: 2rem; height: 3rem; display: inline-flex;}
    .ripen-warp .ripen-box .ripen-header .ripen-view .e-icon .talk{padding-top: 0.75rem;}
}

@media all and (max-width:460px) {
	.header-top {display: flex; flex-direction: column; width: 100%;}
    .ripen-warp .ripen-box .ripen-header {display: block; align-items: center; padding: 1.6rem; border-radius: 1.2rem 1.2rem 0 0; background: #F9F9F9;}
    .ripen-warp .ripen-box .ripen-header {display: block; align-items: center; padding: 1.6rem; border-radius: 1.2rem 1.2rem 0 0; background: #F9F9F9;}
    .ripen-warp .ripen-box .ripen-header .btn1 {margin-top: 2.5rem; display: flex; justify-content: flex-start; width: 100%; background: #F9F9F9;}
    .ripen-warp .ripen-box .ripen-header .ripen-view {background: #FFF; padding: 0; border-radius: 0rem; height: 0rem; margin-top: 2.5rem; margin-bottom: 1.5rem;}
    .ripen-warp .ripen-box .ripen-header .ripen-view .e-icon{background: #eee; padding: 0 1rem; border-radius: 2rem; height: 3rem; display: inline-flex;}
    .ripen-warp .ripen-box .ripen-header .ripen-view .e-icon .talk{padding-top: 0.75rem;}
    .ripen-warp .ripen-box .ripen-header .ripen-num {color: #ccc; text-align: left;}
    .ripen-warp .ripen-box .ripen-cont {padding: 1.6rem 2rem;}
    .ripen-warp .ripen-box .ripen-cont .acco-btn .l-bar{left: -0.5rem;background: url(/images/npps/mbnagnd/common/icon-l.png) no-repeat;width: 14px;height: 14px;background-size: cover; align-self: anchor-center; bottom: 10px;}
    .ripen-warp .ripen-box .ripen-cont .acco-btn .acco-tit {font-size: 1.8rem;font-weight: 500;width: 70%;}
    
    .ripen-warp .ripen-box .ripen-cont .acco-btn {background-color: #FFF;color: #444;cursor: pointer;padding: 0 1.6rem;width: 100%;border: none;text-align: left;outline: none;font-size: 21px;transition: 0.4s;position: relative;display: inline-flex;align-items: center;margin: 1.8rem 0;}
    .ripen-warp .ripen-box .ripen-cont .acco-btn span.arrow {position: absolute;width: 24px;height: 24px;right: 0;background: url(/images/npps/pres/cmmn/icon_linkArr.png) no-repeat right;}    
/*     .ripen-warp .ripen-box .ripen-cont .acco-btn span.arrow {position: absolute;width: 24px;height: 24px;right: 0;background: url(/images/npps/mbnagnd/common/arrow-down.svg) no-repeat right;}    
    .ripen-warp .ripen-box .ripen-cont .acco-active span.arrow { position: absolute; right:0; background: url(/images/npps/mbnagnd/common/arrow-top.svg) no-repeat right; } */
    
    .ripen-warp .ripen-box .ripen-cont .pl-content {margin-left: 1.6rem;}
}

/* 정책숙성 추가 css---end */

/*******************************************************************
 *   준비중 : 2026.07. str
 ******************************************************************/
.page-container {
    width: 100%;
    margin: 0 auto;
}

/* 상단 딥 네이비 헤더 */
.top-header {
    background-color: #0B3866; /* 원본 이미지의 딥 네이비 칼라 */
    padding: 50px 20px;
    text-align: center;
    width: 100%;
}

.top-header h1 {
    color: #ffffff;
    font-size: 38px;
    font-weight: 700;
}

/* 메인 콘텐츠 영역 (중앙 정렬) */
.content-wrapper {
    max-width: 1200px;
    margin: 100px auto 180px;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content-box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
}

/* 왼쪽 아이콘 이미지 */
.icon-group {
    display: flex;
    align-items: center;
}

.icons-img {
    height: 110px; 
    width: auto;
    display: block;
}

/* 중앙 세로 구분선 */
.divider {
    width: 1px;
    height: 140px;
    background-color: #E2E8F0; 
}

/* 오른쪽 텍스트 블록 */
.text-group {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.subtitle {
    font-size: 26px;
    font-weight: 400;
    color: #333333;
    margin-bottom: 8px;
    line-height: 1.3;
}
.subtitle.mb40 {margin-bottom: 40px}

.highlight-text {
    font-size: 28px;
    font-weight: 800; /* 두꺼운 강조 폰트 */
    color: #111111;
    margin-bottom: 40px; /* 아래 문구와의 여백 */
    line-height: 1.3;
}

.status-text {
    font-size: 26px;
    font-weight: 400;
    color: #333333;
    line-height: 1.3;
}

/* 반응형 모바일 대응 */
@media (max-width: 868px) {
    .top-header h1 {
        font-size: 28px;
    }

    .content-wrapper {
        margin: 50px auto;
    }

    .content-box {
        flex-direction: column;
        gap: 30px;
        text-align: center;
    }

    .divider {
        width: 80%;
        height: 1px; /* 모바일에서는 가로 구분선으로 변경 */
    }

    .icons-img {
        height: 80px;
    }

    .subtitle, .status-text {
        font-size: 20px;
    }

    .highlight-text {
        font-size: 22px;
        margin-bottom: 24px;
    }
}
/*******************************************************************
 *   준비중 : 2026.07. end
 ******************************************************************/
 
/*******************************************************************
 *   정책참여단 : 2026.07. str
 ******************************************************************/
.page-container {
    width: 100%;
    margin: 0 auto;
}

/* 1. 상단 하늘색 섹션 */
.main-banner {
    background-color: #92C5F0; /* 이미지 특유의 화사한 하늘색 */
    padding: 60px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.banner-header {
    width: 100%;
    max-width: 800px;
    margin-bottom: 30px;
}

/* 문구와 오른쪽 실선을 한 줄에 배치 */
.sub-title-wrapper {
    display: flex;
    align-items: center; /* 선이 중앙 쪽에 이어지도록 정렬 */
    gap: 20px;
    width: 100%;
}

.sub-title {
    color: #0B3A82; /* 딥 블루 계열 강조 텍스트 */
    font-size: 22px;
    font-weight: 700;
    line-height: 1.4;
    white-space: nowrap; /* 텍스트 줄바꿈 방지 */
}

/* 오른쪽으로 길게 뻗는 흰색 선 */
.line-extension {
    flex: 1; /* 남은 오른쪽 공간을 전부 채움 */
    height: 1px;
    background-color: rgba(255, 255, 255, 0.85);
    margin-bottom: 18px; /* 문구 마지막 줄 위치와 세밀한 수평 매칭 */
}

.main-title {
    color: #111111;
    font-size: 42px;
    font-weight: 800;
    margin-top: 20px;
}

/* 2. 중앙 흰색 카드 */
.info-card {
    background-color: #ffffff;
    width: 100%;
    max-width: 800px;
    border-radius: 4px;
    padding: 50px 60px 0 60px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

/* 정책참여단이란? 영역 */
.intro-section {
    margin-bottom: 40px;
}

.intro-title {
    color: #0B3A82;
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 14px;
}

.intro-desc {
    color: #444444;
    font-size: 16px;
    line-height: 1.6;
    font-weight: 500;
}

/* 정보 리스트 스타일 */
.info-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 30px;
}

.info-list li {
    display: flex;
    align-items:flex-start;
    gap: 24px;
}

/* 남색 둥근 라벨 패치 */
.badge-nv {
    background-color: #003380;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    width: 180px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    flex-shrink: 0;
    letter-spacing: 4px;
    padding-left: 4px;
}

.desc {
    font-size: 16.5px;
    color: #333333;
    line-height: 1.5;
    margin-top: 10px;
}

.desc strong {
    font-weight: 700;
    color: #111111;
}

/* 하단 그래픽 영역 */
.graphic-area {
    position: relative;
    margin-top: 20px;
}

.people-img {
    width: 100%;
    height: auto;
    display: block;
}

.cta-text {
    position: absolute;
    right: 20px;
    top: 18%;
    font-size: 21px;
    font-weight: 800;
    color: #0B3A82;
}

/* 3. 하단 버튼 영역 */
.action-section {
    background-color: #ffffff;
    padding: 40px 20px 60px;
    text-align: center;
}

.btn-join {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: #003380;
    color: #ffffff;
    text-decoration: none;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    width: 160px;
    height: 72px;
    border-radius: 2px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.btn-join:hover, .btn-join:active, .btn-join:checked {
    background-color: #002257;
    color: #ffffff;
    transform: translateY(-2px);
}

/* 반응형 모바일 대응 */
@media (max-width: 767px) {
    .sub-title {
        font-size: 17px;
        white-space: normal; /* 모바일에서는 자동 줄바꿈 허용 */
    }

    .line-extension {
        display: none; /* 모바일의 아주 작은 화면에서는 선 숨김 처리 */
    }

    .main-title {
        font-size: 30px;
    }

    .info-card {
        padding: 30px 20px 0 20px;
    }

    .intro-title {
        font-size: 19px;
    }

    .intro-desc {
        font-size: 14px;
    }
    
    .info-list li {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .badge {
        width: 85px;
        height: 32px;
        font-size: 13.5px;
    }

    .desc {
        font-size: 15px;
    }
    
    .desc br {
        display: none;
    }


    .cta-text {
        position: static;
        text-align: center;
        margin-top: 15px;
        font-size: 17px;
        padding-bottom: 20px;
    }
    
}
/*******************************************************************
 *   정책참여단 : 2026.07. end
 ******************************************************************/