@charset "utf-8";



html,body{height: 100%;margin:0;padding:0; overflow:hidden;}

#pns-module { 
    position: absolute; width:100%;left:0;top:0;height: 100%; font-family: 'Noto Sans KR', sans-serif  }
#dummy-header { 
    text-align: center; 
    position: relative; 
    z-index: 1000; 
    width: 100%;
    height: 152px; 
     }
#dummy-header .dummytop { background: #000; height: 52px;  }
#dummy-header .dummyimg { background: url('../img/site/header.jpg') #fff no-repeat 50%; height: 100%; min-width: 1000px; margin: auto; position: absolute; left: 50%; top:0; margin-left: -960px;}

#pns { position: absolute; left:0; top:0; width: 100%; height: 100%; background: #333; }


.member-login-container { position: absolute; left: 0; top: 0; z-index: 4999; width: 100%; height: 100%; opacity:0; transition: all ease 0.4s;
    background: rgba(0,0,0,0.3);
 }
.member-login-group { display: flex; align-items: center; height: 100%; justify-content: center }
.member-login-item { width: 800px; height: 437px; position: relative; background: url(../img/tmp/login.png) no-repeat 50%;}
.member-login-close{ position: absolute; left: 734px; top: 24px; width: 40px; height: 40px; cursor: pointer; }


#pns-module #quickpannel{ 
    height: 100%; display: flex; align-items: center; pointer-events: none; 
    z-index: 4001;
    font-size: 12px;
    position: absolute;
    top:0;
    right: 10px;
    z-index: -1;
}

@media (max-height:990px)
{
    #pns-module #quickpannel{
        height: auto;
        top:10px;
        
    }
}

#quickpannel .group { 
    background: rgba(255,255,255,1.3); margin: 0; text-align: center; width: 220px; border-radius: 5px;
    overflow:hidden;
    padding: 0;
}



#quickpannel .no-item { height: 10px; display: flex; }
#quickpannel .no-item .icon { width: 60px; background: #f6f6f6;  height: 100%; }
#quickpannel .no-item .text { height: 100%;  }

#quickpannel .item { 
    padding: 0; margin: 0; pointer-events: auto; cursor: pointer;
    display: flex;
    color: #163567;
    height: 50px;
    font-weight: bold; 
 }
#quickpannel .item .icon {
    background: #f6f6f6; width: 60px; text-align: center; height: 100%; 
    font-size: 2.6em;
    display: flex; align-items: center; justify-content: center;
 }
#quickpannel .item .text { 
    padding: 0 18px; height: 100%; font-size: 1.4em; 
    display: flex; align-items: center; justify-content: center;
 }


#quickpannel .item:hover,
#quickpannel .item:active { background: #163567; color: #fff; }

#quickpannel .item:hover .icon,
#quickpannel .item:active .icon { background: transparent; }

#quickpannel .title {  border-radius: 0; font-size: 1.4em; font-weight: bold; padding: 10px; background: #39b0e3; color: #fff; border:0;  margin: 0; cursor: default; user-select: none; }
#quickpannel .title:hover { background: #39b0e3; color: #fff; }
#quickpannel .item:last-child { border-bottom: 0;  }



#view-content { 
    width:100%;
    height:100%;
    display: flex; align-items: center; justify-content: center; font-size: 12px; 
    opacity: 0.9;
}
#view-content .vg {height: 100%; flex:1; }

#view-content .vh{ background: #333; color: #fff; padding: 10px; display: flex; font-size: 2em; font-weight: bold; }
#view-content .vht{ flex:1; padding: 0 5px; }
#view-content .vhc{ text-align: right; cursor:pointer; }

#view-content .vc { height: calc(100% - 48px);  margin: 0; box-sizing: border-box; }
#view-content .vci { height: 100%; width: 100%; background: #fff; }


#pns-module-msg { 
    position: absolute; 
    left:0; top:0; 
    width: 100%; height: 100%; z-index: 5000; 
    display: flex; align-items: center; justify-content: center; 
    transition: all 0.4s ease; opacity: 0; pointer-events: none; 
}
#pns-module-msg .txtmsg { background: rgba(0,0,0,0.7); border-radius: 50px; text-align:center; color: #f8f8f8; padding: 5px 10px;  }


#current-position{ position: absolute; bottom:0; width: 100%; color:#fff; padding: 10px 0; line-height:0; pointer-events: none; transition: all 0.4s ease; opacity: 0; }
#current-position .position-group { margin:auto; text-align: center; }
#current-position span { display: inline-flex; align-items: center; justify-content: center; }