body{background-color:#f8f8f8;color:#000;font-size:0.875rem;font-family:'malgunGothic', 'dotum','Apple Gothic', 'helvetica', 'Pretendard', sans-serif;}

#guide{background-color:#fff;padding:0 30px 15px 30px;}

#loginWrap{width:100%;height:100%;min-width:1440px;min-height:100%;}

#loginBox{width:1440px;height:100%;min-height:954px;padding:280px 0 0 840px;    background:url(../images/vi_login2.svg) 0 0 no-repeat;}

#login-in{width:480px;}
#login-inDo{width:480px;}
#login-in .loginBtn{display:inline-block;width:100%;height:60px;margin-top:30px;border-radius:5px;background-color:#667FFF;line-height:60px;color:#fff;font-size:1.125rem;text-align:center;}
#login-in .loginBtn:disabled{background-color:#C2CFFF;}
#login-inDo .loginDoBtn{display:inline-block;width:100%;height:60px;margin-top:30px;border-radius:5px;background-color:#667FFF;line-height:60px;color:#fff;font-size:1.125rem;text-align:center;}
#login-inDo .loginDoBtn:disabled{background-color:#C2CFFF;}
#login-in .downBtn{display:inline-block;width:100%;height:60px;margin-top:30px;border-radius:5px;background-color:#BB6BD9;line-height:60px;color:#fff;font-size:1.5rem;text-align:center;}
#login-in .authBtn{display:inline-block;width:100%;height:62px;margin-top:30px;border-radius:5px;padding:16px 8px 16px 8px;background-color:#228800;line-height:30px;color:#fff;font-weight:600;font-size:1.125rem;text-align:center;}
#login-in h2{font-size:2rem;text-align:center;}
#login-inDo h2{font-size:2rem;text-align:center;}

#loginOp{display:flex;}
#loginOp .user-find{margin-left:auto;}
#loginOp .user-find a{margin-left:5px;color:#2B2A2C;text-decoration:underline;}

#cloverBox{width:1080px;height:1920px;padding:0px 110px 0px 110px;background:url(../images/vi_clover.png) 0 0 no-repeat;}
#cloverBox .cloverResult{width:860px;height:784px;border-radius:15px;background-color:#FFFFFF;padding:80px 32px 32px 32px;}
#cloverBox h3{margin-top:300px;font-size:2.67rem;text-align:center;}
#cloverBox .cloverLogo{width:372px;height:135px;position:absolute;left:50%;top:30%;transform:translate(-50%,-30%);padding:10px;gap:10px;background:url(../images/vi_clover_logo.png) 0 0 no-repeat;}

#wrapper{width:100%;height:100%;min-width:1440px;min-height:100%;}
#header{display:flex;height:70px;border:1px solid var(--stroke);background-color:#fff;}
#userInfo{display:flex;align-items:center;min-height:40px;margin-left:auto;}
#userInfo #user-i{text-align:right;}
#userInfo #user-i #user-pos{margin-left:10px;padding-left:10px;border-left:1px solid #D5D4D5;}
#userInfo #user-i #user-eml{margin-top:3px;color:#808695;}
#userInfo #user-c{margin-left:24px;padding:0 16px 0 24px;border-left:1px solid #D5D4D5;}

#ci{padding:7px;display:table;}
#ci a{display:flex;justify-content: center;width:206px;height:56px;overflow:hidden;text-indent:-9999px;}
#ci a img{max-width:100%;max-height:100%;width:auto;height:auto;}
#ci a img.large-image{object-fit:cover;object-position:center;width:100%;height:100%;}
/*#ci a{display:block;width:150px;height:40px;background:url(../images/ti_ci.svg) no-repeat;text-indent:-9999px;}*/
#container{display:flex;min-height:calc(100vh - 70px);}

#contents{width:100%;padding:24px 24px 24px 24px;}

#lnb{
    min-width: 222px;
    min-height: calc(100vh - 80px);
    border-right: 1px solid #D5D4D5;
    background-color: #fff;
    max-height: calc(100vh - 80px);
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
}
#lnb > ul{width:222px;}
#lnb ul > li{position:relative;}
#lnb ul > li > a{display:block;height:var(--lnb-h);padding:16px 0 0 24px;color:#555556;font-size:0.875rem;font-weight:bold;}
#lnb ul > li:hover > a{color:#4A6BEE;}
#lnb ul > li.on:before, #lnb ul > li:hover:before{content:'';position:absolute;top:0;left:0;width:5px;height:49px;background-color:var(--blue5);}
#lnb ul > li.on:after, #lnb ul > li:hover:after{content:'';position:absolute;top:0;left:6px;width:calc(221px - 5px);height:var(--lnb-h);border-top:1px solid #D5D4D5;border-bottom:1px solid #D5D4D5;}
#lnb ul > li > a:after{position:absolute;top:25px;right:30px;width:6px;height:6px;content:"";border-width:1px 0 0 1px;border-style:solid;transform:rotate(225deg) translateY(-50%);transition:all .3s ease-out;}
#lnb ul > li.on > a:after{transform:rotate(45deg);}

#lnb ul > li > .subMenu{display:none;background-color:#F6F6F6;}
#lnb ul > li > .subMenu li a{display:block;height:50px;padding:0 0 0 40px;line-height:21px;align-content:center;}
#lnb ul > li > .subMenu li a:hover{color:#4A6BEE;}
#lnb ul > li > .subMenu li.on {background-color:#cbbff0;}

.verInfoBox{position:relative;width:50%;margin-top:24px;}
.verInfoBox .ver{flex:1;}
.verInfoBox .ver dt{margin-bottom:24px;font-weight:500;}
.verInfoBox .ver dd{padding:0 0 0 16px}
.verInfoBox .updateBtn{display:inline-block;position:absolute;top:47px;right:0;height:42px;line-height:42px;padding:0 16px;box-shadow:0 0 0 1px var(--blue1) inset;font-size:1.17rem;color:var(--blue1);}

.dsAnalysisChart2{position:relative;overflow:hidden;width:100%;min-width:700px;height:100%;margin:0 auto;}
.dsAnalysisChart{position:relative;overflow:hidden;width:100%;min-width:700px;height:300px;margin:0 auto;}
.deviceChart{position:relative;overflow:hidden;width:100%;min-width:350px;height:300px;margin:0 auto;}
.payChart{position:relative;overflow:hidden;width:100%;min-width:350px;height:300px;margin:0 auto;}
.dsStatsChart{position:relative;overflow:hidden;width:100%;height:300px;margin:0 auto;}

.nowLicenceCnt{display:flex;height:56px;margin:24px 0;padding:8px 8px 0 64px;border:1px solid var(--stroke);border-radius:5px;align-items:center;background: url(../images/ic_licence_etc.svg) 8px 50% no-repeat;color:#6B6A6B;}
.nowLicenceCnt .nowCnt{margin:0 24px;font-size:1.33rem;color:#2B2A2C;}
.nowLicenceCnt .yDayRage{margin-left:5px;color:#10B981;}