@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://fonts.googleapis.com/css2?family=Asta+Sans:wght@300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;/*vertical-align: middle;*/}
body{font-family: "Asta Sans", sans-serif;font-size:16px;color: #696969;font-weight: 400;}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline}
audio:not([controls]){display:none;height:0;}
ul,ol,li{list-style:none}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
fieldset,img{border:0}
hr{height:0;}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
address,caption,em,var{font-style:normal;font-weight:normal}
a{text-decoration:none;cursor:pointer;color: inherit;}
a[href^="tel"]{font-style:normal}
a:hover,a:active,a:focus{text-decoration:none;}
b,strong{font-weight:bold}
dfn{font-style:italic}
img{border:0;/* vertical-align: top; */}
pre{overflow:auto}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}
table{border-spacing:0;border-collapse:collapse;}
td,th{padding:0;}
legend, caption{overflow:hidden;text-indent:-9999999px; height:0 !important; width:0 !important;line-height:0 !important;margin:0;padding:0;}
input{vertical-align: baseline;margin:0;padding:0;}
input[type="text"],input[type="password"],input[type="email"]{-webkit-appearance:none;}
input:checked[type="checkbox"]{-webkit-appearance:checkbox}
button,input[type="button"],input[type="submit"],input[type="reset"],input[type="file"]{border-radius:0;-webkit-appearance:button;}
button,input,optgroup,select,textarea{margin:0;font:inherit;color:inherit}
button{overflow:visible;border:none;cursor:pointer;margin:0;padding:0;}
button,select{text-transform:none}
optgroup{font-weight:bold}
textarea{border:1px solid #c0c0c0;overflow:auto;-webkit-appearance:none}
input::-ms-clear{display:none;}
h1,h2,h3,h4,h5,h6{
    font-weight: inherit;
}
option{
    min-height: 0;
    padding: 0;
    font-size: inherit;
}
.fl_l {float:left !important;}
.fl_r {float:right !important;}
.cl_b{clear:both !important;} 
.fl_txt {text-align:left !important;}
.disN{display:none;}
.disN2{display:none !important;}
.disB{display:block;}
.disB2{display:block !important;}
.txC{text-align:center;}
.inB{
    display: inline-block;
}
.W_Auto{width:auto;}
.rel{position:relative;}
.pointer{cursor: pointer;}
.cursor{
    cursor: pointer;
}
.wd100{
    width: 100%;
}
.wd50{
    width: 50%;
}
.het100{
    height: 100%;
}
.mg05{
    margin:0 5px;
}
.mg15{
    margin: 15px 0;
}

*{outline: none;box-sizing:border-box;letter-spacing: -.5px;line-height: 100%;}
.visiH{visibility:hidden;}
:root{
	--main-color: #0e2c42;
	--en: "Plus Jakarta Sans", sans-serif;
}

body,html{
	/* max-width:1920px;
	margin:0 auto !important; */
	height: 100%;
}
body{
    min-width: 1400px;
    overflow-x: auto;
    max-width: 1920px;
}
body.have_responsive{

}

/*common*/
.--flex1{
    flex: 1;
}
.layer_pop-open{
    cursor: pointer;
}

.flexWrap{
    display: flex;
    align-items: center;
}
.flexWrap.space{
    justify-content: space-between;
}
.flexWrap.--column{
    flex-direction: column;
}
.flexWrap.--start{
    justify-content: flex-start;
}
.flexWrap.--space{
    justify-content: space-between;
}
.flexWrap.--center{
    justify-content: center;
}
.flexWrap.--end{
    justify-content: flex-end;
}
.flexWrap.--evenly{
    justify-content: space-evenly;
}
.flexWrap.--alignend{
    align-items: flex-end;
}
.flexWrap.--alignstart{
    align-items: flex-start;
}
.flexWrap.--alignstrch{
    align-items: stretch;
}
.flexWrap.--flex1{
    flex:1;
}

.flexWrap .flexWrap_list{
    margin-right: 15px;
    display: flex;
    align-items: center;
    flex:1;
}

.gridWrap{
    display: grid;
    gap: 20px;
}
.gridWrap.--grid2{
    grid-template-columns:repeat(2, 1fr)
}
.gridWrap.--grid3{
    grid-template-columns:repeat(3, 1fr)
}


/*login*/
.loginWrap{
    width: 100%;
    height: 100vh;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.loginWrap .container{
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
}
.loginWrap .logoWrap{
    flex:0 0 50%;
    background: url(../images/login_logowrap_bg.jpg) center center / cover no-repeat;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10%;
}
.loginWrap .logoWrap .logo{
    text-align: right;
}
.loginWrap .logoWrap .logo .image{
    margin-bottom: 10%;
    padding-bottom:10%;
    border-bottom:1px solid #fff;
    padding-left: 150px;
}
.loginWrap .logoWrap .logo .text{
    color:#fff;
    font-weight: 300;
    font-size: 40px;
    font-family: var(--en);
}
.loginWrap .login{
    flex:0 0 50%;
    background: url(../images/login_login_bg.jpg) center center / cover no-repeat;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.loginWrap .login .content{
    min-width: 50%;
}
.loginWrap .login .list{
    margin-bottom:5%;
}
.loginWrap .login .list:nth-last-child(1){
    margin-bottom: 0;
}
.loginWrap .login .selectWrap{
    display: flex;
    align-items: flex-start;
    margin-bottom:5%;
    flex-direction: column;
}
.loginWrap .login .selectWrap .name{
    white-space: nowrap;
    font-size: 16px;
    color: #333;
    margin-bottom:2.5%;
}
.loginWrap .login .selectWrap .select{
    border-color: #b5b5b5;
    padding: 5px;
    color: #999999;
    width: auto;
    min-width: 50%;
    height: 38px;
}
.loginWrap .login .btnWrap{
    margin-bottom:2.5%;
}
.loginWrap .login .label{
    width: 100%;
}
.loginWrap .login .input{
    width: 100%;
    padding: 0 5%;
    padding-left: 50px;
    border: 1px solid #b5b5b5;
    font-size: 20px;
    transition: 0.5s all;
    height: 50px;
    font-family: var(--en);
}
.loginWrap .login .input:focus{
    border-color: var(--main-color);
    color:var(--main-color);
}
.loginWrap .login .input:focus::placeholder{
    color:var(--main-color);
}
.loginWrap .login .input::placeholder{
    font-weight: 100;
}
.loginWrap .login .btnWrap .ico.--abs{
    position: absolute;
    left: 15px;
    top:50%;
    transform: translateY(-50%);
}
.loginWrap .login .stateWrap{
    display: flex;
    color:#000;
    justify-content: space-between;
    font-weight: 300;
    margin-bottom:20%;
}
.loginWrap .login .stateWrap .save{
    display: flex;
    align-items: baseline;
}
.loginWrap .login .stateWrap .save .text{
    padding-left: 5px;
}
.loginWrap .login .stateWrap .state{
    display: flex;
}
.loginWrap .login .stateWrap .state_con{
    margin-right:15px;
    padding-right:15px;
    position: relative;
}
.loginWrap .login .stateWrap .state_con.--regi{
    color: var(--main-color);
    font-weight: 500;
}
.loginWrap .login .stateWrap .state_con:nth-last-child(1){
    margin:0;
    padding:0;
}
.loginWrap .login .stateWrap .state_con:after{
    content: "";
    width:1px;
    height:75%;
    background: #000;
    position: absolute;
    right:0;
    top:50%;
    transform: translateY(-50%);
}
.loginWrap .login .stateWrap .state_con:nth-last-child(1):after{
    display: none;
}
.loginWrap .login .submitWrap{
    background: var(--main-color);
    color:#fff;
    font-size: 20px;
    font-weight: 300; 
    width: 50%;
    position: relative;
}
.loginWrap .login .submitWrap .alert{
    color: #ff0000;
    font-weight: 300;
    position: absolute;
    top:-50%;
    left:0;
    display: none;
}
.loginWrap .login .submitWrap .btn{
    background: transparent;
    display: flex;
    justify-content: space-between;
    padding:10%;   
    width: 100%;
    align-items: center;
    height: 38px;
}
.loginWrap .login .submitWrap .btn .ico{
    display: flex;
    align-items: center;
}




/*mainWrap*/
.mainWrap{width: 100%;}

/*header*/
.header{
    box-shadow: 1px 4px 19px rgb(0 0 0 / 7%);
    height: 80px;
    background: #6a5d52;
    color: #fff;
    padding: 0 1%;
}
.headerWrap{
    height: 100%;
}
.header .header_list {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}
.header .header_nameWrap{
    display: flex;
    align-items: center;
}
.header  .header_logo {
    font-weight: 700;
    letter-spacing: 0;
    font-size: 20px;
}

.header .header_login {
    display: flex;
    align-items: center;
}
.header .logincon {
    margin-right: 30px;
    font-size: 20px;
}
.header .timeWrap{
    color: #d0c5bc;
    font-size: 16px;
    margin-right: 30px;
    padding-left: 15px;
    position: relative;
}
.header .timeWrap::before{
    content: "";
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    background: #d0c5bc;
    border-radius: 50%;
    width: 3px;
    height: 3px;
}
.header .userWrap{
    margin-right: 30px;
}
.header .userWrap .user{
    padding-right: 15px;
    margin-right: 15px;
    font-weight: 300;
    font-size: 16px;
    position: relative;
}
.header .userWrap .user:nth-last-child(1){
    margin:0;
    padding:0;
}
.header .userWrap .user::before{
    content: "";
    position: absolute;
    right:0;
    top:50%;
    transform: translateY(-50%);
    height: 15px;
    width: 1px;
    background: #fff;
}
.header .userWrap .user:nth-last-child(1)::before{
    display: none;
}
.header .infoWrap{
    display: flex;
}
.header .infoWrap .info{
    display: flex;
    align-items: center;
    font-size: 16px;
    margin-right: 15px;
    font-weight: 500;
}
.header .infoWrap .info .ico{
    margin-right: 10px;
}
.header .infoWrap .select{
    background: transparent;
    color: #d0c5bc;
    border-radius: 10px;
    padding: 5px;
    min-width: 150px;
    border-color: #d0c5bc;
}
#menuOpen_btn {
    width: auto;
    background-color: transparent;
    cursor: pointer;
    border: none;
    padding: 0;
    outline: none;
    transition: 0.75s all;
    display: flex;
    align-items: center;
    margin-right: 15px;
}
#menuOpen_btn span {
    display: block;
    width: 100%;
    height: 1PX;
    background-color: #fff;
    font-size: 0;
    transition: 0.75s;
}
#menuOpen_btn .hambeg{
    display: flex;
    flex-direction: column;
    width: 30px;
    height: 20px;
    justify-content: space-between;
}
header.active #menuOpen_btn span {
    margin: 0 auto;
    transition: background-color 0.3s 0s, opacity 0.3s 0.3s, margin 0.3s 0.3s, transform 0.3s 0s;
    background-color: #9c9c9c;
    width: 100%;
}
#menuOpen_btn.active span:nth-child(1) {
    width: 50%;
}
#menuOpen_btn.active span:nth-child(2) {
}
#menuOpen_btn.active span:nth-child(3) {
    width: 50%;
}

/*sidenav*/
.sidenavWrap{
    overflow: hidden;
    transition: 0.5s all;
    border-right: 1px solid #e0e2e4;
    box-shadow: 1px 4px 19px rgb(0 0 0 / 7%);
    width: 250px;
    flex: 0 0 250px;
    position: relative;
    height: 100%;
    background: #fff;
    overflow: auto;
    height: auto;
}
.sidenavWrap.active{
    width: 0;
    flex:0 0 0;
    transform: translateX(-100%);
}
.sidenav{
    width: 100%;
    height: 100%;
    max-height: calc(100vh - 80px);
    overflow: auto;
}
.sidenav .sidenav_list{
    display: flex;
    align-items: center;
    width:100%;
}
.sidenav .sidenav_list.alone{
    background: #282421;
    color: #fff;
}
.sidenav .sidenav_list.alone .text{
    color:#fff !important;
}
.sidenav .sidenav_list.depth2{
    flex-wrap: wrap;
}
.sidenav .sidenav_list.active-on{

}
.sidenav .sidenav_list .listhead{
    padding: 20px 0 20px 20px;
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
    cursor: pointer;
    border-bottom: 1px solid #c0c0c0;
}
.sidenav .sidenav_list.depth2 .listhead::before{
    content:"";
    width:12px;
    height: 7px;
    position: absolute;
    right:15px;
    top:50%;
    transform: translateY(-50%);
    transition: 0.75s all;
    background: url(../images/sidenav_ico_depth1.png) center center / cover no-repeat;
    opacity: 0;
}
.sidenavWrap .sidenav .sidenav_list.depth2 .listhead::before{
    opacity: 1;
}
.sidenav .sidenav_list.depth2.active-on .listhead::before{
    transform: translateY(-50%) rotate(180deg);
}
.sidenav .sidenav_list .ico{
    margin-right: 5%;
}
.sidenav .sidenav_list .text{
    opacity: 0;
    font-size: 0;
}
.sidenavWrap .sidenav .sidenav_list .text{
    opacity: 1;
    font-size: inherit;
    font-weight: 500;
    transition: opacity 0.75s 0.75s , font-size 0s 0.75s;
}
.sidenavWrap .sidenav .sidenav_list.active-on .text{
    color: var(--main-color);
} 
.sidenav .sidenav_list .submenu{
    background: #eee;
    width: 100%;
    padding: 2.5% 5%;
    display: none;
    border-bottom: 1px solid #d3dae6;
    overflow: hidden;
}
.sidenavWrap .sidenav .sidenav_list.active-on .submenu{
    display: block;
}
@keyframes opacity_1{
    to{
        opacity: 1;
    }
}
.sidenav .sidenav_list .submenu.active-on{

}
.sidenav .sidenav_list .submenu_list{
    position:relative;
    padding: 2.5% 0 2.5% 12.5%;
    cursor: pointer;
    transition: 0.5s all;
    font-weight: 300;
    font-size: 15px;
    font-weight: 400;
    display: block;
}
.sidenav .sidenav_list .submenu_list.active-on{
    background: #ddd;
    border-radius: 10px;
    color: var(--main-color);
}
.sidenav .sidenav_list .submenu_list.have_dp3menu.active-on{
    background:none;
	border-radius: 0;
}
.sidenav .sidenav_list .submenu_list.have_dp3menu.active-on:before{
    display:none;
}
.sidenav .sidenav_list .submenu_list:nth-last-child(1){
    margin-bottom:0;
}
.sidenav .sidenav_list.depth2 .submenu_text{
    
}
.sidenav .sidenav_list.depth2 .submenu_dp3menu{
    position: relative;
    padding: 2.5% 0 2.5% 0;
    /* margin-bottom: 2.5%; */
    cursor: pointer;
    transition: 0.5s all;
    font-size: 15px;
    font-weight: 400;
    display: block;
}
.sidenav .sidenav_list.depth2 .dp3menu_text{
    position: relative;
    cursor: pointer;
    font-size: 15px;
    display: block;
}
.sidenav .sidenav_list.depth2 .have_dp3menu .dp3menu_text::after{
    content:"";
    width:12px;
    height: 7px;
    position: absolute;
    right:15px;
    top:50%;
    transform: translateY(-50%);
    transition: 0.75s all;
    background: url(../images/sidenav_ico_depth1.png) center center / cover no-repeat;
}
.sidenav .sidenav_list.depth2 .active-on .dp3menu_text:before{
    content: "";
    width: 6px;
    height: 6px;
    position: absolute;
    left: -20px;
    top: calc(50% + 3px);
    transform: translateY(calc(-50% - 3px));
    border-radius: 50%;
    background: #0077cc;
    display:none;
}
.sidenav .sidenav_list.depth2 .active-on.have_dp3menu .dp3menu_text:before{
    display:block;
}
.sidenav .sidenav_list.depth2 .submenu_dp3menu.active-on .dp3menu_text::after{
    transform: translateY(-50%) rotate(180deg);
}
.sidenav .sidenav_list.depth2 .dp3menu{
    display: none;
    padding-top: 7.5%;
}
.sidenav .sidenav_list.depth2 .submenu_dp3menu.active-on .dp3menu{
    display: block;
}
.sidenav .sidenav_list.depth2 .dp3menu_list{
    position: relative;
    padding: 10px 0 10px 10px;
    cursor: pointer;
    transition: 0.35s all;
    font-size: 15px;
    font-weight: 400;
    display: block;
}
.sidenav .sidenav_list.depth2 .dp3menu_list.active-on{
    background: #deeaf2;
    border-radius: 10px;
}

.innerWrap{
    /* max-height: calc(100vh - 80px); */
    background: #f6f6f6;
    display: flex;
    width: 100%;
    min-height: calc(100vh - 80px);
}

.contentWrap{
    padding: 0;
    width: calc(100% - 250px);
    min-width: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.contentWrap .maintabWrap{
	transition:0.5s all;
	width:100%;
}
.contentWrap .maintabWrap.active-small{
	width:75%;
}
.contentWrap .maintabWrap .maintab{
    display: flex;
    align-items: center;
    border-bottom:2px solid var(--main-color);
    font-size: 14px;
}
.contentWrap .maintabWrap .maintab .tablist{
    color: #fff;
    background: #ededed;
    transition: 0.5s all;
    padding: 10px 45px;
    border-radius: 15px 15px 0 0;
    cursor: pointer;
}
.contentWrap .maintabWrap .maintab .tablist.active-on{
    background: var(--main-color);
}
.contentWrap .maintabWrap .--havewrap{
    padding:30px 1.5% 0;
    border: 1px solid #dadada;
}
.contentWrap .maintabWrap .maintablist{
    display: none;
}
.contentWrap .maintabWrap .maintablist.active-on{
    display: block;
}
.contentWrap .maintabWrap .target_tab{
    display: none !important;
}
.contentWrap .maintabWrap .target_tab.active-on{
    display: grid !important;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 20px;
}
.contentWrap .maintabWrap.active-small .target_tab.active-on{
    grid-template-columns: 1fr 1fr 1fr;
}

.contentWrap .sitename{
    position: relative;
    padding: 20px 24px 0 44px;
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
}
.contentWrap .sitename::before{
    content: "";
    position: absolute;
    left: 28px;
    top: 50%;
    transform: translateY(-50%);
    background: #a8a8a8;
    border-radius: 50%;
    width: 3px;
    height: 3px;
}
.contentWrap .sitename .title{
    color: #a8a8a8;
    font-size: 16px;
    font-weight: 300;
}
.contentWrap .sitename .title.active{
    color: var(--main-color);
    font-weight: 500;
    font-size: 18px;
}
.contentWrap .sitename .list{
    display: flex;
    align-items: center;
}
.contentWrap .sitename .list .btnWrap{
    display: flex;
    align-items: center;
    margin-right: 20px;
}
.contentWrap .sitename .list .btnWrap .name{
    white-space: nowrap;
    margin-right: 10px;
    font-size: 16px;
    color: #333;
}
.contentWrap .sitename .list .btnWrap .select{
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #999;
    min-width: 150px;
}
.contentWrap .sitename .list .btnWrap .input{
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #ededed;
}

.contentWrap .mainsec{
    flex: 0 0 49%;
}
.contentWrap .mainsec.--grid3{
    flex: 0 0 33%;
}
.contentWrap .mainsec.setting{
    border: 1px solid #c0c0c0;
    overflow: hidden;
}
.contentWrap .mainsec.setting .topnaviWrap{
    padding: 15px;
    background: #fff;
    margin-bottom: 0;
}
.contentWrap .mainsec.setting .tableWrap3.--pd{
    padding:15px;
    background: #ededed;
}

.contentWrap .codesec{

}
.contentWrap .codesec .toptitleWrap{
    margin-bottom:15px;
}
.contentWrap .codesec .toptitleWrap .toptitle{
    color: #333;
    font-size: 18px;
    font-weight: 500;
    position: relative;
    padding-left: 7.5px;
}
.contentWrap .codesec .topnaviWrap{
    border: 1px solid #c0c0c0;
    border-radius: 5px;
    align-items: center;
}
.contentWrap .codesec .topnaviWrap .list.info .btnWrap{
    flex:1;
}
.contentWrap .codesec .tableWrap3.--pd{
    padding:15px;
    border: 1px solid #c0c0c0;
    border-radius: 5px;
}
.contentWrap .codesec .infoWrap{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
    font-size: 14px;
}
.contentWrap .codesec .infoWrap .info{
    margin-right: 15px;
}
.contentWrap .codesec .infoWrap .info .point{
    color: var(--main-color);
    font-weight: 700;
}
.contentWrap .codesec .infoWrap .btnWrap{
    display: flex;
    height: 34px;
    align-items: center;
}
.contentWrap .codesec .infoWrap .btnWrap .btn{
    height: 100%;
    background: var(--main-color);
    color: #fff;
    border-radius: 5px;
    min-width: 120px;
}

.contentWrap .homesec{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    background: #fff;
}
.contentWrap .homesec.--start{
    justify-content: flex-start;
}
.contentWrap .homesec.another{
    background: transparent;
    gap: 20px;
}
.contentWrap .homesec.--bg{
}
.contentWrap .homesec .homesec_con{
    padding:3%;
    flex: 1 1 auto;
}
.contentWrap .homesec.another .homesec_con{
    background: #fff;
}
.contentWrap .homesec .tableWrap3 .tablectr{
    margin-bottom:2.5%;
}
.contentWrap .homesec .tableWrap3 .table .thead_list .container,
.contentWrap .homesec .tableWrap3 .table .tbody_list .container{
    background: inherit;
}
.contentWrap .homesec .tableWrap3 .table .active-col,
.contentWrap .homesec .tableWrap3 .table .active-col +.thead_list .con{
    border: 4px solid var(--main-color);
    background: #fcf6f0;
    border-top:0;
    border-bottom: 0;
}

.contentWrap .content{
    background: #fff;
    flex: 1;
    width: 100%;
    box-sizing: border-box;
    padding: 24px 28px;
    overflow: auto;
    min-height: 0;
}
.contentWrap .content.--bgnone{
    background: transparent;
}
.contentWrap .content.--pd0{
    padding:0;
}

.contentWrap .content .conlist{
    margin-bottom:15px;
}
.contentWrap .content .conlist:nth-last-child(1){
    margin-bottom:0;
}

.contentWrap .toptabmenu{
    margin-bottom:15px;
}
.contentWrap .toptabmenu.flex{
    display: flex;
}
.contentWrap .toptabmenu.--space{
    justify-content: space-between;
}
.contentWrap .toptabmenu .tabmenu{
    display: flex;
    align-items: center;
}
.contentWrap .toptabmenu .tabmenu .tab{
    border:1px solid #ededed;
    color: #999;
    border-radius: 30px;
    padding: 10px 30px;
    margin-right: 10px;
    cursor: pointer;
}
.contentWrap .toptabmenu .tabmenu .tab:nth-last-child(1){
    margin-right:0;
}
.contentWrap .toptabmenu .tabmenu .tab.active{
    border-color:var(--main-color);
    color:var(--main-color);
}
.contentWrap .toptabmenu .btnWrap{

}
.contentWrap .toptabmenu .btnWrap .btn{
    color: #fff;
    padding: 10px;
    height: 100%;
    margin-right: 10px;
    min-width: 120px;
    border-radius: 30px;
    font-size: 14px;
    border: 1px solid transparent;
}
.contentWrap .toptabmenu .btnWrap .btn:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .toptabmenu .btnWrap .btn.--main{
    background: var(--main-color);
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .toptabmenu .btnWrap .btn.--save{
    background: #282421;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .toptabmenu .ctr_topnaviWrap{
    padding-right: 30px;
    cursor: pointer;
}
.contentWrap .toptabmenu .ctr_topnaviWrap .text{
    position: relative;
    font-size: 14px;
    color: #333;
    font-weight: 500;
}
.contentWrap .toptabmenu .ctr_topnaviWrap .text:before {
    content: "";
    position: absolute;
    right: -20px;
    border: solid var(--main-color);
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 4px;
    top:40%;
    transform: translateY(-50%) rotate(45deg);
    -webkit-transform: translateY(-50%) rotate(45deg);
    transition: 0.5s all;
}
.contentWrap .toptabmenu .ctr_topnaviWrap.active-hide .text:before {
    top: 70%;
    transform: translateY(-50%) rotate(225deg);
    -webkit-transform: translateY(-50%) rotate(225deg);
}

.contentWrap .topnaviWrap{
    background: #eee;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1%;
    overflow: hidden;
    transition: 0.3s all;
    height: auto;
    padding: 1.5% 2.5%;
}
.contentWrap .topnaviWrap.mg0{
    margin:0;
}
.contentWrap .topnaviWrap.--end{
    justify-content: flex-end;
}
.contentWrap .topnaviWrap.--hide{
    height: 0;
    padding:0;
}
.contentWrap .topnaviWrap.active-hide{
    height: auto;
    padding: 1.5% 2.5%;
}
.contentWrap .topnaviWrap .list{
    display: flex;
    align-items: center;
}
.contentWrap .topnaviWrap .list.--flex1{
    flex:1;
}
.contentWrap .topnaviWrap .list.--alignstart{
    align-items: flex-start;
}
.contentWrap .topnaviWrap .list.info{
    /* flex: 0 0 auto; */
    margin-right: 30px;
}
.contentWrap .topnaviWrap .list.info.--mg0{
    margin:0;
}
.contentWrap .topnaviWrap .list.info.--flex1{
}
.contentWrap .topnaviWrap .list.--column{
    flex-direction: column;
}
.contentWrap .topnaviWrap .list.--center{
    justify-content: center;
}
.contentWrap .topnaviWrap .list.info .depth2{
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom:1%;
}
.contentWrap .topnaviWrap .list.info .depth2:nth-last-child(1){
    margin-bottom: 0;
}
.contentWrap .topnaviWrap .list.info .depth2.--center{
    justify-content: center;
}
.contentWrap .topnaviWrap .list.info .only_title{
    color: #191919;
    font-size: 18px;
    font-weight: 500;
}
.contentWrap .topnaviWrap .list.info .btnWrap{
    flex: 0 1 auto;
    display: flex;
    align-items: center;
    margin-right: 2.5%;
    font-size: 14px;
}
.contentWrap .topnaviWrap .list.info .btnWrap.--short{
    flex: 0 1 auto;
}
.contentWrap .topnaviWrap .list.info .btnWrap:nth-last-child(1){
    margin-right:0;
}
.contentWrap .topnaviWrap .list.info .btnWrap .label{
	width:100%;
}
.contentWrap .topnaviWrap .list.info .btnWrap .name{
    position: relative;
    padding-left:10px;
    color: #333;
    margin-right: 15px;
    white-space: nowrap;
    /* min-width: 75px; */
}
.contentWrap .topnaviWrap .list.info .btnWrap .name::before{
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #696969;
    border-radius: 50%;
    width: 3px;
    height: 3px;
}
.contentWrap .topnaviWrap .list.info .btnWrap .select{
    width: auto;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 100px;
}
.contentWrap .topnaviWrap .list.info .btnWrap .input{
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #ededed;
}
.contentWrap .topnaviWrap .list.info .btnWrap .ico.--abs{
    position: absolute;
    right: 15px;
    top:50%;
    transform: translateY(-50%);
}
.contentWrap .topnaviWrap .list .ctr_calender{
    align-items: stretch;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 50%;
}
.contentWrap .topnaviWrap .list .ctr_calender .date{
    font-weight: 500;
    color:#191919;
    font-size: 20px;
}
.contentWrap .topnaviWrap .list .ctr_calender .arrow{
    position: relative;
    width: 30px;
    text-align: center;
}
.contentWrap .topnaviWrap .list .ctr_calender .arrow:before{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border: solid var(--main-color);
    border-width: 0 1px 1px 0;
    transform: translate(-50%, -50%) rotate(135deg);
    transition: 0.5s all;
    width: 7px;
    height: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .topnaviWrap .list .ctr_calender .arrow.next:before{
    transform: translate(-50%, -50%) rotate(315deg);
}
.contentWrap .topnaviWrap .list.regi{
    flex: 0 0 20%;
    justify-content: flex-end;
}
.contentWrap .topnaviWrap.--end .list.regi{
    flex:0 0 50%;
}
.contentWrap .topnaviWrap .list.regi.--flex1{
    flex:1;
}
.contentWrap .topnaviWrap .list.regi .btn{
    color: #fff;
    padding: 7px 5px;
    height: 100%;
    margin-right: 10px;
    min-width: 140px;
    border-radius: 5px;
}
.contentWrap .topnaviWrap .list.regi .btn img{
    height: 16px;
}
.contentWrap .topnaviWrap .list.regi .btn:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .topnaviWrap .list.regi .btn.--reset{
    background: #b7b7b7;
}
.contentWrap .topnaviWrap .list.regi .btn.--main{
    background: var(--main-color);
}
.contentWrap .topnaviWrap .list.regi .btn.--sch{
    background: var(--main-color);
}
.contentWrap .topnaviWrap .list.regi .btn.--save{
    background: #282421;
}
.contentWrap .topnaviWrap .list.regi .btn.--small{
    height: 43px;
}
.contentWrap .topnaviWrap .list.regi .btn.--flex1{
    flex:1;
}
.contentWrap .topnaviWrap .list.regi .btnWrap{
    flex: 0 1 auto;
    display: flex;
    align-items: center;
    margin-right: 2.5%;
    font-size: 14px;
}
.contentWrap .topnaviWrap .list.regi .btnWrap.--flex1{
    flex: 1;
}
.contentWrap .topnaviWrap .list.regi .btnWrap .name{
    position: relative;
    padding-left: 10px;
    color: #333;
    margin-right: 15px;
    white-space: nowrap;
}
.contentWrap .topnaviWrap .list.regi .btnWrap .name::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #696969;
    border-radius: 50%;
    width: 3px;
    height: 3px;
}
.contentWrap .topnaviWrap .list.regi .btnWrap .select{
    width: auto;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 100px;
}
.contentWrap .topnaviWrap .list.regi .btn .text{
    padding-right: 5px;
    margin-left: 5px;
}

.contentWrap .tableWrap{

}
.contentWrap .tableWrap .tablectr{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1%;
}
.contentWrap .tableWrap .tablectr .numWrap{
}
.contentWrap .tableWrap .tablectr .numWrap .num{
    color: var(--main-color);
    font-weight: 700;
}
.contentWrap .tableWrap .tablectr .infoWrap{
}
.contentWrap .tableWrap .tablectr .infoWrap .info{
    color: var(--main-color);
    font-weight: 500;
    margin-left: 15px;
}
.contentWrap .tableWrap .tablectr .control{

}
.contentWrap .tableWrap .tablectr .control .btnWrap{

}
.contentWrap .tableWrap .tablectr .control .btn img{
    height: 16px;
}
.contentWrap .tableWrap .tablectr .control .btn{
    color: #fff;
    padding: 8px;
    height: 100%;
    margin-right: 10px;
    min-width: 120px;
    border-radius: 30px;
    font-size: 14px;
    border: 1px solid transparent;
    min-height: 35px;
}
.contentWrap .tableWrap .tablectr .control .btn:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .tableWrap .tablectr .control .btn.--save{
    background: #282421;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tableWrap .tablectr .control .btn.--excel{
    background: var(--main-color);
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tableWrap .tablectr .control .btn.--updown{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #424049;
    border-color: var(--main-color);
    background: transparent;
}
.contentWrap .tableWrap .tablectr .control .btn .ico{
    
}
.contentWrap .tableWrap .tablectr .control .btn .text{
    padding-right: 5px;
    margin-left: 5px;
}
.contentWrap .tableWrap .tablebox{
    width: 100%;
    text-align: center;
    table-layout: fixed;
    max-height: calc(43px * 11 + 1px);
    overflow: auto;
}
.contentWrap .tableWrap .table{
    width: 100%;
}
.contentWrap .tableWrap .table .checkbox{
    width: 16px;
    height: 16px;
    accent-color: #282421;
}
.contentWrap .tableWrap .table .btnWrap{

}
.contentWrap .tableWrap .table .btnWrap .btn{
    background: var(--main-color);
    color:#fff;
    border-radius: 15px;
    padding:7px 20px;
}
.contentWrap .tableWrap .table .thead{
    position: sticky;
    top: 0;
    z-index: 2;
}
.contentWrap .tableWrap .table .thead_list{
    background: #265673;
    color: #fff;
    border-radius: 15px;
    padding: 8px;
    min-width: 75%;
    font-size: 14px;
    border-left: 1px solid #265673;
}
.contentWrap .tableWrap .table .thead_list .con{
    padding: 10px 0;
    height: 43px;
}
.contentWrap .tableWrap .table .tbody_list{
    font-size: 14px;
}
.contentWrap .tableWrap .table .tbody_list:nth-child(2n){
    background: #fbf6f0;
}
.contentWrap .tableWrap .table .tbody_list .con{
    height: 43px;
    line-height: 138%;
}
.contentWrap .tableWrap .table .tbody_list .con.left{
    text-align: left;
}
/* .contentWrap .tableWrap .table .tbody_list .con.have_br{
    line-height: 138%;
} */

.contentWrap .tableWrap .tablebt {
    position: relative;
    margin-top:25px;
}
.contentWrap .tableWrap .paging{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    margin-bottom: 1.5%;
}
.contentWrap .tableWrap .paging .prev{
    position: relative;   
    margin-right: 10px;
}
.contentWrap .tableWrap .paging .prev:before{
   
    position: absolute;
    left: 0;
    top: 50%;
    border: solid #a8a8a8;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: translateY(-50%) rotate(135deg);
    -webkit-transform: translateY(-50%) rotate(135deg);
}
.contentWrap .tableWrap .paging .next{
    color: var(--main-color);
    position: relative;   
    margin-left: 10px;
}
.contentWrap .tableWrap .paging .next:before{
   
    position: absolute;
    right: 0;
    top: 50%;
    border: solid var(--main-color);
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: translateY(-50%) rotate(-45deg);
    -webkit-transform: translateY(-50%) rotate(-45deg);
}
.contentWrap .tableWrap .paging .num{
    margin: 0 5px;
    color: #999;
}
.contentWrap .tableWrap .paging .num.active{
    color: var(--main-color);
}
.contentWrap .tableWrap .tablebt .btnWrap{
    position: absolute;
    right:0;
    top:50%;
    transform: translateY(-50%);
}
.contentWrap .tableWrap .tablebt .btnWrap .select {
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 150px;
    font-size: 14px;
}
.contentWrap .tablebt .timeWrap{
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    font-size: 14px;
}
.contentWrap .tablebt .timeWrap .timestate{
}
.contentWrap .tablebt .timeWrap .timelist{
    display: flex;
    align-items: center;
    margin-right: 15px;
}
.contentWrap .tablebt .timeWrap .timelist:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .tablebt .timeWrap .timestate{
    width: 8px;
    height: 8px;
    background: #0060cb;
    border-radius: 30px;
    margin-right: 5px;
}
.contentWrap .tablebt .timeWrap .active-off .timestate{
    background: #ff3149;
}

/*tableWrap2 로 다른table*/
.contentWrap .tableWrap2{

}
.contentWrap .tableWrap2 .tablectr{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1%;
}
.contentWrap .tableWrap2 .tablectr .numWrap{
}
.contentWrap .tableWrap2 .tablectr .numWrap .num{
    color: var(--main-color);
    font-weight: 700;
}
.contentWrap .tableWrap2 .tablectr .control{

}
.contentWrap .tableWrap2 .tablectr .control .btnWrap{

}
.contentWrap .tableWrap2 .tablectr .control .btn img{
    height: 16px;
}
.contentWrap .tableWrap2 .tablectr .control .btn{
    color: #fff;
    padding: 8px;
    height: 100%;
    margin-right: 10px;
    min-width: 120px;
    border-radius: 30px;
    font-size: 14px;
    border: 1px solid transparent;
}
.contentWrap .tableWrap2 .tablectr .control .btn.--excel{
    background: var(--main-color);
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tableWrap2 .tablectr .control .btn.--updown{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #424049;
    border-color: var(--main-color);
    background: transparent;
}
.contentWrap .tableWrap2 .tablectr .control .btn .ico{
    
}
.contentWrap .tableWrap2 .tablectr .control .btn .text{
    padding-right: 5px;
    margin-left: 5px;
}
.contentWrap .tableWrap2 .tablebox{
    width: 100%;
    text-align: center;
    table-layout: fixed;
    overflow: hidden;
    /* max-height: calc(43px * 11 + 1px); */
    overflow-y: auto;
}
.contentWrap .tableWrap2 .table{
    width: 100%;
    table-layout: fixed;
}
.contentWrap .tableWrap2 .table .checkbox{
    width: 16px;
    height: 16px;
    accent-color: #282421;
}
.contentWrap .tableWrap2 .table .btnWrap{

}
.contentWrap .tableWrap2 .table .btnWrap .btn{
    background: var(--main-color);
    color:#fff;
    border-radius: 15px;
    padding:7px 20px;
}
.contentWrap .tableWrap2 .table .thead{
    position: sticky;
    top:0;
    z-index: 2;
}
.contentWrap .tableWrap2 .table .thead_list{
    background: #265673;
    color: #fff;
    border-radius: 15px;
    padding: 8px;
    min-width: 75%;
    font-size: 14px;
    border-left: 1px solid #265673;
}
.contentWrap .tableWrap2 .table .tbody_list .con{
    border: 0.5px solid #C0C0BF;
    height: 43px;
}
.contentWrap .tableWrap2 .table .tbody_list .con:nth-child(1){
    border-left:0;
}
.contentWrap .tableWrap2 .table .thead_list .con{
    padding: 10px 5px;
    border-right: 0.5px solid #b5b5b5;
    height: 43px;
}
.contentWrap .tableWrap2 .table .thead_list .con:nth-last-child(1){
    margin-right: 0;;
}
.contentWrap .tableWrap2 .table .tbody_list{
    font-size: 14px;
}
.contentWrap .tableWrap2 .table .tbody_list.LV1{
    background: #ededed;
}
.contentWrap .tableWrap2 .table .tbody_list .nothave{
    background: #ededed;
}
.contentWrap .tableWrap2 .table .tbody_list .container{
    background-color: #fff;
    padding:5px;
}
.contentWrap .tableWrap2 .table .tbody_list.LV1 .state{
    background: #fbf6f0;
    border-color: #C0C0BF;
    color: #333;
}
.contentWrap .tableWrap2 .table .tbody_list.LV2 .state{
    background: #fbf6f0;
    border-color: #C0C0BF;
    color: #333;
}
.contentWrap .tableWrap2 .table .input{
    width: 100%;
    background: #fff;
    border: 1px solid #ededed;
    padding: 5px;
    transition: 0.3s all;
    color:#333;
}
.contentWrap .tableWrap2 .table .input:focus{
    border-color: var(--main-color);
}
.contentWrap .tableWrap2 .table .input.readonly{
    border: none;
    color: #d9d9d9;
    cursor: unset;
}

.contentWrap .tableWrap2 .tablebt {
    position: relative;
    margin-top: 25px;
}
.contentWrap .tableWrap2 .paging{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    margin-bottom: 1.5%;
}
.contentWrap .tableWrap2 .paging .prev{
    position: relative;
    padding-left: 20px;
    margin-right: 10px;
}
.contentWrap .tableWrap2 .paging .prev:before{
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    border: solid #a8a8a8;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: translateY(-50%) rotate(135deg);
    -webkit-transform: translateY(-50%) rotate(135deg);
}
.contentWrap .tableWrap2 .paging .next{
    color: var(--main-color);
    position: relative;
    padding-right: 20px;
    margin-left: 10px;
}
.contentWrap .tableWrap2 .paging .next:before{
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    border: solid var(--main-color);
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: translateY(-50%) rotate(-45deg);
    -webkit-transform: translateY(-50%) rotate(-45deg);
}
.contentWrap .tableWrap2 .paging .num{
    margin: 0 5px;
}
.contentWrap .tableWrap2 .paging .num.active{
    color: var(--main-color);
}
.contentWrap .tableWrap2 .tablebt .btnWrap{
    position: absolute;
    right:0;
    top:50%;
    transform: translateY(-50%);
}
.contentWrap .tableWrap2 .tablebt .btnWrap .select {
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 150px;
    font-size: 16px;
}

/*tableWrap3 로 다른table*/
.contentWrap .tableWrap3{

}
.contentWrap .tableWrap3 .tablectr{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1%;
}
.contentWrap .tableWrap3 .tablectr.--end{
    justify-content: flex-end;
}
.contentWrap .tableWrap3 .tablectr .numWrap{
}
.contentWrap .tableWrap3 .tablectr .numWrap .num{
    color: var(--main-color);
    font-weight: 700;
}
.contentWrap .tableWrap3 .tablectr .subtitle{
    font-weight: 500;
    color:#333;
    font-size: 18px;
}
.contentWrap .tableWrap3 .tablectr .infoWrap{
}
.contentWrap .tableWrap3 .tablectr .infoWrap .info{
    color: var(--main-color);
    font-weight: 500;
    padding-left: 10px;
}
.contentWrap .tableWrap3 .tablectr .titleWrap{

}
.contentWrap .tableWrap3 .tablectr .titleWrap .title{
    
}
.contentWrap .tableWrap3 .tablectr .control{

}
.contentWrap .tableWrap3 .tablectr .control .btnWrap{

}
.contentWrap .tableWrap3 .tablectr .control .btn img{
    height: 16px;
}
.contentWrap .tableWrap3 .tablectr .control .btn{
    color: #fff;
    padding: 8px;
    height: 100%;
    margin-right: 10px;
    min-width: 120px;
    border-radius: 30px;
    font-size: 14px;
    border: 1px solid transparent;
    min-height: 35px;
}
.contentWrap .tableWrap3 .tablectr .control .input{
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #ededed;
}
.contentWrap .tableWrap3 .tablectr .control .btn.--excel{
    background: var(--main-color);
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tableWrap3 .tablectr .control .btn.--updown{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #424049;
    border-color: var(--main-color);
    background: transparent;
}
.contentWrap .tableWrap3 .tablectr .control .btn.--save{
    background: #282421;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tableWrap3 .tablectr .control .btn.--input{
    color:#333;
    padding:0;
    border-radius: 5px;
}
.contentWrap .tableWrap3 .tablectr .control .btn.--normal{
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--main-color);
    border-color: var(--main-color);
    background: transparent;
}
.contentWrap .tableWrap3 .tablectr .control .btn .ico{
    margin-right: 5px;
}
.contentWrap .tableWrap3 .tablectr .control .btn .text{
}
.contentWrap .tableWrap3 .tablectr .dateWrap{
    position: relative;
    padding-left:8px;
    color: #282421;
    font-weight: 300;
}
.contentWrap .tableWrap3 .tablectr .dateWrap::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #696969;
    border-radius: 50%;
    width: 4px;
    height: 4px;
}
.contentWrap .tableWrap3 .tablectr .dateWrap .point{font-weight: 500;margin-right: 5px;}
.contentWrap .tableWrap3 .tablectr .titleWrap{
    position: relative;
    padding-left:8px;
    color: #282421;
    font-weight: 500;
}
.contentWrap .tableWrap3 .tablectr .titleWrap::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #696969;
    border-radius: 50%;
    width: 4px;
    height: 4px;
}
.contentWrap .tableWrap3 .tablebox{
    width: 100%;
    text-align: center;
    table-layout: fixed;
    overflow: hidden;
    max-height: calc(43px * 11 + 1px);
    overflow-y: auto;
}
.contentWrap .tableWrap3 .tablebox.--max4{
    max-height: calc(43px * 4 + 1px);
}
.contentWrap .tableWrap3.--another_main .tablebox.--max4{
}
.contentWrap .tableWrap3 .tablebox.--max5{
    max-height: calc(43px * 5 + 1px);
}
.contentWrap .tableWrap3 .tablebox.--max6{
    max-height: calc(43px * 6 + 1px);
}
.contentWrap .tableWrap3 .table{
    width: 100%;
    table-layout: fixed;
}
.contentWrap .tableWrap3 .table .checkbox{
    width: 16px;
    height: 16px;
    accent-color: #282421;
}
.contentWrap .tableWrap3 .table .btnWrap{

}
.contentWrap .tableWrap3 .table .btnWrap.flex1{
    flex:1;
}
.contentWrap .tableWrap3 .table .btnWrap .btn{
    background: var(--main-color);
    color:#fff;
    border-radius: 15px;
    padding:7px 20px;
}
.contentWrap .tableWrap3 .table .btnWrap .btn.--save{
    background: #282421;
}
.contentWrap .tableWrap3 .table .btnWrap .btn.--box{
    height: 100%;
    border-radius: 5px;
}
.contentWrap .tableWrap3 .table .thead{
    position: sticky;
    top: 0;
    z-index: 2;
}
.contentWrap .tableWrap3 .table .thead_list{
    background: #265673;
    color: #fff;
    border-radius: 15px;
    padding: 8px;
    min-width: 75%;
    font-size: 14px;
    border-left: 1px solid #265673;
}
.contentWrap .tableWrap3 .table .tbody_list .con{
    border: 0.5px solid #c0c0c0;
    height: 43px;
}
.contentWrap .tableWrap3 .table .tbody_list .con.left{
    text-align: left;
}
.contentWrap .tableWrap3 .table .tbody_list .con.have_br{
    line-height: 138%;
}
.contentWrap .tableWrap3 .table .tbody.--height8 .tbody_list .con{
    height: calc(43px * 8);
}
.contentWrap .tableWrap3 .table .thead_list .con{
    padding: 10px 5px;
    border-right: 0.5px solid #b7b5b2;
    height: 43px;
}
.contentWrap .tableWrap3 .table .thead_list .con.borderbt{
    border-bottom:0.5px solid #b7b5b2;
}
.contentWrap .tableWrap3 .table .thead_list .con:nth-last-child(1){
    margin-right: 0;;
}
.contentWrap .tableWrap3 .table .tbody_list{
    font-size: 14px;
}
.contentWrap .tableWrap3 .table .tbody_list .nothave{
    background: #ededed;
}
.contentWrap .tableWrap3 .table .tbody_list .container{
    background-color: #fff;
    padding: 4px 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    line-height: 138%;
}
.contentWrap .tableWrap3 .table .tbody_list .container.--pd0{
    padding: 0;
}
.contentWrap .tableWrap3 .table .tbody_list .container.left{
    justify-content: flex-start;
    text-align: left;
}
.contentWrap .tableWrap3 .table .tbody_list .container.have_br{
    line-height: 138%;
}
.contentWrap .tableWrap3 .table .tbody_list .container.skip{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.contentWrap .tableWrap3 .table .tbody_list .container .shortcon{
    flex: 0 1 25%;
}
.contentWrap .tableWrap3 .table .tbody_list .container .shortcon.--bold{
    font-weight: 700;
}
.contentWrap .tableWrap3 .table .tbody_list .container .name{

}
.contentWrap .tableWrap3 .table .tbody_list .container .name.right{
    padding-left:5px;
    margin-right: 10px;
}
.contentWrap .tableWrap3 .table .tbody_list .state .container{
    background: #fbf6f0;
    font-weight: 400;
}
.contentWrap .tableWrap3 .table .input{
    width: 100%;
    background: #fff;
    border: 1px solid #ededed;
    padding: 5px;
    transition: 0.3s all;
    color:#333;
}
.contentWrap .tableWrap3 .table .input.--short{
    width: auto;
    text-align: center;
}
.contentWrap .tableWrap3 .table .input:focus{
    border-color: var(--main-color);
}
.contentWrap .tableWrap3 .table .input.readonly{
    border: none;
    color: #d9d9d9;
    cursor: unset;
}
.contentWrap .tableWrap3 .table .tbody_list .listWrap{
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    flex-wrap: wrap;
}
.contentWrap .tableWrap3 .table .tbody_list .listWrap .listcon{
    flex: 0 0 25%;
    border-right: 0.5px solid #c0c0c0;
    height: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tableWrap3 .table .tbody_list .listWrap.grid4 .listcon{
    flex: 0 0 50%;
    height: calc(100% / 8);
}
.contentWrap .tableWrap3 .table .tbody_list .listWrap .listcon:nth-last-child(n+3){
    border-bottom: 0.5px solid #c0c0c0;
}
.contentWrap .tableWrap3 .table .tbody_list .listWrap .listcon:nth-child(2n){
    border-right: none;
}
.contentWrap .tableWrap3 .table .tbody_list .listWrap .listcon.--bold{
    font-weight: 500;
    color:#333;
}
.contentWrap .tableWrap3 .table .tbody_list .select{
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
}
.contentWrap .tableWrap3 .table .tbody_list .calenderWrap .input{
}
.contentWrap .tableWrap3 .table .tbody_list .calenderWrap .ico.--abs{
    position: absolute;
    right: 15px;
    top:50%;
    transform: translateY(-50%);
}
.contentWrap .tableWrap3 .table .tbody_list .txt_divide{

}
.contentWrap .tableWrap3 .table .tbody_list .txt_divide.--false{
    color: #ff3149;
    font-weight: 500;
}
.contentWrap .tableWrap3 .table .tbody_list .txt_divide.--true{
    color: #0060cb;
    font-weight: 500;
}

.contentWrap .tableWrap3 .tablebt {
    position: relative;
    margin-top: 25px;
}
.contentWrap .tableWrap3 .paging{
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    margin-bottom: 1.5%;
}
.contentWrap .tableWrap3 .paging .prev{
    position: relative;
    padding-left: 20px;
    margin-right: 10px;
}
.contentWrap .tableWrap3 .paging .prev:before{
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    border: solid #a8a8a8;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: translateY(-50%) rotate(135deg);
    -webkit-transform: translateY(-50%) rotate(135deg);
}
.contentWrap .tableWrap3 .paging .next{
    color: var(--main-color);
    position: relative;
    padding-right: 20px;
    margin-left: 10px;
}
.contentWrap .tableWrap3 .paging .next:before{
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    border: solid var(--main-color);
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: translateY(-50%) rotate(-45deg);
    -webkit-transform: translateY(-50%) rotate(-45deg);
}
.contentWrap .tableWrap3 .paging .num{
    margin: 0 5px;
    color: #999;
}
.contentWrap .tableWrap3 .paging .num.active{
    color: var(--main-color);
}
.contentWrap .tableWrap3 .tablebt .btnWrap{
    position: absolute;
    right:0;
    top:50%;
    transform: translateY(-50%);
}
.contentWrap .tableWrap3 .tablebt .btnWrap .select {
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 150px;
    font-size: 14px;
}
.contentWrap .tableWrap3 .rangeWrap{
    width: 100%;
    height: 80%;
    display: flex;
    align-items: center;
}
.contentWrap .tableWrap3 .rangeWrap .range{
    height: 100%;
    margin-right: 70px;
    width: 100%;
}
.contentWrap .tableWrap3 .rangeWrap .range_con{
    width:auto;
    height:100%;
    background: #d8d8d8;
    position: relative;
}
.contentWrap .tableWrap3 .rangeWrap.active-1st .range_con{
    background: var(--main-color);
}
.contentWrap .tableWrap3 .rangeWrap .text{
    white-space: nowrap;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: calc(100% + 10px);
}
.contentWrap .tableWrap3 .rangeWrap.active-1st .text{
    color: var(--main-color);
    font-size: 16px;
    font-weight: 500;
}

.contentWrap .tablebox .timeWrap{
    display: flex;
    align-items: center;
    justify-content: center;
}
.contentWrap .tablebox  .timeWrap .timestate{
}
.contentWrap .tablebox .timeWrap .timestate{
    width: 10px;
    height: 10px;
    background: #0060cb;
    border-radius: 30px;
    margin-right: 5px;
}
.contentWrap .tablebox .timeWrap.active-off .timestate{
    background: #ff3149;
}
.contentWrap .tablebox .timeWrap .text{

}

.contentWrap .schWrap{
}
.contentWrap .schWrap .sch{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}
.contentWrap .schWrap .sch_list{
    flex: 0 0 32%;
    background: #fffef7;
    border: 2px solid var(--main-color);
    border-radius: 5px;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    padding: 15px;
    height: 100%;
    align-items: center;
}
.contentWrap .schWrap .sch_list .nameWrap{
    color: #282421;
    font-weight: 500;
    display: flex;
    align-items: center;
}
.contentWrap .schWrap .sch_list .nameWrap .ico{
    margin-right: 5px;
}
.contentWrap .schWrap .sch_list .state{
    text-align: right;
    font-size: 18px;
}
.contentWrap .schWrap .sch_list .state .point{
    color: #c2c2c2;
    font-size: 40px;
}
.contentWrap .schWrap .sch_list.active-on .state .point{
    color:var(--main-color);
}
.contentWrap .schWrap .sch_list .state small{

}

.contentWrap .imgaddWrap{
    border: 1px solid #d8d8d8;
    padding:15px;
    overflow: hidden;
    overflow-x: auto;
    width: 100%;
}
.contentWrap .imgaddWrap .imageadd{
}
.contentWrap .imgaddWrap .imageadd .listcon{
    position: relative;
    margin-right: 7.5px;
    border-radius: 5px;
    overflow: hidden;
    width: 100px;
    height: 100px;
    flex:0 0 100px;
}
.contentWrap .imgaddWrap .imageadd .listcon:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .imgaddWrap .imageadd .listcon .abs_text{
    position: absolute;
    top: 5px;
    left: 5px;
    color: #fff;
    background: rgba(1,1,1,0.7);
    cursor: pointer;
    padding: 3px 10px;
    font-weight: 100;
}
.contentWrap .imgaddWrap .imageadd .listcon .abs_delete{
    position: absolute;
    top: 5px;
    right: 5px;
    color: #fff;
    background: rgba(1,1,1,0.7);
    cursor: pointer;
    padding: 3px 10px;
    font-weight: 100;
    user-select: none;
}
.contentWrap .imgaddWrap .imageadd .listcon .abs_add{
    position: absolute;
    top: 0;
    left: 0;
    color: #9e9d9b;
    cursor: pointer;
    font-size: 45px;
    font-weight: 300;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
}
.contentWrap .imgaddWrap .imageadd .listcon .image{
    width: 100%;
    height: 100%;
}
.contentWrap .imgaddWrap .imageadd .listcon .image{
    background: #ededed;
}

.contentWrap .btnlistWrap{
    display: flex;
    justify-content: space-between;
}
.contentWrap .btnlistWrap.--center{
    justify-content: center;
}
.contentWrap .btnlistWrap .btnlist{
    display: flex;
    align-items: center;
}
.contentWrap .btnlistWrap .btn{
    color: #fff;
    padding: 10px 25px;
    height: 100%;
    margin-right: 10px;
    white-space: nowrap;
    border-radius: 5px;
}
.contentWrap .btnlistWrap .btn:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .btnlistWrap .btn.--main{
    background: var(--main-color);
}
.contentWrap .btnlistWrap .btn.--sub{
    background: #282421;
}
.contentWrap .btnlistWrap .btn.--close{
    background: #b7b7b7;
}
.contentWrap .btnlistWrap .btn.--list{
    background: #bb9a73;
}

.contentWrap .btnaviWrap{
    margin-top: 2%;
}
.contentWrap .btnaviWrap .titlename{
    color: #333;
    margin-bottom:1%;
    font-size: 17px;
    font-weight: 700;
}
.contentWrap .btnaviWrap .wrap{
    background: #eee;
    padding: 1.5% 2.5%;
    display: flex;
    justify-content: space-between;
}
.contentWrap .btnaviWrap .list{
    display: flex;
    align-items: center;
}
.contentWrap .btnaviWrap .list.info{
    flex: 0 0 65%;
}
.contentWrap .btnaviWrap .list.info .btnWrap{
    flex: 1;
    display: flex;
    align-items: center;
    margin-right: 2.5%;
    font-size: 14px;
}
.contentWrap .btnaviWrap .list.info .btnWrap:nth-child(2n){
    margin-right:0;
}
.contentWrap .btnaviWrap .list.info .btnWrap .name{
    position: relative;
    padding-left:10px;
    color: #333;
    margin-right: 15px;
    white-space: nowrap;
}
.contentWrap .btnaviWrap .list.info .btnWrap .name::before{
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #696969;
    border-radius: 50%;
    width: 3px;
    height: 3px;
}
.contentWrap .btnaviWrap .list.info .btnWrap .name.must{
    padding-right: 10px;
}
.contentWrap .btnaviWrap .list.info .btnWrap .name.must::after{
    content:"*";
    color:red;
    position: absolute;
    right:0;
    top:0;
    font-size: 13px;
}
.contentWrap .btnaviWrap .list.info .btnWrap .select{
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
}
.contentWrap .btnaviWrap .list.info .btnWrap .input{
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #ededed;
}
.contentWrap .btnaviWrap .list.regi{
    flex: 0 0 20%;
    justify-content: flex-end;
}
.contentWrap .btnaviWrap .list.regi .btn{
    color: #fff;
    padding: 5px;
    height: 100%;
    margin-right: 5%;
    min-width: 140px;
    border-radius: 5px;
}
.contentWrap .btnaviWrap .list.regi .btn:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .btnaviWrap .list.regi .btn.--main{
    background: var(--main-color);
}
.contentWrap .btnaviWrap .list.regi .btn .text{
}

.contentWrap .alarmWrap{

}
.contentWrap .alarmWrap .wrap{
}
.contentWrap .alarmWrap .listWrap{

}
.contentWrap .alarmWrap .listWrap .list{
    border: 1px solid #c0c0c0;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom:15px;
}
.contentWrap .alarmWrap .listWrap .list:nth-last-child(1){
    margin-bottom:0;
}
.contentWrap .alarmWrap .listWrap .list_head{
    background: #ededed;
    transition: 0.5s all;
    padding: 0 15px 0 30px;
    height: 50px;
    display: flex;
    align-items: center;
    transition: 0.5s all;
    --my-color: #696969;
}
.contentWrap .alarmWrap .listWrap .list_head.active-on{
    background: var(--main-color);
    color:#fff;
    --my-color: #fff;
}
.contentWrap .alarmWrap .listWrap .list_head .title{
    font-weight: 300;
    position: relative;
    flex: 1;
}
.contentWrap .alarmWrap .listWrap .list_head.active-on .title{
    font-weight: 500;
}
.contentWrap .alarmWrap .listWrap .list_head .title:before{
    content: "";
    position: absolute;
    left: -15px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--my-color);
    border-radius: 50%;
    width: 4px;
    height: 4px;
    transition: 0.5s all;
}
.contentWrap .alarmWrap .listWrap .list_head .title:after{
    content: "";
    position: absolute;
    right: 20px;
    border: solid var(--my-color);
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 4px;
    top: 40%;
    transform: translateY(-50%) rotate(45deg);
    -webkit-transform: translateY(-50%) rotate(45deg);
    transition: 0.5s all;
}
.contentWrap .alarmWrap .listWrap .list_head.active-on .title:after{
    top: 70%;
    transform: translateY(-50%) rotate(225deg);
    -webkit-transform: translateY(-50%) rotate(225deg);
}
.contentWrap .alarmWrap .subcontent{
    overflow: hidden;
    display: none;
    padding: 50px 15px 30px;
}
.contentWrap .alarmWrap .subcontent.flexWrap{
    display: flex;
}
.contentWrap .alarmWrap .subcontent .flexWrap{
}
.contentWrap .alarmWrap .subcontent .sub_con{
    flex: 1;
    margin-right: 30px;
}
.contentWrap .alarmWrap .subcontent .sub_con:nth-last-child(1){
    margin-right: 0;
}
.contentWrap .alarmWrap .subcontent .sub_con.--big{
    flex:0 0 65%;
    margin-right:30px;
}
.contentWrap .alarmWrap .subcontent .sub_con .title{
    font-weight: 700;
    margin-bottom: 30px;
    color: #333;
}
.contentWrap .alarmWrap .subcontent .sub_con .area{
    border: 1px solid #c0c0c0;
    font-size: 14px;
}
/* .contentWrap .alarmWrap .subcontent .sub_con .check{
    background: #265673;
    color:#fff;
    padding:15px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    font-weight: 300;
}
.contentWrap .alarmWrap .subcontent .sub_con .check .text{
    margin-right:5px;
} */
.contentWrap .alarmWrap .subcontent .sub_con .checkbox{
    width: 16px;
    height: 16px;
    accent-color: #282421;
}
.contentWrap .alarmWrap .subcontent .sub_con .textarea{
    width: 100%;
    background: #ededed;
    border: none;
    padding:15px;
}
.contentWrap .alarmWrap .list .check{
    color: #fff;
    display: inline-flex;
    border: 1px solid #c9c9c9;
    padding: 10px 30px;
    background: #282421;
    border-radius: 10px;
}
.contentWrap .alarmWrap .list .check .text{
    margin-right: 5px;
    user-select: none;
}
.contentWrap .alarmWrap .list .warning{
    color: #ff3149;
    font-size: 14px;
    text-align: center;
    margin: 30px 0 15px;
}

.contentWrap .alarmWrap2{

}
.contentWrap .alarmWrap2 .wrap{
    border: 1px solid #c0c0c0;
    padding: 0 15px 30px 15px;
}
.contentWrap .alarmWrap2 .listWrap{
    display: flex;
}
.contentWrap .alarmWrap2 .listWrap .list{
    overflow: hidden;
    flex: 1;
}
.contentWrap .alarmWrap2 .listWrap .list.--big{
}
.contentWrap .alarmWrap2 .listWrap .list:nth-last-child(1){
    margin-right:0;
}
.contentWrap .alarmWrap2 .subcontent{
    overflow: hidden;
    height: 100%;
}
.contentWrap .alarmWrap2 .subcontent .flexWrap{
}
.contentWrap .alarmWrap2 .subcontent .sub_con{
    flex: 1;
}
.contentWrap .alarmWrap2 .subcontent .sub_con {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .title{
    font-weight: 700;
    margin-bottom: 30px;
    color: #333;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .title .plus{
    position: relative;
    top:0px;
    right: 0px;
    width: 16px;
    height: 16px;
    cursor:pointer;
    z-index: 1;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .title .plus:before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 2px;
    margin: -1px 0 0 -8px;
    background: var(--main-color);
    content: '';
}
.contentWrap .alarmWrap2 .subcontent .sub_con .title .plus:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2px;
    height: 16px;
    margin: -8px 0 0 -1px;
    background: var(--main-color);
    content: '';
}
.contentWrap .alarmWrap2 .subcontent .sub_con .area{
    border: 1px solid #c0c0c0;
    font-size: 14px;
    height: 100%;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .check{
    background: #265673;
    color:#fff;
    padding:15px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    font-weight: 300;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .check .text{
    margin-right:5px;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .checkbox{
    width: 16px;
    height: 16px;
    accent-color: #282421;
}
.contentWrap .alarmWrap2 .subcontent .sub_con .textarea{
    width: 100%;
    background: #ededed;
    border: none;
    padding:15px;
    height: 100%;
}
.contentWrap .alarmWrap2 .list .warning{
    color: #ff3149;
    font-size: 14px;
    text-align: center;
    padding: 30px 0 0;
}
.contentWrap .alarmWrap2 .choiceWrap{
    border: 1px solid #c0c0c0;
    height: 100%;
    max-height: calc(43px * 11);
    overflow: auto;
}
.contentWrap .alarmWrap2 .choicelist{
    padding:10px;
    cursor: pointer;
    transition: 0.3s all;
    font-size: 14px;
}
.contentWrap .alarmWrap2 .choicelist.active-focus{
    background: #ededed;
}
.contentWrap .alarmWrap2 .btnWrap{
    display: flex;
    height: 34px;
}
.contentWrap .alarmWrap2 .btnWrap .topbtn{
    padding: 7px 20px;
    background: var(--main-color);
    color: #fff;
    border-radius: 5px;
    min-width: 120px;
}
.contentWrap .alarmWrap2 .topnaviWrap .list.regi .btn{
    min-width: auto;
    font-size: 14px;
    padding: 0 10px;
}
.contentWrap .alarmWrap2 .topnaviWrap .list.regi .input{
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #ededed;
    height: 100%;
    color:#333;
}
.contentWrap .alarmWrap2 .btnWrap .btn.--sch{
    background: var(--main-color);
}
.contentWrap .alarmWrap2 .btnWrap .btn.--save{
    background: #282421;
}
.contentWrap .alarmWrap2 .btnWrap .btn .text{
}

/*layer*/
.layer_pop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(1, 1, 1, 0.7);
    width: 100%;
    display: none;
    z-index: 111;
}
.layer_container {
    width: calc(100% - 20px);
    margin: 0 auto;
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: center;
    position: absolute;
    left: auto;
    top: auto;
}
.layer_pop .column {
    flex-direction: column;
}
.layer_pop .wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: left;
    padding: 30px 0;
    border: 1px solid #fff;
    background: #fff;
    border-radius: 20px;
    min-width: 700px;
}
.layer-close,
.layer-success {
    cursor: pointer;
    position: relative;
    z-index: 2;
}
.layer_pop .conlist{
    width: 100%;
    border-bottom: 1px solid transparent;
    margin-bottom:15px;
    padding:0 15px;
    padding-bottom: 15px;
}
.layer_pop .conlist:nth-last-child(1){
    border-bottom: 0;
    margin-bottom: 0;
    padding-bottom:0;
}
.layer_pop .conlist .contitle{
    font-size: 22px;
    font-weight: 700;
    border-bottom:1px solid #797979;
    padding-bottom: 15px;
    margin-bottom: 15px;
    color: #191919;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.layer_pop .conlist .contitle .text{
    position: relative;
    padding-left: 15px;
}
.layer_pop .conlist .contitle.--subtitle{
    border: none;
    padding-bottom:0;
}
.layer_pop .conlist .contitle.--subtitle .text{
    font-weight: 500;
    padding-left: 0;
    font-size: 18px;
}
.layer_pop .conlist .contitle.--subtitle .text:before{
    display: none;
}
.layer_pop .conlist .contitle .text::before{
    content:"";
    width:4px;
    height: 4px;
    position: absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    background: #191919;
    border-radius: 50%;
}
.layer_pop .conlist .contitle .btnWrap{
    display: flex;
    align-items: center;
    margin-right: 20px;
    font-weight: 400;
    color: #696969;
}
.layer_pop .conlist .contitle .btnWrap .btn{
    color: #fff;
    padding: 8px;
    height: 100%;
    min-width: 120px;
    border-radius: 30px;
    font-size: 14px;
    border: 1px solid transparent;
    min-height: 35px;
    background: #282421;
    display: flex;
    align-items: center;
    justify-content: center;
}
.layer_pop .conlist .contitle .btnWrap .btn .text{
    font-size: inherit;
}
.layer_pop .conlist .contitle .btnWrap .name{
    white-space: nowrap;
    margin-right: 10px;
    font-size: 14px;
    color: #333;
}
.layer_pop .conlist .contitle.--subtitle .btnWrap .name{
    font-size: 18px;
    font-weight: 500;
}
.layer_pop .conlist .contitle .btnWrap .select{
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 150px;
    font-size: 14px;
}
.layer_pop .conlist .contitle .btnWrap .input{
    width: 100%;
    background: #fff;
    border: 1px solid #ededed;
    padding: 5px;
    transition: 0.3s all;
    color: #333;
    font-size: 14px;
}

.layer_pop .conlist .subtitle{
    font-size: 22px;
    font-weight: 700;
    padding-bottom: 20px;
    color: #191919;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.layer_pop .conlist .subtitle .btnWrap{
    display: flex;
    align-items: center;
    margin-right: 20px;
    font-weight: 400;
    color: #696969;
}
.layer_pop .conlist .subtitle .btnWrap .name{
    white-space: nowrap;
    margin-right: 10px;
    font-size: 18px;
    font-weight: 500;
    color: #333;
}
.layer_pop .conlist .subtitle .btnWrap .select{
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    min-width: 150px;
    font-size: 14px;
}
.layer_pop .conlist .subtitle .btnWrap .input{
    width: 100%;
    background: #fff;
    border: 1px solid #ededed;
    padding: 5px;
    transition: 0.3s all;
    color: #333;
    font-size: 14px;
}
.layer_pop .conlist .subtitle .btnWrap .btn{
    background: var(--main-color);
    color: #fff;
    border-radius: 5px;
    padding: 7px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    font-size: 14px;
    margin-left: 10px;
}

.layer_pop .tableWrap{
    
}
.layer_pop .tableWrap .topnaviWrap{
    background: #eee;
    display: flex;
    justify-content: space-between;
    margin-bottom: 3%;
    overflow: hidden;
    transition: 0.3s all;
    height: auto;
    padding: 1.5% 2.5%;
}
.layer_pop .tableWrap .topnaviWrap .btnWrap {
    flex: 0 1 50%;
    display: flex;
    align-items: center;
    margin-right: 2.5%;
    font-size: 14px;
}
.layer_pop .tableWrap .topnaviWrap .btnWrap.--jump{
    margin-right: 7.5%;
}
.layer_pop .tableWrap .topnaviWrap .list{
    display: flex;
    align-items: center;
}
.layer_pop .tableWrap .topnaviWrap .list.info {
    flex: 0 0 70%;
    margin-right: 15px;
}
.layer_pop .tableWrap .topnaviWrap .btnWrap .name {
    position: relative;
    color: #333;
    margin-right: 5px;
    white-space: nowrap;
}
.layer_pop .tableWrap .topnaviWrap .btnWrap .name.right{
    margin-left: 2.5px;
}
.layer_pop .tableWrap .topnaviWrap .btnWrap .select {
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding: 5px;
    color: #333;
    width: auto;
}
.layer_pop .tableWrap .topnaviWrap .list.regi .btn {
    color: #fff;
    padding: 5px;
    height: 100%;
    border-radius: 5px;
    display: flex;
    align-items: center;
    min-width: 75px;
    justify-content: center;
    font-size: 14px;
}
.layer_pop .tableWrap .topnaviWrap .list.regi .btn.--main {
    background: var(--main-color);
}
.layer_pop .tableWrap .topnaviWrap .list.regi .btn .text {padding-left: 5px;}
.layer_pop .tableWrap .tablectr{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1%;
}
.layer_pop .tableWrap .tablectr .infoWrap .info {
    color: var(--main-color);
    font-weight: 500;
    padding-left: 10px;
}
.layer_pop .tableWrap .tablebox{
    width: 100%;
    text-align: center;
    table-layout: fixed;
    overflow: hidden;
    max-height: calc(43px * 9 + 1px);
    overflow: auto;
}
.layer_pop .tableWrap .tablebox.--max3{
    max-height: calc(43px * 4 + 1px);
}
.layer_pop .tableWrap .tablebox.--max4{
    max-height: calc(43px * 5 + 1px);
}
.layer_pop .tableWrap .tablebox.--max5{
    max-height: calc(43px * 6 + 1px);
}
.layer_pop .tableWrap .table{
    width: 100%;
    border: 0.5px solid #c0c0c0;
}
.layer_pop .tableWrap .table .checkbox{
    width: 16px;
    height: 16px;
    accent-color: #282421;
}
.layer_pop .tableWrap .table .btnWrap{
    
}
.layer_pop .tableWrap .table .btnWrap.list{
    margin-right:15px;
}
.layer_pop .tableWrap .table .btnWrap.list:nth-last-child(1){
    margin-right: 0;
}
.layer_pop .tableWrap .table .btnWrap .name{
    color:#333;
}
.layer_pop .tableWrap .table .btnWrap .name.left{
    margin-right: 5px;
}
.layer_pop .tableWrap .table .btnWrap .name.right{
    margin-left: 5px;
}
.layer_pop .tableWrap .table .btnWrap .name.--title{
    margin-right: 15px;
    font-weight: 700;
}
.layer_pop .tableWrap .table .btnWrap .btn{
    background: var(--main-color);
    color:#fff;
    border-radius: 15px;
    padding:7px 20px;
}
.layer_pop .tableWrap .table .thead{
    position: sticky;
    top:0;
    z-index: 2;
}
.layer_pop .tableWrap .table .thead_list{
    background: #265673;
    color: #fff;
    border-radius: 15px;
    padding: 8px;
    min-width: 75%;
    font-size: 14px;
    border-left: 1px solid #265673;
}
.layer_pop .tableWrap .table .thead_list .con{
    padding: 10px 0;
    height: 43px;
    border-right: 0.5px solid #b7b5b2;
}
.layer_pop .tableWrap .table .tbody_list{
    font-size: 14px;
}
.layer_pop .tableWrap .table .tbody_list .con{
    padding:2.5px 10px;
    font-weight: 400;
    white-space: nowrap;
    border: 0.5px solid #c0c0c0;
    text-align: left;
    height: 43px;
}
.layer_pop .tableWrap .table .tbody_list .container {
    background-color: #fff;
    padding: 3px 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.layer_pop .tableWrap .table .tbody_list .con .select{
    width: 100%;
    border-color: #ededed;
    border-radius: 5px;
    padding:3px 5px;
    color: #333;
}
.layer_pop .tableWrap .table .tbody_list .con .input{
    width: 100%;
    background: #fff;
    border: 1px solid #ededed;
    padding: 5px;
    transition: 0.3s all;
    color: #333;
}
.layer_pop .tableWrap .table .timetbody .tbody_list .con .input{
    width: 40px;
    text-align: center;
}
.layer_pop .tableWrap .table .tbody_list .con.center{
    text-align: center;
}
.layer_pop .tableWrap .table .con.tbody_th{
    text-align: center;
}
.layer_pop .tableWrap .table .tbody_th{
    background: #fbf6f0;
}
.layer_pop .tableWrap .table .tbody_list .btnWrap .label{
    width: 100%;
}
.layer_pop .tableWrap .table .tbody_list .calenderWrap .input{
}
.layer_pop .tableWrap .table .tbody_list .calenderWrap .ico.--abs{
    position: absolute;
    right: 15px;
    top:50%;
    transform: translateY(-50%);
}
.layer_pop .tableWrap .table .addWrap{
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, 1fr);
    padding: 0 20px;
    max-height: 135px;
    overflow-y: scroll;
    margin-top: 10px;
}
.layer_pop .tableWrap .table .addlist{
    flex:0 0 45%;
    display: flex;
    justify-content: space-between;
    border: 1px solid #c0c0c0;
    border-radius: 30px;
    padding: 10px 15px;
}
.layer_pop .tableWrap .table .addlist .text{

}
.layer_pop .tableWrap .table .addlist .ico{
    cursor: pointer;
}

.layer_pop .tableWrap .choiceWrap{
    border: 1px solid #ededed;
    max-height: 150px;
    overflow-y: scroll;
    margin-bottom: 2.5%;
}
.layer_pop .tableWrap .choicelist{
    padding:10px;
    cursor: pointer;
    transition: 0.3s all;
    font-size: 14px;
}
.layer_pop .tableWrap .choicelist.active-focus{
    background: #fbf6f0;
    color:var(--main-color);
}
.layer_pop .tableWrap .btnlistWrap{
    display: flex;
    justify-content: space-between;
}
.layer_pop .tableWrap .btnlistWrap.--center{
    justify-content: center;
}
.layer_pop .tableWrap .btnlistWrap .btnlist{
    display: flex;
    align-items: center;
}
.layer_pop .tableWrap .btnlistWrap .btn{
    color: #fff;
    padding: 10px 25px;
    height: 100%;
    margin-right: 10px;
    white-space: nowrap;
    border-radius: 5px;
}
.layer_pop .tableWrap .btnlistWrap .btn:nth-last-child(1){
    margin-right: 0;
}
.layer_pop .tableWrap .btnlistWrap .btn.--main{
    background: var(--main-color);
}
.layer_pop .tableWrap .btnlistWrap .btn.--sub{
    background: #282421;
}
.layer_pop .tableWrap .btnlistWrap .btn.--close{
    background: #b7b7b7;
}
.layer_pop .timetable .table .thead_list{
    border-color: #b7b7b7;
}
.layer_pop .timetable .thead .con{
    background: #fbf6f0;
    color:#696969;
    transition: 0.5s all;
}
.layer_pop .timetable .thead .time{
    background: #ededed;
    color:#b7b7b7;
    cursor: pointer;
}
.layer_pop .timetable .thead .time.active-on{
    background: #265673;
    color:#fff;
}
.layer_pop .timetable .timetbody {
    display: none;
}
.layer_pop .timetable .timetbody.active-on{
    display: table-row-group;
}

.layer_pop .boxWrap{
    height: auto;
    display: flex;
    flex-direction: column;
    flex: 0 0 45%;
    margin-left: 2.5%;
}
.layer_pop .boxWrap .title{
    height: 43px;
    display: flex;
    align-items: center;
    font-weight: 500;
}
.layer_pop .boxWrap .content {
    flex: 1;
}
.layer_pop .boxWrap .content .mark{
    height: 100%;
}

.footer{
    background: #d7d7d7;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5% 0;
}


/* ================================================================
   SD 주간보호센터 CRM — 공통 확장 스타일
   (각 페이지 내 <style> 블록 대신 이 파일에 통합 관리)
   추가일: 2026-05-14
   ================================================================ */

/* ── 상태 배지 (공통 — 상담목록·대시보드·고객목록 공용) ──────── */
.status-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.status-wait   { background: #e9ecef; color: #495057; }
.status-assign { background: #cce5ff; color: #004085; }
.status-ing    { background: #d1ecf1; color: #0c5460; }
.status-done   { background: #d4edda; color: #155724; }
.status-end    { background: #f8d7da; color: #721c24; }

/* 그룹 코드 배지 */
.group-badge {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.group-super   { background: #212529; color: #fff; }
.group-center  { background: #0e2c42; color: #fff; }
.group-counsel { background: #0d6efd; color: #fff; }
.group-content { background: #6610f2; color: #fff; }
.group-stats   { background: #198754; color: #fff; }
.group-custom  { background: #fd7e14; color: #fff; }

/* 로그 타입 배지 */
.log-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}
.log-login   { background: #cce5ff; color: #004085; }
.log-logout  { background: #e2e3e5; color: #383d41; }
.log-insert  { background: #d4edda; color: #155724; }
.log-update  { background: #fff3cd; color: #856404; }
.log-delete  { background: #f8d7da; color: #721c24; }
.log-export  { background: #d1ecf1; color: #0c5460; }
.log-lock    { background: #f8d7da; color: #721c24; }

/* ── 탭 상태 필터 (상담목록 공용) ──────────────────────────────── */
.tab_status {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.tab_status a {
    padding: 5px 14px;
    border-radius: 4px;
    border: 1px solid #ccc;
    font-size: 13px;
    color: #555;
    text-decoration: none;
    background: #fff;
    transition: 0.2s all;
}
.tab_status a:hover { background: #f0f0f0; }
.tab_status a.on {
    background: var(--main-color);
    color: #fff;
    border-color: var(--main-color);
}

/* ── 페이지 버튼 (공통 paging) ──────────────────────────────────── */
.page_btn {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid #ddd;
    font-size: 13px;
    color: #555;
    text-decoration: none;
    background: #fff;
    margin: 0 2px;
    transition: 0.15s all;
}
.page_btn:hover { background: #f0f0f0; }
.page_btn.on,
.page_btn.num.on {
    background: var(--main-color);
    color: #fff;
    border-color: var(--main-color);
    font-weight: 700;
}
.page_btn.first, .page_btn.last { color: #888; }
.page_btn.prev, .page_btn.next { color: var(--main-color); font-weight: 600; }

/* ── 공통 섹션 타이틀 ────────────────────────────────────────────── */
.section_title {
    font-size: 15px;
    font-weight: 700;
    color: var(--main-color);
    margin-bottom: 12px;
    padding-left: 10px;
    border-left: 4px solid var(--main-color);
}

/* ── 대시보드 ───────────────────────────────────────────────────── */
.dash_statWrap {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}
.dash_stat_card {
    flex: 1;
    min-width: 140px;
    background: #fff;
    border-radius: 12px;
    padding: 20px 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
    text-align: center;
    border-top: 4px solid #ccc;
}
.dash_stat_card.wait   { border-color: #6c757d; }
.dash_stat_card.assign { border-color: #0e2c42; }
.dash_stat_card.ing    { border-color: #17a2b8; }
.dash_stat_card.done   { border-color: #28a745; }
.dash_stat_card.end    { border-color: #adb5bd; }
.dash_stat_card .label { font-size: 13px; color: #666; margin-bottom: 8px; }
.dash_stat_card .count { font-size: 32px; font-weight: 700; color: var(--main-color); }
.dash_stat_card .unit  { font-size: 13px; color: #999; margin-left: 2px; }
.dash_today_badge {
    display: inline-block;
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffc107;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 13px;
    margin-bottom: 18px;
}
.dash_section_title {
    font-size: 15px;
    font-weight: 700;
    color: var(--main-color);
    margin-bottom: 12px;
    padding-left: 10px;
    border-left: 4px solid var(--main-color);
}

/* ── 통계 페이지 ─────────────────────────────────────────────────── */
.stats_cardWrap {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}
.stats_card {
    flex: 1;
    min-width: 160px;
    background: #fff;
    border-radius: 10px;
    padding: 18px 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
    border-left: 5px solid var(--main-color);
}
.stats_card .s_label { font-size: 13px; color: #888; margin-bottom: 6px; }
.stats_card .s_value { font-size: 28px; font-weight: 700; color: var(--main-color); }
.stats_card .s_unit  { font-size: 13px; color: #aaa; margin-left: 2px; }
.stats_card.--green  { border-left-color: #28a745; }
.stats_card.--blue   { border-left-color: #0d6efd; }
.stats_card.--orange { border-left-color: #fd7e14; }
.stats_card.--teal   { border-left-color: #17a2b8; }

.stats_chart_box {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
    margin-bottom: 20px;
}
.stats_chart_box .chart_title {
    font-size: 14px;
    font-weight: 700;
    color: var(--main-color);
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}
.stats_chart_placeholder {
    background: #f8f9fa;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 220px;
    color: #aaa;
    font-size: 14px;
}

.stats_table th {
    background: #f0f4f8;
    color: var(--main-color);
    font-weight: 600;
    text-align: center;
    padding: 10px 8px;
    border: 1px solid #dee2e6;
    font-size: 13px;
}
.stats_table td {
    text-align: center;
    padding: 8px;
    border: 1px solid #dee2e6;
    font-size: 13px;
}
.stats_table tr:hover td { background: #f5f8ff; }
.stats_table .total_row td { font-weight: 700; background: #e8f0fe; }

/* ── 콘텐츠 관리 (공지사항 / 갤러리) ────────────────────────────── */
.content_topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    flex-wrap: wrap;
    gap: 8px;
}
.content_topbar .cb_title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}
.content_topbar .cb_btn {
    padding: 6px 16px;
    background: var(--main-color);
    color: #fff;
    border-radius: 5px;
    font-size: 13px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: 0.2s;
}
.content_topbar .cb_btn:hover { opacity: 0.85; }
.content_topbar .cb_btn.--gray {
    background: #6c757d;
}

/* 공지사항 리스트 */
.notice_list_item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #eee;
    gap: 12px;
    cursor: pointer;
    transition: 0.15s;
}
.notice_list_item:hover { background: #f8f9fa; }
.notice_list_item .n_num   { width: 50px; text-align: center; color: #aaa; font-size: 13px; }
.notice_list_item .n_badge {
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    background: #cce5ff;
    color: #004085;
    white-space: nowrap;
}
.notice_list_item .n_badge.important { background: #f8d7da; color: #721c24; }
.notice_list_item .n_title { flex: 1; font-size: 14px; color: #333; }
.notice_list_item .n_admin { width: 90px; text-align: center; font-size: 13px; color: #777; }
.notice_list_item .n_date  { width: 100px; text-align: right; font-size: 12px; color: #aaa; }
.notice_list_head {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    border-bottom: 2px solid #dee2e6;
    background: #f0f4f8;
    gap: 12px;
    font-size: 13px;
    font-weight: 600;
    color: #555;
}
.notice_list_head .n_num   { width: 50px; text-align: center; }
.notice_list_head .n_badge { width: 60px; text-align: center; }
.notice_list_head .n_title { flex: 1; }
.notice_list_head .n_admin { width: 90px; text-align: center; }
.notice_list_head .n_date  { width: 100px; text-align: right; }

/* 갤러리 그리드 */
.gallery_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}
.gallery_item {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
    cursor: pointer;
    transition: 0.2s;
}
.gallery_item:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.gallery_item .gi_thumb {
    width: 100%;
    height: 140px;
    background: #f0f4f8;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.gallery_item .gi_thumb img { width: 100%; height: 100%; object-fit: cover; }
.gallery_item .gi_thumb .gi_no_img { color: #ccc; font-size: 13px; }
.gallery_item .gi_info { padding: 10px 12px; }
.gallery_item .gi_info .gi_title { font-size: 14px; font-weight: 500; color: #333; margin-bottom: 4px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.gallery_item .gi_info .gi_date  { font-size: 12px; color: #aaa; }

/* ── 그룹 권한 관리 ──────────────────────────────────────────────── */
.perm_matrix {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.perm_matrix th {
    background: #f0f4f8;
    color: var(--main-color);
    font-weight: 600;
    text-align: center;
    padding: 10px 6px;
    border: 1px solid #dee2e6;
    white-space: nowrap;
}
.perm_matrix th.th_menu { text-align: left; padding-left: 14px; }
.perm_matrix td {
    text-align: center;
    padding: 8px 6px;
    border: 1px solid #dee2e6;
}
.perm_matrix td.td_menu {
    text-align: left;
    padding-left: 14px;
    font-weight: 500;
    color: #333;
    background: #fafafa;
}
.perm_matrix td.td_menu.parent {
    font-weight: 700;
    color: var(--main-color);
    background: #eef2f7;
}
.perm_matrix td.td_sub { padding-left: 28px; }
.perm_matrix .perm_y { color: #28a745; font-weight: 700; font-size: 15px; }
.perm_matrix .perm_n { color: #dee2e6; font-size: 15px; }
.perm_matrix tr:hover td { background: #f5f8ff; }
.perm_matrix tr:hover td.td_menu.parent { background: #e8eff8; }

/* 그룹 카드 */
.group_card_list {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.group_card {
    display: flex;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid #eee;
    gap: 14px;
    transition: 0.15s;
}
.group_card:hover { background: #f8f9fa; }
.group_card .gc_badge { min-width: 80px; text-align: center; }
.group_card .gc_name { font-size: 15px; font-weight: 600; color: #333; flex: 0 0 140px; }
.group_card .gc_desc { flex: 1; font-size: 13px; color: #777; }
.group_card .gc_cnt  { font-size: 13px; color: #555; min-width: 80px; text-align: center; }
.group_card .gc_btn  { min-width: 70px; text-align: right; }
.group_card .gc_btn a {
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
    background: var(--main-color);
    text-decoration: none;
    transition: 0.15s;
}
.group_card .gc_btn a:hover { opacity: 0.8; }

/* ── 센터 관리 ───────────────────────────────────────────────────── */
.center_card_list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin-bottom: 20px;
}
.center_card {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
    border-left: 5px solid var(--main-color);
    position: relative;
}
.center_card.inactive { border-left-color: #adb5bd; opacity: 0.75; }
.center_card .cc_name { font-size: 18px; font-weight: 700; color: var(--main-color); margin-bottom: 8px; }
.center_card .cc_row  { display: flex; align-items: flex-start; margin-bottom: 5px; font-size: 13px; gap: 8px; }
.center_card .cc_row .cc_key { color: #888; min-width: 60px; }
.center_card .cc_row .cc_val { color: #333; }
.center_card .cc_badge {
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}
.center_card .cc_badge.use   { background: #d4edda; color: #155724; }
.center_card .cc_badge.noUse { background: #e9ecef; color: #6c757d; }

/* ── 시스템 로그 ─────────────────────────────────────────────────── */
.log_detail_btn {
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
    background: #6c757d;
    color: #fff;
    border: none;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}
.log_detail_btn:hover { background: #5a6268; }

/* ── 공통 뷰/폼 박스 ──────────────────────────────────────────────── */
.view_box {
    background: #fff;
    border-radius: 10px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
    margin-bottom: 20px;
}
.view_box .vb_title {
    font-size: 16px;
    font-weight: 700;
    color: var(--main-color);
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e9ecef;
}
.view_row {
    display: flex;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
}
.view_row:last-child { border-bottom: none; }
.view_row .vr_key {
    flex: 0 0 130px;
    padding: 11px 14px;
    background: #f8f9fa;
    color: #666;
    font-weight: 500;
    border-right: 1px solid #eee;
}
.view_row .vr_val {
    flex: 1;
    padding: 11px 16px;
    color: #333;
    word-break: break-all;
}

/* ── 빈 데이터 안내 ───────────────────────────────────────────────── */
.empty_data {
    text-align: center;
    padding: 40px 20px;
    color: #aaa;
    font-size: 14px;
}
.empty_data .ed_icon { font-size: 32px; margin-bottom: 8px; }

/* ── 알림/정보 박스 ──────────────────────────────────────────────── */
.info_box {
    padding: 12px 16px;
    border-radius: 6px;
    font-size: 13px;
    margin-bottom: 14px;
}
.info_box.--info    { background: #cce5ff; color: #004085; border-left: 4px solid #004085; }
.info_box.--warning { background: #fff3cd; color: #856404; border-left: 4px solid #856404; }
.info_box.--danger  { background: #f8d7da; color: #721c24; border-left: 4px solid #721c24; }
.info_box.--success { background: #d4edda; color: #155724; border-left: 4px solid #155724; }

@media(max-width:1080px){
    body.have_responsive{
        min-width: auto;
    }
    body.have_responsive img{
        width: 100%;
    }
    .loginWrap{
        
    }
    .loginWrap .container{
        flex-direction: column;
    }
    .loginWrap .logoWrap{
        flex: 0 1 40%;
        width: 100%;
        padding: 0;
        justify-content: center;
        padding: 5% 0;
    }
    .loginWrap .logoWrap .logo{
        width: auto;
        max-width: 80%;
        text-align: center;
    }
    .loginWrap .logoWrap .logo .image{
        padding:0 15% 10%;
    }
    .loginWrap .logoWrap .logo .text{
        font-size: 28px;
    }
    .loginWrap .login{
        flex: 1;
        width: 100%;
        align-items: flex-start;
    }
    .loginWrap .login .content{
        padding:5%;
        width: 100%;
    }
    .loginWrap .login .stateWrap{
    }
    .loginWrap .login .submitWrap{
        width: 100%;
        border-radius: 10px;
    }
    .loginWrap .login .submitWrap .btn{
        justify-content: center;
        padding: 5%;
    }
    .loginWrap .login .submitWrap .btn .ico{
        display: none;
    }

} 
@media(max-width:650px){
    .loginWrap .logoWrap .logo{
        width: 50%;
    }
    .loginWrap .logoWrap .logo .text{
        font-size: 20px;
    }
    .loginWrap .login .stateWrap{
        font-size: 13px;
    }
    .loginWrap .login .stateWrap .state_con{
        margin-right: 5px;
        padding-right: 5px;
    }
    .loginWrap .login .stateWrap .save{
        align-items: flex-end;
    }
    .loginWrap .login .submitWrap .alert{
        font-size: 16px;
    }
}


/* ══════════════════════════════════════════════════════════════
   로그인 페이지 전용 스타일
   — login.asp 인라인 <style> 에서 이전
   — .layer_pop .wrap 의 align-items:center / min-width:700px 충돌
     → 각 팝업 래퍼에 align-items:stretch 오버라이드로 해소
══════════════════════════════════════════════════════════════ */

/* ── 로그인 페이지 알림 메시지 박스 ── */
.loginWrap .msg {
    padding: 11px 14px;
    border-radius: 9px;
    font-size: 12.5px;
    line-height: 1.5;
    margin-bottom: 18px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.loginWrap .msg.msg-info  { background: #e3f2fd; color: #1565c0; border: 1px solid #90caf9; }
.loginWrap .msg.msg-error { background: #ffebee; color: #c62828; border: 1px solid #ef9a9a; }
.loginWrap .msg .msg-icon { flex-shrink: 0; font-size: 14px; }


/* ══════════════════════════════════════════════════
   회원가입 신청 레이어 팝업 (#pop_register)
══════════════════════════════════════════════════ */
/* .layer_pop .wrap 오버라이드 — align-items:stretch 로 콘텐츠 전폭 보장 */
#pop_register .wrap {
    min-width: 800px;
    max-width: 860px;
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
    align-items: stretch;
}

/* 팝업 헤더 */
.regi_pop_hd {
    background: var(--main-color);
    color: #fff;
    padding: 22px 32px 20px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-radius: 18px 18px 0 0;
}
.regi_pop_hd .hd_text .title {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.3px;
    line-height: 1.3;
}
.regi_pop_hd .hd_text .subtitle {
    font-size: 12.5px;
    color: rgba(255,255,255,0.70);
    margin-top: 5px;
    line-height: 1.4;
}
.regi_pop_hd .btn_close_regi {
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 2px;
    opacity: 0.75;
    transition: opacity 0.18s;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-top: 2px;
}
.regi_pop_hd .btn_close_regi:hover { opacity: 1; }
.regi_pop_hd .btn_close_regi img {
    filter: brightness(10);
    width: 20px;
    height: 20px;
}

/* 팝업 본문 스크롤 영역 */
.regi_pop_bd {
    padding: 24px 32px 20px;
    max-height: 68vh;
    overflow-y: auto;
}

/* 섹션 타이틀 */
.regi_sec_title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--main-color);
    border-bottom: 2px solid var(--main-color);
    padding-bottom: 8px;
    margin-bottom: 14px;
    letter-spacing: 0;
    line-height: 1;
}

/* 2열 그리드 */
.regi_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 20px;
    margin-bottom: 18px;
}
.regi_grid.--c1 { grid-template-columns: 1fr; }

/* 필드 */
.regi_fld { display: flex; flex-direction: column; }
.regi_fld label {
    font-size: 11.5px;
    font-weight: 700;
    color: #444;
    margin-bottom: 6px;
    letter-spacing: 0;
    line-height: 1;
}
.regi_fld label .req { color: #e53935; margin-left: 2px; }
.regi_fld input[type="text"],
.regi_fld input[type="password"],
.regi_fld select,
.regi_fld textarea {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    border: 1.5px solid #d8d8d8;
    border-radius: 7px;
    font-size: 14px;
    color: #222;
    background: #f9f9f9;
    transition: border-color 0.18s, box-shadow 0.18s, background 0.18s;
    font-family: inherit;
    letter-spacing: 0;
    line-height: normal;
}
.regi_fld textarea {
    height: 78px;
    padding: 10px 12px;
    resize: vertical;
    line-height: 1.55;
}
.regi_fld input:focus,
.regi_fld select:focus,
.regi_fld textarea:focus {
    border-color: var(--main-color);
    box-shadow: 0 0 0 3px rgba(14,44,66,0.09);
    background: #fff;
    outline: none;
}
.regi_fld .fld_hint {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4;
}
.regi_fld .fld_err {
    font-size: 11px;
    color: #e53935;
    margin-top: 4px;
    line-height: 1.4;
    display: none;
}

/* 아이디 중복확인 행 */
.regi_id_row { display: flex; gap: 8px; }
.regi_id_row input { flex: 1; min-width: 0; }
.btn_chk_id {
    height: 42px;
    padding: 0 14px;
    background: #546e7a;
    color: #fff;
    border: none;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    letter-spacing: 0;
    transition: background 0.18s;
    flex-shrink: 0;
}
.btn_chk_id:hover { background: var(--main-color); }

/* 개인정보 동의 */
.regi_agree_box {
    background: #f5f7f8;
    border: 1px solid #e0e5e8;
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 4px;
}
.regi_agree_box label {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 13px;
    color: #444;
    cursor: pointer;
    line-height: 1.5;
}
.regi_agree_box input[type="checkbox"] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px;
    cursor: pointer;
    accent-color: var(--main-color);
}
#err_agree {
    font-size: 11px;
    color: #e53935;
    margin-top: 6px;
    display: none;
}

/* 팝업 메시지 박스 */
.regi_msg_box {
    padding: 10px 14px;
    border-radius: 7px;
    font-size: 13px;
    margin-bottom: 14px;
    display: none;
    line-height: 1.5;
}
.regi_msg_box.--err  { background: #ffebee; color: #c62828; border: 1px solid #ef9a9a; }
.regi_msg_box.--ok   { background: #e8f5e9; color: #2e7d32; border: 1px solid #a5d6a7; }
.regi_msg_box.--info { background: #e3f2fd; color: #1565c0; border: 1px solid #90caf9; }

/* 팝업 푸터 버튼 영역 */
.regi_pop_ft {
    padding: 14px 32px 26px;
    display: flex;
    gap: 10px;
    justify-content: center;
    border-top: 1px solid #eee;
    margin-top: 4px;
}
.btn_regi_submit {
    height: 46px;
    padding: 0 54px;
    background: var(--main-color);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    letter-spacing: -0.3px;
    transition: opacity 0.18s;
}
.btn_regi_submit:hover { opacity: 0.88; }
.btn_regi_cancel {
    height: 46px;
    padding: 0 28px;
    background: #fff;
    color: #666;
    border: 1.5px solid #ccc;
    border-radius: 8px;
    font-size: 15px;
    cursor: pointer;
    letter-spacing: -0.3px;
    transition: border-color 0.18s, color 0.18s;
}
.btn_regi_cancel:hover { border-color: #999; color: #333; }


/* ══════════════════════════════════════════════════
   아이디 찾기 / 비밀번호 찾기 팝업
   (#pop_find_id, #pop_find_pw)
   — find_id.asp / find_pw.asp 의 .find_box 스타일 그대로
   — 충돌 방지: 모든 규칙을 팝업 ID로 스코프 제한
   — .layer_pop .wrap 의 align-items:center 오버라이드 → stretch
══════════════════════════════════════════════════ */
#pop_find_id .wrap,
#pop_find_pw .wrap {
    min-width: 480px;
    max-width: 520px;
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.18);
    align-items: stretch;
}

/* 헤더 */
#pop_find_id .find_box_hd,
#pop_find_pw .find_box_hd {
    background: var(--main-color);
    color: #fff;
    padding: 26px 32px 22px;
    position: relative;
}
#pop_find_id .find_box_hd .hd_logo,
#pop_find_pw .find_box_hd .hd_logo  { font-size:13px; font-weight:700; color:rgba(255,255,255,0.65); margin-bottom:8px; letter-spacing:0.5px; }
#pop_find_id .find_box_hd .hd_title,
#pop_find_pw .find_box_hd .hd_title { font-size:22px; font-weight:700; letter-spacing:-0.5px; line-height:1.2; }
#pop_find_id .find_box_hd .hd_sub,
#pop_find_pw .find_box_hd .hd_sub   { font-size:13px; color:rgba(255,255,255,0.65); margin-top:6px; line-height:1.4; padding-right:28px; }

/* 헤더 닫기 버튼 */
#pop_find_id .btn_close_find,
#pop_find_pw .btn_close_find {
    position: absolute;
    top: 18px;
    right: 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: rgba(255,255,255,0.70);
    font-size: 22px;
    line-height: 1;
    padding: 2px 4px;
    transition: color 0.18s;
}
#pop_find_id .btn_close_find:hover,
#pop_find_pw .btn_close_find:hover { color: #fff; }

/* 본문 */
#pop_find_id .find_box_bd,
#pop_find_pw .find_box_bd { padding: 28px 32px 30px; }

/* 방법 탭 (아이디 찾기) */
#pop_find_id .find_method_tab {
    display: flex;
    border-radius: 9px;
    overflow: hidden;
    border: 1.5px solid #d8d8d8;
    margin-bottom: 22px;
}
#pop_find_id .find_method_tab button {
    flex: 1;
    height: 42px;
    background: #f7f7f7;
    border: none;
    font-size: 13.5px;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    transition: background 0.18s, color 0.18s;
    letter-spacing: -0.2px;
}
#pop_find_id .find_method_tab button:first-child { border-right: 1.5px solid #d8d8d8; }
#pop_find_id .find_method_tab button.active { background: var(--main-color); color: #fff; }

/* 탭 패널 */
#pop_find_id .find_panel { display: none; }
#pop_find_id .find_panel.active { display: block; }

/* 폼 필드 */
#pop_find_id .find_fld,
#pop_find_pw .find_fld { display:flex; flex-direction:column; margin-bottom:14px; }
#pop_find_id .find_fld label,
#pop_find_pw .find_fld label { font-size:12px; font-weight:700; color:#555; margin-bottom:6px; letter-spacing:0; line-height:1; }
#pop_find_id .find_fld label .req,
#pop_find_pw .find_fld label .req { color:#e53935; margin-left:2px; }
#pop_find_id .find_fld input[type="text"],
#pop_find_pw .find_fld input[type="text"] {
    width:100%; height:44px; padding:0 14px;
    border:1.5px solid #d8d8d8; border-radius:8px;
    font-size:14px; color:#222; background:#f9f9f9;
    transition:border-color 0.18s, box-shadow 0.18s, background 0.18s;
    font-family:inherit;
}
#pop_find_id .find_fld input[type="text"]:focus,
#pop_find_pw .find_fld input[type="text"]:focus {
    border-color:var(--main-color);
    box-shadow:0 0 0 3px rgba(14,44,66,0.09);
    background:#fff; outline:none;
}
#pop_find_id .find_fld .fld_hint,
#pop_find_pw .find_fld .fld_hint { font-size:11.5px; color:#aaa; margin-top:4px; line-height:1.4; }
#pop_find_id .find_fld .fld_err,
#pop_find_pw .find_fld .fld_err  { font-size:11.5px; color:#e53935; margin-top:4px; display:none; }

/* 찾기 제출 버튼 */
#pop_find_id .btn_find_submit,
#pop_find_pw .btn_find_submit {
    width:100%; height:48px;
    background:var(--main-color); color:#fff;
    border:none; border-radius:9px;
    font-size:15px; font-weight:700; cursor:pointer;
    letter-spacing:-0.3px; transition:opacity 0.18s; margin-top:6px;
}
#pop_find_id .btn_find_submit:hover,
#pop_find_pw .btn_find_submit:hover { opacity:0.88; }
#pop_find_id .btn_find_submit:disabled,
#pop_find_pw .btn_find_submit:disabled { opacity:0.55; cursor:not-allowed; }

/* 아이디 찾기 결과 박스 */
#pop_find_id .find_result_box {
    display: flex;
    gap: 14px;
    padding: 18px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
    align-items: flex-start;
}
#pop_find_id .find_result_box.--ok  { background:#e8f5e9; border:1.5px solid #a5d6a7; }
#pop_find_id .find_result_box.--err { background:#ffebee; border:1.5px solid #ef9a9a; }
#pop_find_id .find_result_box .result_icon { font-size:22px; flex-shrink:0; margin-top:2px; }
#pop_find_id .find_result_box.--ok  .result_icon { color:#2e7d32; }
#pop_find_id .find_result_box.--err .result_icon { color:#c62828; }
#pop_find_id .find_result_box .result_title { font-size:14px; font-weight:700; margin-bottom:6px; color:#333; }
#pop_find_id .find_result_box.--err .result_title { color:#c62828; }
#pop_find_id .find_result_box .result_id { font-size:22px; font-weight:700; color:var(--main-color); letter-spacing:2px; margin-bottom:6px; }
#pop_find_id .find_result_box .result_info { font-size:12.5px; color:#888; line-height:1.5; }
#pop_find_id .find_result_box.--err .result_info { color:#c62828; }

/* 스텝 인디케이터 (비밀번호 찾기) */
#pop_find_pw .find_steps { display:flex; align-items:center; margin-bottom:22px; }
#pop_find_pw .find_step  { display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; color:#bbb; }
#pop_find_pw .find_step .step_num {
    width:24px; height:24px; border-radius:50%;
    background:#e0e0e0; color:#bbb;
    font-size:12px; font-weight:700;
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
#pop_find_pw .find_step.active { color:var(--main-color); }
#pop_find_pw .find_step.active .step_num { background:var(--main-color); color:#fff; }
#pop_find_pw .find_step.done   { color:#2e7d32; }
#pop_find_pw .find_step.done   .step_num { background:#43a047; color:#fff; }
#pop_find_pw .find_step_sep { flex:1; height:2px; background:#e0e0e0; margin:0 8px; transition:background 0.3s; }
#pop_find_pw .find_step_sep.done { background:#43a047; }

/* 메시지 박스 */
#pop_find_pw .find_msg {
    padding:12px 16px; border-radius:8px; font-size:13px;
    margin-bottom:18px; display:flex; align-items:flex-start;
    gap:9px; line-height:1.5;
}
#pop_find_pw .find_msg.err { background:#ffebee; color:#c62828; border:1px solid #ef9a9a; }
#pop_find_pw .find_msg.ok  { background:#e8f5e9; color:#2e7d32; border:1px solid #a5d6a7; }

/* 비밀번호 찾기 완료 카드 */
#pop_find_pw .done_card { text-align:center; padding:10px 0 4px; }
#pop_find_pw .done_card .done_icon  { font-size:48px; margin-bottom:12px; }
#pop_find_pw .done_card .done_title { font-size:18px; font-weight:700; color:#2e7d32; margin-bottom:8px; }
#pop_find_pw .done_card .done_desc  { font-size:13.5px; color:#555; line-height:1.7; margin-bottom:16px; }
#pop_find_pw .tmp_pw_box {
    background:#fff8e1; border:2px solid #ffe082;
    border-radius:10px; padding:16px 20px; margin:0 0 20px;
}
#pop_find_pw .tmp_pw_box .tmp_label { font-size:11.5px; color:#b38600; font-weight:700; margin-bottom:8px; letter-spacing:0.3px; }
#pop_find_pw .tmp_pw_box .tmp_value { font-size:24px; font-weight:700; color:#e65100; letter-spacing:3px; font-family:'Courier New',monospace; }
#pop_find_pw .tmp_pw_box .tmp_warn  { font-size:11.5px; color:#b38600; margin-top:10px; line-height:1.6; }

/* 하단 링크 */
#pop_find_id .find_footer_links,
#pop_find_pw .find_footer_links {
    display:flex; justify-content:center; gap:16px;
    margin-top:20px; padding-top:18px; border-top:1px solid #f0f0f0;
}
#pop_find_id .find_footer_links a,
#pop_find_pw .find_footer_links a { font-size:13px; color:#888; text-decoration:none; transition:color 0.15s; }
#pop_find_id .find_footer_links a:hover,
#pop_find_pw .find_footer_links a:hover { color:var(--main-color); }
#pop_find_id .find_footer_links .sep,
#pop_find_pw .find_footer_links .sep { color:#ddd; font-size:12px; }