:root {
    --main-theme: linear-gradient(135deg, #f8acff 0%, #696eff 100%);
    --main-theme-color:#b38eff;
    --main-theme-color2:#696eff;
}

#loading{
    position:fixed;left:0;top:0;width:100vw;height:100vh;background:#ffffffdd;z-index:9999999
}
.circle {
    width: 70px;
    height: 70px;
    position: fixed;
    left: 50%;
    top: 50%;
    border: 5px solid var(--main-theme-color2);
    border-top: 5px solid #eee;
    border-radius: 50%;
    overflow: hidden;
    animation-name: spinCircle;
    animation-duration: .8s;
    animation-iteration-count: infinite;
}

@keyframes spinCircle {
    from {
        transform:translate(-50%, -50%) rotate(0);
    }
    to {
        transform:translate(-50%, -50%) rotate(360deg);
    }
}

html,body {
	font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
	color:#333;
	font-weight: 500;
	font-size:14px;
	letter-spacing: -0.01em;
	line-height: 1.75em;
	-moz-font-feature-settings:'ss01','ss02','ss03','ss05','ss07','ss08','calt';
	-webkit-font-feature-settings:'ss01','ss02','ss03','ss05','ss07','ss08','calt';
	font-feature-settings:'ss01','ss02','ss03','ss05','ss07','ss08','calt';
}
table{
    border-spacing: 0;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    appearance: none;
    margin: 0;
}
*, ::after, ::before {
    box-sizing: border-box;
}
.ani{
	transition-property:all !important;
	transition-duration:.2s !important
}
ul,li{
    padding:0;
    margin:0;
}
a{
    text-decoration: none;
}
.center{
    text-align:center;
}
.left{
    text-align:left;
}
.login-wrap{
    width:500px;
    padding:60px;
    top:50%;
    left:50%;
    position: absolute;
    transform: translate(-50%,-50%);

}
.login-wrap h1{
    font-size:30px;
    font-weight:800;
    padding:5px 0;
    margin:0;
    text-align: center;
    background-image: var(--main-theme);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

}
.login-wrap > div{
    color:#8d96a1;
    font-size:14px;
    text-align: center;
    display: block;
    margin: 0px 0 34px;
    height: 20px;
    font-weight: 500;
}
.inp-set {

    border:1px solid #e5e5e5;
    height:48px;
    border-radius:8px;
    display: block;
    margin-bottom:20px;
}
.inp-set .on {
    border-color:var(--main-theme-color);
}
.inp-set{
    display: grid;
    grid-template-columns: 48px 1fr;
}
.inp-set input {
    width:100%;
    width: calc(100% - 10px);
    display: block;
    padding:0;
    border:0;
    margin:0;
    outline: none;
    background-color: transparent !important;
    margin-top: 16px;
    height: 31px;


    
}
input:-webkit-autofill { 
    box-shadow: 0 0 0 30px transparent inset ; 
    -webkit-text-fill-color: #333;
	font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-size:14px;
    font-weight:500;

}
input:-webkit-autofill, 
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active { 
    transition: background-color 5000s ease-in-out 0s; 
    font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    font-size:14px;
    font-weight:500;

}

.inp-set label{
    text-align:center;
    position: relative;
}
.inp-set label i{
    font-size:20px;
    color:#555;
    height:48px;
    line-height: 48px;
}
.inp-set label span{
    position: absolute;
    left: 49px;
    display: block;
    top: 12px;
    font-size: 14px;
    text-align: left;
    width: 200px;
    color: #8d96a1;
    pointer-events: none;
}
.on label span{
    top: 6px;
    font-size: 12px;
}

.fill-btn {
    height:48px;
    border-radius:8px;
    display: block;
    width:100%;
    border:0;
    background:var(--main-theme);
    color:#fff;
    font-weight: 700;
}
.line-btn {
    height: 48px;
    border-radius: 8px;
    display: block;
    width: 100%;
    border: 1px solid var(--main-theme-color);
    background: transparent;
    color: var(--main-theme-color);
    font-weight: 700;
}
.checkbox{
    margin:10px 0;
}
.checkbox input[type=checkbox]{
    display: none;
}
.checkbox input[type=checkbox]+label::before{
    content: "\eb81";
    font-family: 'remixicon' !important;
    color: #aaaaaa;
    font-size: 18px;
    vertical-align: -4px;
    margin-right: 3px;
}
.checkbox input[type=checkbox]:checked+label::before{
    content: "\eb80";
    font-family: 'remixicon' !important;
    color: var(--main-theme-color);
}

header{
    position: fixed;
    left:0;
    top:0;
    width:100%;
    display: grid;
    grid-template-columns: 250px 1fr 250px;
    height:60px;
    background: var(--main-theme-color);
    z-index: 1;
}

header > div:first-child a{
    height:60px;
    display: block;
    font-size:20px;
    font-weight:800;
    line-height:60px;
    color:#2a3344;
    padding-left:20px;
}
nav{
    position: fixed;
    left:0;
    top:60px;
    height:calc(100vh - 60px);
    background-color: #354052;
    width:250px;
	transition-property:all !important;
	transition-duration:.2s !important
}
.page{
    margin-left:250px;
    margin-top:60px;
    background-color:#f1f2fa;
    min-height:calc(100vh - 60px);
	transition-property:all !important;
	transition-duration:.2s !important;
    overflow: hidden;
}
.page-header{
    padding:20px;
}
.page-header h2{
    font-size:22px;
    font-weight:800;
    padding:0;
    margin:0;
    line-height: 1em;
}
section{
    background-color: #fff;
    margin:20px;
    margin-top:0;
    border-radius: 8px;
    padding:15px;
    height:auto;
}

.page-tab{
    padding:0;
    margin:0 20px 7px;
    list-style: none;
    position: relative;
}
.page-tab::after{
    content:"";
	display:block;
	clear:both;
}
.page-tab li{
    float:left;
    
}
.page-tab li a{
    color:#93949a;
    padding:12px 16px;
    margin:0 0 10px 0;

    display: block;
    line-height: 1em;
    position: relative;
}

.page-tab .on a{
    color:var(--main-theme-color2);
}
.page-tab .on a::after{
    left:0;
    bottom:-3px;
    width:100%;
    height:3px;
    content:"";
    position: absolute;
    background-color: var(--main-theme-color2);
}


nav h5{
    font-size:13px;
    color:rgb(255 255 255 / 30%);
    padding:0;
    margin:0;
}
nav ul{
    padding:0;
    margin:0;
}
nav ul a{
    font-size:14px;
    color:#fff;
}
nav li{
    list-style: none;
}
nav > ul > li {
    
    border-top:1px solid rgb(255 255 255 / 5%);
    border-bottom:1px solid rgb(0 0 0 / 15%);
}
nav > ul > li:first-child{
    border-top:0;
}
nav > ul > li:last-child{
    border-bottom:0;
}
nav li a,
nav li h5{
    display: block;
    padding:5px 30px;
}


nav > ul > li > ul > li,
nav li h5{
    border-left:4px solid transparent;
    z-index: 1;
}
nav li h5{
    padding-top:15px;
}

nav > ul > li > ul > li > a{
    position: relative;
    padding-left:38px;
}
nav > ul > li > ul > li > a::before{
    content:"";
    width:2px;
    height:2px;
    position: absolute;
    left:30px;
    top:calc(50% - 1px);
    background-color: var(--main-theme-color);
    display: block;
}

nav .on a{
    background-color:rgb(1 2 10 / 20%);
}
nav .on{

    border-color:var(--main-theme-color);
}

.profile{
    width:100%;
    background:#2a3344;
    padding:15px;
    line-height: 100%;
    position: relative;
}
.member-info {

    display:grid;
    grid-template-columns: 64px 1fr;

}
.member-info > div:nth-child(2){
    padding-top:10px;
}
.profile > span{
    line-height: 100%;
    display: inline-block;
}
.profile .img{
    width:50px;
    height:50px;
    border-radius: 31.4%;
    background:#8da4d6;
    color:#fff;
    font-weight:600;
    line-height:50px;
    text-align: center;
    font-size:20px;
}

.profile .position{
    color:#727a86;
    font-size:12px;
}
.profile .name{
    color:#fff;
}
.profile .email{
    display: block;
    color:#a7aeb8;
    font-size:12px;
    margin-top:5px;
}
.profile .buttons {
    position:absolute;
    right:10px;
    top: 10px;
}
.profile .buttons i {
    color:#fff;
    font-size:16px;
    font-weight: 400;
    color:#7a8aa3;
}
.top-mid a{
    display:block;
    height:60px;
    width:60px;
    line-height:60px;
    text-align: center;
    background: rgb(0 0 0 / 5%);
}
.top-mid a i {
    color:#fff;
    font-weight: 400;
    font-size:18px;
}

.top-right a{
    display:block;
    float:right;
    height:60px;
    width:60px;
    line-height:60px;
    text-align: center;
    margin-left:1px;
    background: rgb(0 0 0 / 5%);
}
.top-right a i {
    color:#fff;
    font-weight: 400;
    font-size:18px;
}

nav.hide{
    left:-250px;
}
nav.hide+.page{
    margin-left:0;
}

.input-table{
    width:100%;
}
.input-table input,
.input-table select,
.input-table textarea {
    border:0;
    padding:0;
    background:transparent;
    margin:0;
    outline: none;
    display: block;
    padding:12px;
}
.input-table textarea{
    width:100%;
    max-width:400px;
    resize: none;
    background:#f5f5f5;
    border-radius:5px;
    line-height:1.5em
}
.input-table th,
.input-table td{
    border-bottom:1px solid #e1e2ea;
}
.input-table th{
    width:120px;
    text-align:left;
    line-height:1.3em;
    vertical-align: top;
    padding-top:2em
}
.input-table th span{
    font-weight:400;
    font-size:13px;
}
.input-table td{
    padding:15px 0;
}
.input-table td > div{
    border-radius:5px;
    display: inline-block;
    background-color: #f5f5f5;
}
.list-input-table td > div{
    background-color: #f5f5f5;
}
.radio-item{
    height:40px;
    line-height: 40px;
    margin-right:10px;
    padding-right:10px;
    background-color: transparent !important;
}

.radio-item input[type=radio],
.radio-item input[type=checkbox]{
    display: none;
}
.radio-item input[type=radio]+label,
.radio-item input[type=checkbox]+label{
    color:#aaa;
}
.radio-item input[type=radio]+label::before,
.radio-item input[type=checkbox]+label::before{
    content: "\eb81";
    font-family: 'remixicon' !important;
    color: #aaaaaa;
    font-size: 18px;
    vertical-align: -4px;
    margin-right: 3px;
}
.radio-item input[type=radio]:checked+label,
.radio-item input[type=checkbox]:checked+label{
    color:#333;
    font-weight:700;
}
.radio-item input[type=radio]:checked+label::before,
.radio-item input[type=checkbox]:checked+label::before{
    content: "\eb80";
    font-weight:400;
    font-family: 'remixicon' !important;
    color: var(--main-theme-color);
}

.list-table{
    width:100%;
}
.list-table th,
.list-table td {
    text-align:center;
}
.list-table th{
    border-bottom:1px solid #e1e2ea;
    height:50px;

}
.list-table td{
    height:50px;
}

.list-table tbody tr:nth-child(2n){
    background:#f4f5fe;
}

.modal-bg{
    background:rgb(0 0 0 / 75%);
    position: fixed;
    left:0;
    top:0;
    width:100vw;
    height:100vh;
    display: none;
    z-index: 2;
}
.modal{
    background:#fff;
    position: fixed;
    left:50%;
    top:50%;
    width:calc(100% - 60px);
    max-width:550px;
    border-radius: 8px;
    transform: translate(-50%, -50%);
    display: none;
    z-index: 2;
}
.modal-header{
    font-weight:800;
    padding:15px;
    height:50px;
    font-size:16px;
    border-bottom:1px solid #e1e2ea;
    position: relative;
}
.modal-header i{
    width:50px;
    height:50px;
    line-height: 50px;
    display: block;
    text-align: center;
    position: absolute;
    right:0;
    top:0;
    font-size:18px;
    color:#858691;
}
.modal-body{
    margin:5px;
    padding:15px;
    max-height:calc(100vh - 260px);
    overflow: auto;
}
.list-box,
.select-area{
    padding:15px;
    border:1px solid #e1e2ea;
    border-radius: 4px;
    margin-bottom:8px;
    position: relative;
}

.select-area{
    margin-bottom:0;
    border:0;
    min-width: 209px;
    line-height: 1em;
}
.select-area .no-selected{
    line-height: 1em;
}
.member-list-select h4{
    margin:0;
    font-size:15px;
    margin:5px 0;
    padding:5px 0;
}

.member-list-select .lawyer-label,
.select-area .lawyer-label {
    width: 47px;
    display: inline-block;
    color: #fff;
    text-align: center;
    font-size: 11px;
    line-height: 17px;
    height: 17px;
    vertical-align: 1px;
    border-radius: 3px;
}
.member-list-select .lawyer-descript,
.select-area .lawyer-descript{
    display: block;
    font-size:13px;
    color:#999;
    line-height: 1em;
    margin-top:0.314em;
}
.per-bg{
    position:absolute;
    height:100%;
    left:0;
    top:0;
    z-index: -1;
    opacity: .2;
}
.frm-btn {
    text-align: right;
}
.frm-btn .fill-btn{
    width:150px;
    display: inline-block;
    margin:30px 0 15px 0;
}
.time-calc{
    -moz-font-feature-settings:'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
	-webkit-font-feature-settings:'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
	font-feature-settings:'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
}
.list-input{
    background: #f5f5f5;
    border-radius: 5px;
    display: inline-block;
    border: 0;
    padding: 0;
    margin: 15px 0;
    outline: none;
    display: block;
    padding: 12px;
}
.tr-line tbody tr:nth-child(2n){
    background:transparent;
}
.tr-line tbody tr td{

    border-bottom:1px solid #e1e2ea;
}
.imagecard-box{
    display: inline-block;
    width:300px;
    border:1px solid var(--main-theme-color);
    border-radius:8px;
    margin-right:10px;
    margin-bottom:6px;
    overflow: hidden;
}
.img-bg {
    height:164px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url(/assets/img/noimage.jpg);
    background-color: #fff;
}
.imgcard-text{
    background-color: var(--main-theme-color2);
    color:#fff;
    line-height: 1em;
    padding:1em;
}
.imgcard-content input[type=file]{
    background: #f5f5f5;
    border-radius: 5px;
    border: 0;
    padding: 0;
    margin: 8px 10px 0;
    width:calc(100% - 20px);
    outline: none;
    display: block;
    padding: 12px;
}

.imgcard-content .checkbox {
    text-align:right;
    margin:5px 15px;
}

.list-icon{
    border:0;
    background:var(--main-theme-color);
    height:28px;
    width:28px;
    border-radius: 4px;
    font-weight: 800;
    font-size:12px;
    line-height: 26px;
    color:#fff;
    padding:0;
}
.list-icon i{
    color:#fff;
    line-height: 1em;
    vertical-align: -3px;
    font-weight: normal;
    font-size:15px;
}
.cursor-text {
    
    height:28px;
    border-radius: 4px;
    line-height: 1em;
    font-size:12px;
    font-weight: 800;
    color:#fff;
    display: inline-block;
    width:80px;
    padding-top:8px;
}

.quick-search{
    position:absolute;
    right:0;
    bottom:0;
}
.quick-search div{
    display: inline-block;
    background-color: #fff;
    border-radius: 5px;
    padding: 4px;
}
.quick-search div input{
    border:0;
    outline: none;
}
.quick-search div button{
    background-color: transparent;
    border:0;
}
.quick-search div button i{
    vertical-align: -2px;
}
.quick-search a{
    margin:0 10px;
}

.input-table input[name^=duplicate]{
    width:97px;
}
.paging{
    font-size:0;
}
.paging{
    
    display: inline-block;
    margin-bottom:20px;
}
.paging li{
    list-style: none;
    display: inline-block;
}
.paging div{
    
    display: inline-block;
}
.paging a,
.paging i{
    font-size:14px;
}
.paging i{
    vertical-align: -2px;;
}
.paging a{
    min-width:28px;
    display: inline-block;
    padding:2px 5px;
    margin:0 2px;
    -moz-font-feature-settings: 'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
    -webkit-font-feature-settings: 'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
    font-feature-settings: 'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
    border:1px solid var(--main-theme-color2);
    color: var(--main-theme-color2);
    border-radius:2px;
    background-color: #fff;
    
}
.paging .on a{
    background:var(--main-theme-color2);
    color:#fff;
}
.paging .page-disable a {
    opacity: .33;
    cursor: not-allowed;
}

.calendar-table{
    width:100%;
}
.calendar-table td{
    text-align:center;
}
.calendar-table td a{
    color:#555;
    display: inline-block;
    font-weight:600;
    display:block;
    max-width:100px;
    margin:0 auto;
    border-radius: 5px;
}
.calendar-table th{
    text-align:center;
    color:#ccc;
    border-top:1px solid #eee;
    padding:5px 0;

}
.calendar-table th a{
    color:#333;
    padding:5px 0;

}

.calendar-table td .another-month{
    opacity: .333;
}

.calendar-table .today a{
    background:#eee;
}
.calendar-table span{
    padding:5px 0;
    display:block;
    max-width:100px;
    margin:0 auto;

}
.calendar-table .marker{
    position: relative;
    display:block;
    max-width:100px;
    margin:0 auto;
    border:1px solid var(--main-theme-color);
    border-radius: 5px;
}

.set-ym {
    display: inline-block;
    font-size:0;
    padding:0;
}
.set-ym li,
.set-ym .page-box{
    display: inline-block;

}
.set-ym a{
    font-size:15px;
    display: inline-block;
}
.set-ym a i{
    vertical-align: -2px;
}
.set-ym li {
    list-style:none;
}

.table-view{
    width:100%;
    text-align: center;
    border-spacing: 0;
    border-collapse: collapse;
}
.table-view th,
.table-view td{
    border:1px solid #ddd;    
    padding:10px 0;
}
.write-box-control{
    display: none;
}


section > .on {
	display:block !important;
}

.btn-list-box button{
    width:40px;
    height:40px;
    border:0;
    border-radius:5px;
}
.btn-list-box button i{
    vertical-align: -2px;
}
.btn-list-box .disable{
    opacity: .333;

}

.tel-action {
    width:100%;
    background-color: var(--main-theme-color2);
    color:#fff;
    font-weight:800;
    padding:1em;
    border:0;
    border-radius: 5px;
    font-size:20px;
}

.tel-action i{
    font-weight: normal;
    vertical-align: -3px;
    background-color: #fff;
    color:var(--main-theme-color2);
    border-radius: 50%;
    padding:0.4em;
    margin-right:5px;
}

.input-table.write textarea{
    max-width: 100%
}
.input-table.write td > .txt-area{
    width:100%;
}

.duplicate-check{
    width:100%;
    background:#fff !important;

}
.input-table td > .duplicate-check{
    
    display: none;
}

.duplicate-check .cursor-text{
    text-align:center;
    margin-right:10px;
}
.inner-dup{
    padding:4px 10px;
    margin-top:10px;
    background-color: #f7f3ff;
    overflow: auto;
    max-height: 188px;
}
.inner-dup .line {
    margin: 5px 0;
}
.duplicate-check .datetime{
    -moz-font-feature-settings: 'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
    -webkit-font-feature-settings: 'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
    font-feature-settings: 'ss01','ss02','ss03','ss05','ss07','ss08','calt','tnum';
    margin-right:10px;
}
.inner-dup i{
    vertical-align: -2px;
    color: var(--main-theme-color2);
}
.memo-sw {
    background: #fff;
    margin-bottom: 12px;
    margin-top: 5px;
    padding: 5px 10px;
    border-radius: 5px;
    display: none;
}

.dup-inp{
    position: relative;
}
span.dup-cnt {
    position: absolute;
    right: -10px;
    top: 50%;
    background: indianred;
    color: #fff;
    line-height: 100%;
    padding: 5px;
    transform: translate(100%, -50%);
    border-radius: 12px;
    display: block;
    min-width: 24px;
    text-align: center;
    display: none;
}
.direct-sel-inp{
    display: none;
}

.result-memo-area{
    width:100%;
    border-radius: 5px;
    height:50vh;
    border:0;
    background-color: #f5f5f5;
    line-height: 150%;
    padding:10px;
    outline: none;
}

.inner-pure-txt{
    padding:7.8px;
    display:block;
    min-width:210px;
}
.input-table select{
    min-width:210px;

}
.url-mark{
    color:var(--main-theme-color2);
}

.list-input-table{
    border-bottom: 1px solid #e1e2ea;
}
.list-input-table input,
.list-input-table select{
    width:120px;
    border:0;
    outline: none;
    background-color: rgb(0 0 0 / 4%);
    padding:8px;
    border-radius: 5px;
}

.url-marker{
    background:#eee;
    color:var(--main-theme-color2);
    font-size:11px;
    padding:2px 4px;
    border-radius:3px;
    margin-right:4px;
}

.show-v{
    width:70px;
    display: inline-block;
    text-align: left;
}

.ajax-act-btn{
    color: #eee;
    background: var(--main-theme-color2);
    font-size: 11px;
    padding: 2px 4px;
    border-radius: 3px;
    margin-right: 4px;
    border: 0;
    outline: none;
    line-height: 1em;
    vertical-align: 1px;

}

.file-tr td > div{
    max-width:300px;
}
.file-tr td > div img{
    width:calc(100% - 10px);
    margin:5px;
    border-radius: 5px;
    display: block;
}
.file-tr td > hr{
    border:0;
    background:transparent;
}

.child-dis-none *{
    visibility: hidden;
}