.page-title{
  width:1280px;
  margin:auto;
  font-weight:500;
  font-size:24px;
  color:#333;
  padding-top:20px;
  margin-bottom:10px;
}
main{
  padding-left:70px;
  /*margin-top:84px;*/
  margin-top:65px;
}
main>.container{
  width:1280px;
  max-width:1280px;
  margin:auto;
  min-height:calc(100vh - 380px);
}
main>.container:not(.container-divided){
  /*max-height:870px;*/
  /*overflow-y:scroll;*/
  padding:40px;
}
main>.pre-container{
  width:1280px;
  max-width:1280px;
  margin:auto;
  margin-bottom:10px;
}
main>.pre-container + .container{
  min-height: calc(100vh - 504px);
}
main>.container:not(.container-divided){
  background-color:#fff;
}
main>.container.container-divided{
  /*display:flex;*/
  padding:0;
}
main>.container.container-divided>.container-left{
  width:318px;
  display:inline-block;
  max-height:870px;
  overflow-y:scroll;
  background-color:#fff;
  margin-right:16px;
  padding:40px;
}
main>.container.container-divided>.container-left.grid-2-12{
  flex: 0 0 calc(((100% / 12) * 2) - 16px);
  max-width: calc(((100% / 12) * 2) - 16px);
}
main>.container.container-divided>.container-left.grid-1-12{
  flex: 0 0 calc((100% / 12) - 16px);
  max-width: calc((100% / 12) - 16px);
  padding:20px;
}
main>.container.container-divided>.container-right{
  width:942px;
  max-height:870px;
  overflow-y:scroll;
  display:inline-block;
  background-color:#fff;
  padding:30px 40px;
}
main .container.login-container{
  overflow:visible;
}
main .container.login-container>.grid-row{
  width:403px;
  margin:auto;
}
.vertical-wrapper{
  display:table;
}
.vertical-wrapper>.vertical-middle{
  /*display:table-cell;*/
  vertical-align:middle;
}
.vertical-wrapper>.vertical-top{
  /*display:table-cell;*/
  vertical-align:top;
}
.vertical-middle{
  vertical-align:middle;
}
/* display */
.display-b{
  display:block!important;
}
.display-ib{
  display:inline-block!important;
}
.display-f{
  display:flex;
}
.display-if{
  display:inline-flex!important;
}
.display-tr{
  display:table-row;
}
.display-tc{
  display:table-cell;
}
.blind{
  display:none!important;
}
@media only screen and (max-width:990px){
  .display-b-on-s{
    display:block!important;
  }
  .display-ib-on-s{
    display:inline-block!important;
  }
  .display-i-on-s{
    display:inline!important;
  }
  .display-f-on-s{
    display:flex!important;
  }
  .display-tr-on-s{
    display:table-row!important;
  }
  .display-tc-on-s{
    display:table-cell!important;
  }
  .blind-on-s{
    display:none!important;
  }
}

.cursor-pointer{
  cursor:pointer;
}
.cursor-default{
  cursor:default!important;
}
.vertical-divider{
  width:1px;
  border-left:1px solid var(--silver);
}
.align-center{
  margin:auto;
  text-align:center;
}
.width-full{
  width:100%!important;
}
/** shadow **/
.shadow-sm{
  box-shadow:0px 2px 4px rgba(0,0,0,0.1);
}
.shadow-rg{
  box-shadow:0 2px 4px rgba(0,0,0,0.08);
}
.shadow-md{
  box-shadow:0 4px 8px rgba(0,0,0, 0.12);
}
.shadow-lg{
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
}

/** space **/
.space-xxs{
  height:4px;
  width:4px;
}
.space-xs{
  height:8px;
  width:8px;
}
.space-s{
  height:10px;
  width:10px;
}
.space-sm{
  height:16px;
  width:16px;
}
.space-md{
  height:20px;
  width:20px;
}
.space-lg{
  height:40px;
  width:40px;
}
.space-xl{
  height:60px;
  width:60px;
}
.space-xxl{
  height:80px;
  width:80px;
}
span.space-xxs, span.space-xs, span.space-s, span.space-sm, span.space-md, span.space-lg, span.space-xl, span.space-xxl{
  display:inline-block;
}
@media only screen and (max-width:990px){
  .space-xxs-on-s{
    height:4px;
    width:4px;
  }
  .space-xs-on-s{
    height:8px;
    width:8px;
  }
  .space-s-on-s{
    height:10px;
    width:10px;
  }
  .space-sm-on-s{
    height:16px;
    width:16px;
  }
  .space-md-on-s{
    height:20px;
    width:20px;
  }
  .space-lg-on-s{
    height:40px;
    width:40px;
  }
  .space-xl-on-s{
    height:60px;
    width:60px;
  }
  .space-xxl-on-s{
    height:80px;
    width:80px;
  }
  span.space-xxs-on-s, span.space-xs-on-s, span.space-s-on-s, span.space-sm-on-s, span.space-md-on-s, span.space-lg-on-s, span.space-xl-on-s, span.space-xxl-on-s{
    display:inline-block;
  }
}

/** select **/
select:not(.free-width) + .select2-container{
  width:208px;
}
select.blind + .select2-container{
  display:none;
}
.select2-container--default .select2-selection--single{
  background-color:#FFF;
  border:1px solid var(--silver);
  color:var(--dark);
}
.select-st1 + .select2-container--default .select2-selection--single{
  /*animation:inactiveSelect1 .1s;*/
  border-radius:4px;
}
.select-st2 + .select2-container--default .select2-selection--single{
  /*animation:inactiveSelect2 .1s;*/
  border-radius:20px;
}
.select-st2 + .select2-container--default.select2-container--open .select2-selection--single{
  border-radius:4px 4px 0 0;
}
.select2-container--default .select2-selection--single{
  height:28px;
  line-height:19px;
  /*width:208px;*/
  width:100%;
  font-weight:400;
  font-size:13px;
  padding:3.5px 13px;
}
.select2-container--default .select2-selection--multiple{
  min-height:28px;
  line-height:19px;
  /*width:208px;*/
  width:100%;
  font-weight:400;
  font-size:13px;
}
.select-r + .select2-container--default .select2-selection--single{
  height:32px;
  line-height:20px;
  /*width:208px;*/
  width:100%;
  font-weight:400;
  font-size:14px;
  padding:5px 13px;
}
.select-r + .select2-container--default .select2-selection--multiple{
  min-height:32px;
  line-height:20px;
  width:100%;
  font-weight:400;
  font-size:14px;
}
.select-m + .select2-container--default .select2-selection--single{
  height:36px;
  line-height:20px;
  /*width:208px;*/
  width:100%;
  font-weight:400;
  font-size:14px;
  padding:7px 13px;
}
.select-m + .select2-container--default .select2-selection--multiple{
  min-height:36px;
  line-height:20px;
  width:100%;
  font-weight:400;
  font-size:14px;
}
.select-l + .select2-container--default .select2-selection--single{
  min-height:40px;
  line-height:20px;
  /*width:208px;*/
  width:100%;
  font-weight:400;
  font-size:14px;
  padding:9px 13px;
}
.select-l + .select2-container--default .select2-selection--multiple{
  height:40px;
  line-height:20px;
  width:100%;
  font-weight:400;
  font-size:14px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  color:inherit;
  line-height:inherit;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder{
  color:inherit;
}
.select2-container .select2-selection--single .select2-selection__rendered{
  padding:0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b{
  display:none;
}
.select2-container--default .select2-selection--single .select2-selection__arrow, .select2-container--default .select2-selection--multiple .select2-selection__arrow{
  display: inline;
  position: absolute;
  background: url(/images/icons/noun_down_614232@2x.png);
  background-repeat: no-repeat;
  float: right;
  right: 13px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow, 
.select2-container--default .select2-selection--multiple .select2-selection__arrow{
  width: 10px;
  height: 10px;
  top: calc(50% - 5px);
  background-size: 10px;
}
.select-r + .select2-container--default .select2-selection--single .select2-selection__arrow,
.select-r + .select2-container--default .select2-selection--multiple .select2-selection__arrow{
  width: 10px;
  height: 10px;
  /*top: calc(50% - 2px);*/
  top:12px;
  background-size: 10px;
}
.select-m + .select2-container--default .select2-selection--single .select2-selection__arrow,
.select-l + .select2-container--default .select2-selection--single .select2-selection__arrow,
.select-m + .select2-container--default .select2-selection--multiple .select2-selection__arrow,
.select-l + .select2-container--default .select2-selection--multiple .select2-selection__arrow{
  width: 12px;
  height: 12px;
  top: calc(50% - 6px);
  background-size: 12px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected]{
  background-color:inherit;
  color:inherit;
}
.select2-dropdown{
  border-radius:0 0 0 4px;
  border:1px solid var(--primary);
  font-weight:300;
  color:#666;
}
.select2-container--default.select2-container--open .select2-selection.select2-selection--single,
.select2-container--default.select2-container--open .select2-selection.select2-selection--multiple{
  border-color:var(--primary);
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow,
.select2-container--default.select2-container--open .select2-selection--multiple .select2-selection__arrow{
  transform:rotate(180deg);
}
.select2-container--default .select2-results__option[aria-selected=true]{
  /*background-color:var(--gray-smoke);*/
  color:var(--primary);
}
.select2-container--default .select2-results__option:hover{
  background-color:var(--ghost-white);
  color:inherit;
}
.select2-container--default .select2-results__option[aria-disabled=true]{
  background-color:var(--gray-smoke);
  color:#333;
}
.select2-container--default .select2-results>.select2-results__options{
  max-height:160px;
  overflow-y:scroll;
}
.select2-search--dropdown{
  height:43px;
  padding:7px 7px 7px 7px;
}
.select-r + .select2-container--default .select2-search--dropdown, .select-m + .select2-container--default .select2-search--dropdown, .select-l + .select2-container--default .select2-search--dropdown{
  height:40px;
}
.select2-container--default .select2-search--dropdown .select2-search__field{
  background-color:#FFF;
  border:1px solid var(--silver);
  font-weight:300;
  font-size:14px;
  color:var(--dark-gray);
  height:28px;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus{
  border-color:var(--primary);
}
.select2-results__option{
  font-weight:300;
  padding:7px 13px;
}
.select2-results__option{
  font-weight:300;
  padding:7px 13px;
}
.select2-container--default .select2-results__option:last-child{
  border-radius:0 0 4px 4px;
}
.select2-container--default.select2-container--disabled .select2-selection--single{
  background-color:var(--gray-smoke);
  border:1px solid var(--silver);
  color:var(--dark-gray);
}
.select2-container--open .select2-dropdown--above{
  border-radius: 4px 0 0 0;
}
.select2-container--default.select2-container--focus .select2-selection--multiple{
  border:1px solid var(--silver);
}
.select2-container--default .select2-results__option:hover, .select2-container--default .select2-results__option[aria-selected=true]{
  /*background-color:transparent;*/
  background-color:var(--ghost-white);
}
.select2-search.select2-search--inline .select2-search__field{
  padding:0 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered{
  width:calc(100% - 20px);
}
.select2-search.select2-search--inline{
  width:100%;
}
/** alert **/
.alert-list{
  padding-top:10px;
  margin-bottom:24px;
}
.alert-list:not(.design){
  position:fixed;
  right:16px;
  top:64px;
}
.alert-list>.alert-item{
  position:relative;
  width:360px;
  height:40px;
  border-radius:20px 0px 20px 20px;
  margin-bottom:4px;
  padding:8px 30px 8px 50px;
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
  font-weight:300;
  font-size:14px;
  color:#fff;
}
.alert-list>.alert-item:before{
  position:absolute;
  display:block;
  content:' ';
  border-radius:50%;
  width:24px;
  height:24px;
  left:10px;
  top:8px;
  background-image:url(/images/icons/check-mark-black-outline-green@2x.png);
  background-position:50%;
  background-repeat:no-repeat;
  background-color:#FFF;
  background-size:12px;
}
.alert-list>.alert-item.error:before{
  background-image:url(/images/icons/noun_exclamation_3021504@2x.png);
}
.alert-list>.alert-item.warning:before{
  background-image:url(/images/icons/noun_exclamation_3021504_warn@2x.png);
}
.alert-list>.alert-item>.close-alert{
  position:absolute;
  display:block;
  border-radius:50%;
  width:10px;
  height:10px;
  right:10px;
  top:10px;
  color:#FFF;
  font-size:10px;
  /*background-image:url(/images/icons/check-mark-black-outline@2x.png);*/
  /*background-position:50%;*/
  /*background-repeat:no-repeat;*/
  /*background-color:#FFF;*/
  /*background-size:12px;*/
}
.alert-list>.alert-item.error{
  background-color:var(--danger);
}
.alert-list>.alert-item.approval{
  background-color:var(--success);
}
.alert-list>.alert-item.warning{
  background-color:var(--warning);
}
.alert-list>.alert-item>.close-alert>img{
  width:10px;
  height:10px;
  vertical-align: middle;
}
.confirm-overlay{
  position:fixed;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background-color:rgba(0, 0, 0, .3);
  z-index:999;
}
.confirm{
  position:relative;
  width:320px;
  min-height:161px;
  border-radius:8px;
  padding:30px 20px;
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
  background-color:#FFF;
}
.confirm.confirm-st2{
  width:320px;
  min-height:189px;
  border-radius:8px;
  padding:30px 20px;
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
}
.confirm.confirm-st3{
  width:320px;
  min-height:152px;
  border-radius:8px;
  padding:30px 20px;
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
}
.confirm>.confirm-title{
  font-weight:400;
  font-size:20px;
  color:#333;
  margin-bottom:40px;
  word-break: keep-all;
}
.confirm.confirm-st2>.confirm-title{
  margin-bottom:8px;
}
.confirm>.confirm-content{
  font-weight:300;
  font-size:13px;
  color:#666;
  margin-bottom:40px;
}
.confirm>.confirm-btns{
  text-align:right;
}
.confirm>.confirm-btns>.btn + .btn{
  margin-left:10px;
}
.confirm>.confirm-btns>.confirm-btns-confirm:hover{
  background-color:var(--primary);
  border-color:var(--primary);
  color:var(--white);
}
.confirm>.confirm-btns>.confirm-btns-cancel:hover{
  background-color:var(--gray-smoke);
  border-color:var(--gray-smoke);
}

/** radio **/
label.radio input[type='radio']{
  display:none;
}
label.radio input[type='radio']+span{
  position:relative;
}
label.radio:not(.radio-st2):not(.toggle) input[type='radio']+span:before{
  display:inline-block;
  margin-right:8px;
  content:' ';
  width:14px;
  height:14px;
  border-radius:100px;
  border:1px solid var(--light-gray);
  padding:2px;
  box-sizing:border-box;
  background-size:8px;
  background-repeat:no-repeat;
  background-position:50%;
}
label.radio.radio_m:not(.radio-st2) input[type='radio']+span:before{
  width:16px;
  height:16px;
  background-size:10px;
}
label.radio:not(.radio-st2):not(.toggle) input[type='radio']:checked+span:before{
  border-color:var(--primary);
  background-image:url(/images/icons/circle@2x.png);
}
label.radio:not(.radio-st2):not(.toggle) input[type='radio']:disabled+span:before{
  border-color:var(--dark-gray);
  background-image:url(/images/icons/minus@2x.png);
  background-color:var(--gray-smoke);
}
label.radio:not(.radio-st2):not(.toggle) input[type='radio']:disabled:checked+span:before{
  border-color:var(--dark-gray);
  background-image:url(/images/icons/circle-1@2x.png);
}

label.radio.radio-st2.checked{
  border-color:var(--dark-blue);
  border-color:attr(border)
}
label.radio.radio-st2{
  padding:2px 9px;
  border:1px solid var(--silver);
  height:24px;
  border-radius:4px;
}
label.radio.radio-st2 input[type='radio']+span{
  color:var(--gray);
  font-size:13px;
  line-height:20px;
}
input[type='text']::placeholder,
input[type='password']::placeholder,
input[type='email']::placeholder,
input[type='date']::placeholder,
input[type='time']::placeholder,
input[type='number']::placeholder,
input[type='tel']::placeholder,
textarea::placeholder{
  font-size: 14px;
  font-weight: 300;
  color: var(--dark-gray);
}

/** checkbox **/
label.checkbox input[type='checkbox']{
  display:none;
}
label.checkbox input[type='checkbox']+span{
  position:relative;
}
label.checkbox:not(.toggle) input[type='checkbox']+span:before{
  display:inline-block;
  box-sizing:border-box;
  content:' ';
  width:16px;
  height:16px;
  border-radius:100px;
  border:2px solid var(--light-gray);
  padding:1px;
  vertical-align: middle;
  margin-right:8px;
  background-color:#FFF;
}
label.checkbox.checkbox-st2 input[type='checkbox']+span:before{
  border-radius:2px;
}
label.checkbox.checkbox-st3 input[type='checkbox']+span:before{
  background-color:transparent;
  border-color:transparent;
  background-image:url(/images/icons/check-mark-gray-black-outline@2x.png);
  background-size:100%;
  background-repeat:no-repeat;
  background-position:50%;
}
label.checkbox.checkbox-st3 input[type='checkbox']:checked+span:before{
  background-image:url(/images/icons/check-mark-blue-outline@2x.png);
  background-color:transparent;
  border-color:transparent;
}

label.checkbox input[type='checkbox']+span a{
  vertical-align: middle;
  text-decoration:underline;
}
label.checkbox input[type='checkbox']:checked+span:before{
  background-image:url(/images/icons/check-mark-black-outline@2x.png);
  background-size:10px;
  background-repeat:no-repeat;
  background-position:50%;
  border-color:var(--primary);
  background-color:var(--primary);
}
label.checkbox.check_m{
  height:22px;
}
label.checkbox.check_m input[type='checkbox']+span:before{
  display:inline-block;
  box-sizing:border-box;
  content:' ';
  width:22px;
  height:22px;
  border-radius:100px;
  border-width:3px;
  padding:1px;
  background-size:14px; 
}
label.checkbox.check_m.checkbox-st2 input[type='checkbox']+span:before{
  border-radius:2px;
}
label.checkbox.check-sub input[type='checkbox']:checked+span:before{
  border-color:var(--deep-sky-blue);
  background-color:var(--deep-sky-blue);
}
label.checkbox input[type='checkbox']:disabled+span:before{
  background-image:url(/images/icons/minus@2x.png);
  background-position:50%;
  background-size: 11px;
  background-color:var(--gray-smoke);
  border-color:var(--light-gray);
}
label.checkbox input[type='checkbox']:checked:disabled+span:before{
  background-image:url(/images/icons/check-mark-gray-black-outline@2x.png);
  background-position:50%;
  background-size: 11px;
  background-color:var(--gray-smoke);
  border-color:var(--gray-smoke);
}

/** checkbox - lever**/
label.lever input[type='checkbox']{
  display:none;
}
label.lever input[type='checkbox'] + span:before{
  content: '●';
  display: inline-block;
  width: 44px;
  height: 24px;
  border-radius: 15px;
  background-color: var(--gray-smoke);
  border: 1px solid #707070;
  color: #707070;
  padding-left: 3px;
  padding-right: 3px;
  box-sizing: border-box;
  margin-left: 10px;
  vertical-align: bottom;
  font-size: 18px;
  line-height: 20px;
  text-align: left!important;
}
label.lever input[type='checkbox']:checked + span:before{
  color:var(--primary);
  text-align:right!important;
  border-color:var(--primary);
  background-color: var(--solitude);
  font-size: 18px;
  line-height: 20px;
}
label.lever input[type='checkbox']:checked + span{
  color:var(--primary);
  font-weight:500;
}

/** checkbox toggle **/
.toggle-group label.toggle{
  height:32px;
  line-height:18px;
  /*width:44px;*/
  background-color:#FFF;
  border:1px solid var(--silver);
  padding:5px 15px;
  color:var(--dim-gray);
  font-weight:300;
  font-size:14px;
  float:left;
}
.toggle-group label.toggle.toggle-m{
  height:36px;
  line-height:20px;
  font-weight: 400;
}
.toggle-group label.toggle.radio{
  width:auto;
}
.toggle-group label.toggle.checked{
  background-color:var(--primary);
  border-color:var(--primary);
  font-weight:400;
  font-size:14px;
  color:#fff;
}
.toggle-group label.toggle.disabled{
  background-color:var(--gray-smoke);
  font-weight:400;
  font-size:14px;
  color:var(--dim-gray);
}
.toggle-group label.toggle span{
  color:inherit;
  font-size:inherit;
  font-weight:inherit;
}
.toggle-group label.toggle:first-child{
  border-top-left-radius:4px;
  border-bottom-left-radius:4px;
}
.toggle-group label:not(.blind).toggle:last-child{
  border-top-right-radius:4px;
  border-bottom-right-radius:4px;
}
.toggle-group label.toggle + label.toggle{
  border-left:none;
}
.toggle-group label.toggle input[type="checkbox"], .toggle-group label.toggle input[type="radio"]{
  display:none;
}

/** input text **/
label.input{
  display:inline-block;
  height:36px;
  line-height:20px;
  max-width:100%;
  /*min-width:180px;*/
  width:180px;
  background-color:#FFF;
  border:1px solid var(--silver);
  border-radius:4px;
  font-weight:300;
  font-size:14px;
  color:var(--dark-gray);
  padding:7px 13px;
}
label.input.input-multi{
  display:flex;
  max-width:100%;
  min-width:180px;
}
label.input.input-multi input{
  width:90px;
}
label.input.input-multi .dash{
  margin-left:14px;
  margin-right:14px;
}
label.input.input-box1{
  border-radius:4px;
}
label.input.input-box2{
  border-radius:20px;
}
label.input.input-w-icon{
  position:relative;
  /*padding-right:40px;*/
  display:flex;
}

label.input.input-w-icon .icon{
  position: absolute;
  display: inline-block;
  height: 100%;
  width: 20px;
  height: 20px;
  float: left;
}
label.input.input-w-icon .icon + input, label.input.input-w-icon .icon + input:focus{
  padding-left:30px;
}
label.input.input-w-icon input + .icon{
  position: absolute;
  display: inline-block;
  height: 100%;
  width: 20px;
  height: 20px;
  float: right;
  right: 10px;
}
label.input.input-w-icon .icon img{
  width:100%;
  height:100%;
}
label.input.input-s{
  height:28px;
  line-height:19px;
  min-width:180px;
  background-color:#FFF;
  border:1px solid var(--silver);
  font-weight:300;
  font-size:13px;
  color:var(--dark-gray);
  padding:3.5px 13px;
}
label.input.input-r{
  height:32px;
  line-height:20px;
  width:180px;
  background-color:#FFF;
  border:1px solid var(--silver);
  font-weight:300;
  font-size:14px;
  color:var(--dark-gray);
  padding:5px 13px;
}
label.input.input-m{
  height:36px;
  line-height:20px;
  min-width:180px;
  background-color:#FFF;
  border:1px solid var(--silver);
  font-weight:300;
  font-size:14px;
  color:var(--dark-gray);
  padding:7px 13px;
}
label.input.input-l{
  height:40px;
  line-height:20px;
  min-width:180px;
  background-color:#FFF;
  border:1px solid var(--silver);
  font-weight:300;
  font-size:14px;
  color:var(--dark-gray);
  padding:9px 13px;
}
label.input.focus, label.input.active:not(.no-actived-border){
  border:1px solid var(--primary);
  color:var(--dark);
}
label.input.disabled{
  color:var(--dark-gray);
  background-color:var(--gray-smoke);
  border:1px solid var(--silver);
}
label.input.disabled input{
  background-color:var(--gray-smoke);
}
label.input.no-icons img{
  display:none;
}
/* input with help */
/* basic */
label.input.input-w-help, 
label.radio.input-w-help{
  position:relative;
}
label.input.input-w-help.active:not(.help-on-top), 
label.input.input-w-help.active-help2:not(.help-on-top), 
label.input.input-w-help.always-active-help:not(.help-on-top),
label.radio.input-w-help.active:not(.help-on-top), 
label.radio.input-w-help.active-help2:not(.help-on-top), 
label.radio.input-w-help.always-active-help:not(.help-on-top){
  margin-bottom:21px;
}
label.input.input-w-help.active:not(.help-on-top):after, 
label.input.input-w-help.active-help2:not(.help-on-top):after, 
label.input.input-w-help.always-active-help:not(.help-on-top):after,
label.radio.input-w-help.active:not(.help-on-top):after, 
label.radio.input-w-help.active-help2:not(.help-on-top):after, 
label.radio.input-w-help.always-active-help:not(.help-on-top):after{
  position:absolute;
  left:0;
  bottom:-21px;
  font-weight:300;
  font-size:13px;
  color:#666;
  padding-left:7px;
  content:attr(data-help);
  white-space:nowrap;
}
label.input.input-w-help.active.error:not(.help-on-top)[data-error]:after, 
label.input.input-w-help.active-help2.error:not(.help-on-top)[data-error]:after, 
label.input.input-w-help.always-active-help.error:not(.help-on-top)[data-error]:after,

label.radio.input-w-help.active.error:not(.help-on-top)[data-error]:after, 
label.radio.input-w-help.active-help2.error:not(.help-on-top)[data-error]:after, 
label.radio.input-w-help.always-active-help.error:not(.help-on-top)[data-error]:after{
  content:attr(data-error);
}
label.input.input-m.input-w-help.active:not(.help-on-top):after, 
label.input.input-m.input-w-help.active-help2:not(.help-on-top):after, 
label.input.input-m.input-w-help.always-active-help:not(.help-on-top):after,

label.radio.input-m.input-w-help.active:not(.help-on-top):after, 
label.radio.input-m.input-w-help.active-help2:not(.help-on-top):after, 
label.radio.input-m.input-w-help.always-active-help:not(.help-on-top):after{
  bottom:-29px;
}
/* help on top */
label.input.input-w-help.active.help-on-top, 
label.input.input-w-help.active-help2.help-on-top{
  margin-top:21px;
}
label.input.input-w-help.active:.help-on-top:after, 
label.input.input-w-help.active-help2:.help-on-top:after, 
label.input.input-w-help.always-active-help:.help-on-top:after{
  position:absolute;
  width:100%;
  left:0;
  top:-21px;
  font-weight:300;
  font-size:13px;
  color:#666;
  padding-left:7px;
  content:attr(data-help);
}
label.input.input-w-help.active.error.help-on-top[data-error]:after, 
label.input.input-w-help.active-help2.error.help-on-top[data-error]:after, 
label.input.input-w-help.active.always-active-help.help-on-top[data-error]:after{
  content:attr(data-error);
}
label.input.input-w-help.active-help2:after{
  content:attr(data-help2)!important;
}
label.input.input-w-help.active.error:before, 
label.input.input-w-help.active-help2.error:before, 
label.input.input-w-help.active.error:after,
label.input.input-w-help.active-help2.error:after,

label.radio.input-w-help.active.error:before, 
label.radio.input-w-help.active-help2.error:before, 
label.radio.input-w-help.active.error:after,
label.radio.input-w-help.active-help2.error:after{
  color:var(--danger);
}
label.input.error:not(.input-line){
  border-color:var(--danger);
  background-color:var(--lavender-blush);
  color:var(--danger);
}
label.input.error.input-line{
  color:var(--danger);
  border-color:var(--danger);
  border-top-style:none;
  border-left-style:none;
  border-right-style:none;
}

label.input.error:not(.input-line)>input[type='text'], 
label.input.error:not(.input-line)>input[type='number'], 
label.input.error:not(.input-line)>input[type='email'], 
label.input.error:not(.input-line)>input[type='tel'], 
label.input.error:not(.input-line)>input[type='password']{
  background-color:var(--lavender-blush);
}
label.input.error .input-help{
  color:var(--danger);
}

label.input>input[type='text'], label.input>input[type='text']:focus, 
label.input>input[type='password'], label.input>input[type='password']:focus, 
label.input>input[type='email'], label.input>input[type='email']:focus, 
label.input>input[type='number'], label.input>input[type='number']:focus,
label.input>input[type='tel'], label.input>input[type='tel']:focus{
  overflow:visible;
  border:none;
  box-shadow:none;
  outline:none;
  width:100%;
  padding:0;
  height:100%;
  color:var(--dark);
  font-weight:inherit;
  font-size:inherit;
  overflow:visible;
}

label.input.input-line{
  border-radius:0px;
  border-top-style:none;
  border-left-style:none;
  border-right-style:none;
  padding-left:14px;
  padding-right:14px;
}
.file-field input[type='file']{
  display:none;
}
label.input.input-textarea{
  height:92px;
}
label.input.input-textarea textarea{
  border:none;
  width:100%;
  height:100%;
  resize: none;
}

/** dropdown **/
a.dropdown-target{
  position:relative;
  display:inline-block;
  padding-right:35px;
  min-width:35px;
  min-height:35px;
}
a.dropdown-target:after{
  position:absolute;
  display:inline-block;
  content:' ';
  width:35px;
  height:35px;
  right:0;
  background-image:url(/images/icons/more@2x.png);
  background-repeat:no-repeat;
  background-position:50%;
  background-size:17px;
}
a.dropdown-target.icon-white:after{
  background-image:url(/images/icons/more-white@2x.png);
}
a.dropdown-target.icon-caret-arrow:after{
  background-image:url(/images/icons/caret-arrow-down.svg);
}
a.dropdown-target.icon-caret-arrow.active:after{
  background-image:url(/images/icons/caret-arrow-down.svg);
  transform:rotate(180deg);
}
a.dropdown-target.hover, a.dropdown-target:not(.no-hover):hover{
  background-color:var(--gray-smoke);
}
a.dropdown-target.active:after{
  background-image:url(/images/icons/more-1@2x.png);
}
a.dropdown-target.icon-white.active:after{
  background-image:url(/images/icons/more-white@2x.png);
}
a.dropdown-target + ul.dropdown{
  display:none;
}
a.dropdown-target.active + ul.dropdown{
  display:block;
}
ul.dropdown{
  position:absolute;
  width:140px;
  list-style:none;
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
  background-color:#FFF;
  z-index:996;
}
ul.dropdown>li.dropdown-item{
  height:36px;
}
ul.dropdown>li.dropdown-item:hover{
  background-color:var(--gray-smoke);
}
ul.dropdown>li.dropdown-item>a{
  display:block;
  width:100%;
  padding:8px 16px;
  font-weight:300;
  font-size:14px;
  line-height:100%;
  color:#333;
}
ul.dropdown.dropdown-L>li.dropdown-item{
  height:40px;
}
ul.dropdown.dropdown-L>li.dropdown-item>a{
  padding:10px 16px;
  font-weight:300;
  font-size:14px;
  color:#333;
}
ul.dropdown.dropdown-w-icon{
  width:160px;
}
ul.dropdown.dropdown-w-icon>li.dropdown-item>a>.icon{
  width:15px;
  height:15px;
  float:right;
}
ul.dropdown.dropdown-w-icon>li.dropdown-item>a>.icon>img{
  width:15px;
  height:15px;
}

/** news list **/
.news-list{
  display:inline-block;
  width:370px;
  height:576px;
  border-radius:20px 0px 0px 20px;
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
  background-color:#FFF;
  z-index:99;
}
.news-list:not(.design){
  position:fixed;
  top:65px;
  right:20px;
}
.news-list>.news-header{
  width:100%;
  height:60px;
  padding:16px 20px;
  border-bottom:1px solid var(--silver);
  font-weight:500;
  font-size:18px;
  color:var(--dark);
}
.news-list>.news-header>.title{
  display:inline-block;
  font-size:18px;
  font-weight:500;
}
.news-list>.news-header>.news-btns{
  float:right;
}
.news-list>.news-header>.news-btns>.btn{
  margin-left:8px;
}
.news-list>.news-container{
  position:relative;
  overflow-y:scroll;
  width:100%;
  height:516px;
  padding:10px 10px 16px 10px;
  background-image: url(/images/icons/empty@2x.png);
  background-repeat: no-repeat;
  background-position: 50% 30px;
  background-size:40px;
}
.news-list>.news-container:before{
  content:'새로운 알림이 없습니다';
  position:absolute;
  display:block;
  width:calc(100% - 17px);
  font-weight:400;
  font-size:14px;
  color:var(--dark);
  text-align:center;
  top:70px;
}
.news-list>.news-container>.news-item{
  position:relative;
  width:100%;
  min-height:92px;
  padding:10px 20px 10px 30px;
  background-color:var(--white);
  border-radius:10px;
}
.news-list>.news-container>.news-item:hover{
  background-color:var(--gray-smoke);
}
.news-list>.news-container>.news-item>.news-item-delete{
  position:absolute;
  display:inline-block;
  width:10px;
  height:10px;
  right:20px;
  top:10px;
  background-image:url(/images/icons/close-gray@2x.png);
  background-repeat:no-repeat;
  background-position:50%;
  z-index:9;
}
.news-list>.news-container>.news-item>.news-item-title{
  position:relative;
  font-size:16px;
  font-weight:500;
  color:var(--dark);
  margin- bottom:0;
}
.news-list>.news-container>.news-item>.news-item-title:before{
  position:absolute;
  content:' ';
  width:8px;
  height:8px;
  left:-16px;
  top:calc(50% - 4px);
  background-color:var(--danger);
  border-radius:4px;
}
.news-list>.news-container>.news-item>.news-item-content{
  font-size:14px;
  font-weight:500;
  color:var(--dim-gray);
  margin-bottom:10px;
}
.news-list>.news-container>.news-item>.news-item-sub{
  font-size:12px;
  font-weight:300;
  color:var(--dark-gray);
  text-align:right;
}
.news-list>.news-container>.news-item.complete *{
  color:var(--dark-gray);
}
.news-list>.news-container>.news-item.complete>.news-item-title:before{
  background-color:var(--dark-gray);
}

/** progress bar **/
.progress-bar{
  position:relative;
  height:60px;
}
.progress-bar:before{
  position:absolute;
  display:block;
  width:335px;
  left:32px;
  top:15px;
  content:' ';
  border-top:1px solid var(--gray);
}
.progress-bar.progress-step5:before{
  width:650px;
  left:25px;
}
.progress-bar .step{
  position:absolute;
  display: inline-block;
}
.progress-bar .step .progress-pointer{
  width:30px;
  height:30px;
  padding-top:8px;
  margin:auto;
  margin-bottom:10px;
}
.progress-bar .step .progress-pointer:before{
  position: relative;
  content: ' ';
  display: block;
  width: 16px;
  height: 16px;
  border: 1px solid var(--gray);
  border-radius: 8px;
  box-sizing: border-box;
  background-color:var(--gray);
  vertical-align:middle;
  margin:auto;
}
.progress-bar .step.completed .progress-pointer:before{
  position: relative;
  width: 30px;
  height: 30px;
  border: 3px solid var(--primary);
  border-radius: 15px;
  box-sizing: border-box;
  background-color:var(--primary);
  background-image:url(/images/icons/check-mark-black-outline.png);
  background-size: 16px;
  background-position: 50%;
  background-repeat: no-repeat;
}
.progress-bar .step.completed .progress-pointer, .progress-bar .step.active .progress-pointer{
  padding-top:0;
}
.progress-bar .step.active .progress-pointer:before{
  position: relative;
  width: 30px;
  height: 30px;
  border: 3px solid var(--primary);
  border-radius: 15px;
  box-sizing: border-box;
  background-color:#FFF;
  background-image: url(/images/icons/progress-arrow@2x.png);
  background-size: 16px;
  background-position: 50%;
  background-repeat: no-repeat;
}
.progress-bar.progress-step3 .step.step1{
  left:0;
}
.progress-bar.progress-step3 .step.step2{
  left:calc(50% - 30px);
}
.progress-bar.progress-step3 .step.step3{
  right:0;
}

.progress-bar.progress-step5 .step.step1{
  left:0;
}
.progress-bar.progress-step5 .step.step2{
  left:calc(25% - 30px);
}
.progress-bar.progress-step5 .step.step3{
  left:calc(50% - 30px);
}
.progress-bar.progress-step5 .step.step4{
  left:calc(75% - 30px);
}
.progress-bar.progress-step5 .step.step5{
  right:0;
}

/** table **/
table{
  table-layout: fixed;
}
table thead, table tbody tr.table-footer{
  border-top:1px solid #BDBDBD;
  border-bottom:1px solid #BDBDBD;
}
table thead th{
  text-align:center;
  background-color:#EEEEEE;
}
table:not(.no-bordered) tbody tr td:not(.no-border){
  border-right:1px solid #BDBDBD;
}
table:not(.no-bordered) tbody tr td:last-child{
  border-right-style:none;
}
table.bordered-bottom tr{
  border-bottom:1px solid #E0E0E0;
}
table td, table th{
  height:32px;
  padding:0 20px;
}
table tbody tr:last-child{
  border-bottom:1px solid #BDBDBD;
}
table tbody tr.hovered:hover, table tbody tr.hovered:hover td{
  background-color:#EDF2FE!important;
}
th>a.sort:after{
  content:' ';
  display:inline-block;
  width:10px;
  height:10px;
  margin-left:8px;
  background-image:url(/images/icons/sort@2x.png);
  background-repeat:no-repeat;
  background-position:50%;
  background-size:100%;
}
th>a.sort.asc:after{
  background-image:url(/images/icons/sort_asc@2x.png);
}
th>a.sort.desc:after{
  background-image:url(/images/icons/sort_desc@2x.png);
}

/**scheduler**/
ul.calendar-wdates{
  height:36px;
  border:1px solid var(--silver);
  border-bottom-style:none;
}
ul.calendar-wdates>li.wdates{
  padding:5px;
  text-align:center;
}
ul.weeks{
  border:1px solid var(--silver);
  border-bottom-style:none;
}
ul.weeks:last-child{
  border-bottom:1px solid var(--silver);
}
ul.weeks>li.dates{
  height:164px;
  padding:10px 4px;
  border-right:1px solid var(--silver);
}
ul.weeks>li.dates.today{
  border:2px solid var(--primary);
}
.labor ul.weeks>li.dates.today{
  padding: 8px 3px;
}
ul.weeks>li.dates:last-child{
  border-right-style:none;
}
ul.weeks>li.dates[data-holiday='Y'], ul.weeks>li.dates[data-holiday='Y']>p, ul.weeks>li.dates[data-holiday='Y']>p>span, 
ul.weeks>li.dates[data-wdate='0'], ul.weeks>li.dates[data-wdate='0']>p, ul.weeks>li.dates[data-wdate='0']>p>span, 
ul.calendar-wdates>li.wdates[data-wdate='0'], ul.calendar-wdates>li.wdates[data-wdate='0']>p, ul.calendar-wdates>li.wdates[data-wdate='0']>p>span{
  color:var(--danger);
}
ul.weeks>li.dates[data-current='N'], ul.weeks>li.dates[data-current='N']>p, ul.weeks>li.dates[data-current='N']>p>span{
  color:var(--dark-gray);
}
.schedules-items > .schedule-item, .schedules-items > .schedule-space{
  position:relative;
  height:22px;
  margin-bottom:2px;
  padding:1px 4px;
  z-index:9;
  border-radius:4px;
  cursor:pointer;
}
.schedules-items > .schedule-space{
  z-index:1;
}
.schedule-item[data-type='HOLIDAY']{
  color:var(--danger);
}
.schedule-item[data-type='F'], .schedule-item[data-type='H'], .schedule-item[data-type='T']{
  border:1px solid var(--dark-blue);
  background-color:var(--ghost-white);
  color:#333;
}
.schedule-item[data-type='E']{
  background-color:var(--dark-blue);
  border:1px solid var(--dark-blue);
  color:#FFF;
}
.schedule-item[data-type='C']{
  background-color:var(--danger);
  border:1px solid var(--danger);
  color:#FFF;
}
.schedule-item[data-type='B']{
  background-color:var(--warning);
  border:1px solid var(--warning);
  color:var(--dark);
}
label.input .won-picker-area{
  /*position: relative;*/
  left: -14px;
}
label.input .won-picker-area .picker-wrapper{
  /*top:5px;
  left:-3px;*/
}
/** image overlay **/
.image-overlay{
  position:fixed;
  top:0px;
  left:0px;
  z-index:998;
  text-align:center;
  width:100vw;
  height:100vh;
  padding-top:80px;
  background-color:rgba(0, 0, 0, 0.6);
}
.image-overlay .img-field{
}
.image-overlay .close-view-image{
  vertical-align:top;
  margin-left:40px;
  position:absolute;
}

@media only screen and (max-width:990px){
  .image-overlay{
    padding-top:52px;
  }
  .image-overlay .img-field{
    max-width:91%;
  }
  .image-overlay .close-view-image{
    margin-left:0;
    top: 25px;
    width: 12px;
    height: 12px;
    right:50px;
  }
  .image-overlay .close-view-image img{
    width:12px;
    height:12px;
  }
}
.icon-circle{
  display:inline-block;
  text-align:center;
  vertical-align:middle;
  width: 20px;
  height: 20px;
  border-radius: 10px;
}
.display-f .icon-circle{
  margin-top: 5px;
}
.icon-circle.minus{
  background-color:var(--danger);
}
.icon-circle.minus:before{
  content: ' ';
  background-image: url(/images/icons/minus_w.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 12px;
  width: 100%;
  height: 100%;
  display: block;
}
.icon-circle.plus{
  background-color:var(--primary);
}
.icon-circle.plus:before{
  content: ' ';
  background-image: url(/images/icons/plus_w.png);
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 12px;
  width: 100%;
  height: 100%;
  display: block;
}
.icon-circle.plus.disabled{
  background-color:var(--gray-smoke);
}
.icon-circle.plus.disabled:before{
  background-image: url(/images/icons/plus_disabled.png);
}
.icon-circle img{
  line-height:20px;
  width:12px;
  height:auto;
  vertical-align:middle;
}
.position-r{
  position:relative;
}
.position-s{
  position:static;
}
.position-a{
  position:absolute;
}
.position-f{
  position:fixed;
}
ul.list{
  width:360px;
  max-height:263px;
  height:263px;
  overflow-y:scroll;
  border:1px solid var(--silver);
  border-radius:8px 0px 0px 8px;
}
ul.list>li.list-item{
  height:40px;
  padding:10px 16px 10px 13px;
}
ul.list>li.list-item:hover{
  background-color:#EEE;
}
ul.list>li.list-item>.close-icon{
  width:11px;
  height:100%;
}
ul.list>li.list-item>.close-icon:before{
  content: ' ';
  background-image: url(/images/icons/close-gray@2x.png);
  display: block;
  width: 11px;
  height: 100%;
  background-size: 11px;
  background-position: 50%;
  background-repeat: no-repeat;
}
.badge{
  padding:0px 8px;
  height:20px;
}
#settingModal .badge{
  min-width:0px!important;
}
.badge.badge-r{
  height:24px;
  padding:2.5px 16px;
  border-radius:0px;
  border-width:1px;
  border-style:solid;
  font-size:13px;
}
.badge.badge-xs{
  height:21px;
  padding:1px 10px;
  border-radius:2px;
  border-width:1px;
  border-style:solid;
  line-height:14px!important;
}
.badge.badge-s{
  height:28px;
  padding:4.5px 9px;
  line-height:14px!important;
}
.badge.badge-s *{
  line-height:14px!important;
}
.badge.badge-xs *{
  line-height:19px!important;
}
.member-list{
  padding:10px 28px 10px 10px!important;
  overflow-y:scroll;
}
.member-list .member-list-item{
  display:flex;
  width:234px;
  height:auto;
  margin-bottom:8px;
  cursor:pointer;
  padding:20px 10px;
}
.member-list .member-list-item.active{
  background:var(--alice-blue);
  border:2px solid var(--dark-blue);
  border-radius:8px;
}
.member-list .member-list-item.item-w-status{
  height:auto;
}
.member-list .member-list-item:hover{
  box-shadow:0 5px 15px rgba(0,0,0, 0.08);
}
.member-list .member-list-item .profile-image{
  position:relative;
  width:40px;
  height:100%;
}
.member-list .member-list-item .profile-image>.img{
  position:relative;
  display:block;
  content:' ';
  width:40px;
  height:40px;
  border-radius:20px;
  background-image:url(/images/no-profile.png);
  background-size:cover;
  background-repeat:no-repeat;
  background-position:50%;
}
.member-list .member-list-item .profile-content{
  width:174px;
}
.member-status{
  margin-top:10px;
  margin-bottom:4px;
  padding:0 10px;
  min-width:100px;
  height:19px;
  background-color:var(--danger);
  color:#FFF;
  width:fit-content;
}
.member-status + .member-status{
  margin-top:4px;
}
.contract-title{
  width:100%;
  padding-bottom:16px;
}
.contract-content{
  padding:24px 58px 30px 20px;
}
.payroll_field{
  display:flex;
  min-height:229px;
}
.payroll_field .payroll_group{
  width:414px;
  display:flex;
  flex-direction:column;
  border-top:1px solid #BDBDBD;
  border-bottom:1px solid #BDBDBD;
}
.payroll_field .payroll_group li.meal_pay{
  margin-top:auto;
}
.payroll_field .payroll_group li.meal_pay + li.meal_pay{
  margin-top:0;
}
.payroll_field .payroll_group li.nontax{
  margin-top:auto;
}
.payroll_field .payroll_group li.nontax + li.nontax{
  margin-top:0;
}
/*
.payroll_field .payroll_group{
  width:275px;
  border-top:1px solid var(--silver);
  border-bottom:1px solid var(--silver);
}
*/
.payroll_field .payroll_group *{
  font-size:13px;
  font-weight:300;
  line-height:19px;
}
.payroll_field .payroll_group li{
  padding:7px 20px;
}
.payroll_field .payroll_group li.sum{
  background-color:#F4F4F4;
  border-bottom:1px solid #BDBDBD;
}
.payroll_field .payroll_group li .value{
  float:right;
}
.open-payroll-wizard{
  border-radius:4px!important;
}
.border-top{
  border-top-width:1px;
  border-top-style:solid;
}
.border-right{
  border-right-width:1px;
  border-right-style:solid;
}
.border-bottom{
  border-bottom-width:1px;
  border-bottom-style:solid;
}
.border-left{
  border-left-width:1px;
  border-left-style:solid;
}
.border-solid1{
  border-width:1px;
  border-style:solid!important;
}
.border-solid2{
  border-width:2px!important;
  border-style:solid!important;
}
.selectize-control {
  height: 100%;
  padding: 0!important;
}
.selectize-input{
  border-style: none;
  height: 100%;
  padding: 0;
  box-shadow: none;
}
.selectize-control.multi .selectize-input.has-items{
  padding:0;
}
.selectize-input.focus{
  box-shadow:none;
}
.container-w-vcalendar{
  display:flex;
  width:1280px;
  max-width:1280px;
  margin:auto;
  min-height:calc(100vh - 380px);
}
.container-w-vcalendar .vertical-calendar{
  width:128px;
  height:870px;
  background-color:#FFF;
  overflow-y:scroll;
  border:1px solid var(--light-gray);
  margin-right:17px;
  padding:20px 10px 0 10px;
}
.container-w-vcalendar .vertical-calendar ~ .container{
  width:1136px;
  /*height:870px;*/
  padding:20px;
  border:1px solid var(--light-gray);
  /*overflow-y:scroll;*/
  background-color:#FFF;
}
.container-w-vcalendar .vertical-calendar .calendar-year{
  height:64px;
  padding:20px 0;
  text-align:center;
}
.container-w-vcalendar .vertical-calendar .calendar-month{
  text-align:center;
}
.container-w-vcalendar .vertical-calendar .calendar-month li{
  height:64px;
  padding:12px 0;
  text-align:center;
}
.container-w-vcalendar .vertical-calendar .calendar-month li>a{
  position:relative;
  display:block;
  margin:auto;
  font-size:16px;
  font-weight:400;
  color:#333;
  width: 40px;
  height: 40px;
  line-height:40px!important;
  padding: 0;
  border-radius: 20px;
}
.container-w-vcalendar .vertical-calendar .calendar-month li>a:hover{
}
.container-w-vcalendar .vertical-calendar .calendar-month li>a.w-badge:after {
    position: absolute;
    content: ' ';
    width: 8px;
    height: 8px;
    background-color: #FF5656;
    border-radius: 4px;
    top: 4px;
    right: -2px;
}
.container-w-vcalendar .vertical-calendar .calendar-month li>.select-month.selected:not(.disabled){
  height:40px;
  width:40px;
  border-radius:20px;
  background-color:var(--primary);
  color:var(--white);
  font-weight:500!important;
  text-align:center;
}
.container-w-vcalendar .vertical-calendar .calendar-year.select-year.disabled,
.container-w-vcalendar .vertical-calendar .calendar-month li>.select-month.disabled{
  color:var(--gray-smoke);
  cursor:no-drop;
}

.container-w-vcalendar .vcalendar-container-wrapper{
  width: 1136px;
}
.container-w-vcalendar .vcalendar-container-wrapper>.container{
  padding: 20px;
  border: 1px solid var(--light-gray);
  background-color: #FFF;
}

/**timepicker**/
label.input.timepicker{
  /*position:relative;*/
}
label.input.timepicker.focus{
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
/*
label.input.timepicker input + .colon{
  margin:0 6px;
}
label.input.timepicker input{
  width:32px!important;
}
label.input.timepicker.focus input:focus{
  background-color:#ECF1FE;
}
label.input.timepicker ul.timepicker-dropdown{
  position: absolute;
  display:none;
  width: calc(100% + 2px);
  top: 100%;
  left: -1px;
  min-height: 100%;
  background-color:#FFF;
  border: 1px solid var(--primary);
  max-height:200px;
  overflow-y:scroll;
  border-bottom-left-radius:4px;
  z-index:1;
}
label.input.timepicker.active-hour ul.timepicker-dropdown.time-hour{
  display:block;
}
label.input.timepicker.active-min ul.timepicker-dropdown.time-min{
  display:block;
}
label.input.timepicker ul.timepicker-dropdown li{
  height:32px;
  line-height:20px;
  font-size:14px;
  font-weight:300;
  padding:6px 14px;
  cursor:pointer;
}
label.input.timepicker ul.timepicker-dropdown li:hover{
  background-color:var(--ghost-white);
}
label.input.timepicker ul.timepicker-dropdown li.selected{
  background-color:var(--gray-smoke);
}
*/
label.input.timepicker .ui-timepicker-wrapper{
  width:inherit;
  /*left:-1px!important;
  top:100%!important;*/
  box-shadow:none;
  border:1px solid var(--primary);
  border-bottom-left-radius:4px;
}
.tooltips-question{
  display:inline-block;
  width:18px;
  height:18px;
  line-height:20px;
  background-image:url(/images/icons/question.svg);
  background-position-x:50%;
  background-position-y:calc(50% - 0.5px);
  background-repeat:no-repeat;
  background-size:100%;
  vertical-align:middle;
}

.datepickers-container{
  z-index:999;
}
.datepicker--pointer{
  display:none;
}
.highlight{
  background: linear-gradient(to bottom, transparent 50%, #D0F88A 50%);
}
.height-free{
  height:auto!important;
  min-height:0px!important;
  max-height:max-content!important;
  max-height:-webkit-fill-available!important;
  overflow-y:auto!important;
}
.width-free{
  width:auto!important;
  min-width:0px!important;
}
.no-radius{
  border-radius:0!important;
}
.overflow-x{
  max-width:100%;
  overflow-x:scroll;
}
.no-border-left{
  border-left-style:none!important;
}
.no-border-right{
  border-right-style:none!important;
}
.no-border-top{
  border-top-style:none!important;
}
.no-border-bottom{
  border-bottom-style:none!important;
}
.radius-4{
  border-radius:4px;
}
.radius-infinite{
  border-radius:100%;
}
input[type="date"]::-webkit-inner-spin-button, 
input[type="date"]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}
input[type="date"]::-webkit-datetime-edit-year-field,
input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-day-field{
    color: transparent;
}
input[type="date"]{
  border:none;
  list-style-type:none;
}

@media only screen and (max-width:990px){
  .space-xxs-on-s{
  }
}
.pagination-area{
  text-align:center;
}
.pagination-area .pagination{
  border-radius:4px;
  padding:4px 8px;
  position:relative;
}
.pagination-area .pagination.current-page{
  background-color:var(--dark-blue);
  color:#FFF;
}
.ui-timepicker.ui-widget.ui-widget-content.ui-menu.ui-corner-all{
  width:100%!important;
}
.ui-timepicker-viewport{
  width:100%!important;
}
.ui-timepicker-viewport .ui-menu-item{
  width:100%!important;
  text-align:left;
}

/* filters */
label.filters{
  position:relative;
  display:inline-flex;
  height:32px;
  line-height:20px;
  max-width:100%;
  background-color:#FFF;
  font-weight:300;
  font-size:14px;
  color:var(--dark-gray);
}
label.filters>input[type='text'], 
label.filters>input[type='password'],
label.filters>input[type='email'],
label.filters>input[type='number'],
label.filters>input[type='tel']{
  overflow:visible;
  border:1px solid var(--silver);
  border-radius:4px;
  padding:7px 13px 7px 36px;
  box-shadow:none;
  outline:none;
  height:100%;
  color:var(--dark);
  font-weight:inherit;
  font-size:inherit;
  overflow:visible;
  margin-right:10px;
}
label.filters>input[type='text']:focus, 
label.filters>input[type='password']:focus, 
label.filters>input[type='email']:focus, 
label.filters>input[type='number']:focus,
label.filters>input[type='tel']:focus{
  border-color:var(--primary);
}
label.filters.filters-w-search:before{
  position:absolute;
  left:0;
  top:0;
  display:inline-block;
  content:' ';
  background:url(/images/icons/search.png);
  background-position:center;
  background-repeat:no-repeat;
  background-size:16px;
  width:36px;
  height:100%;
}
label.filters>ul.filter{
  display:none;
  width: 121px;
  position: absolute;
  right: 0;
  top: 31px;
  background-color: var(--white);
  border: 1px solid var(--primary);
  border-radius: 0 0 4px 4px;
  z-index:99;
}
label.filters>ul.filter>li{
  height:40px;
}
label.filters>ul.filter>li>label{
  display:block;
  padding:10px 14px;
  width:100%;
}
label.filters>.filterTrigger{
  position:relative;
  border:1px solid var(--silver);
  border-radius:4px;
  padding:7px 34px 7px 13px;
  width:121px;
  height:32px;
  line-height:14px;
}
label.filters>.filterTrigger:before{
  position:absolute;
  display:inline-block;
  content:'필터 없음';
  color: var(--dim-gray);
  font-weight: 300;
}
label.filters>.filterTrigger:after{
  position:absolute;
  content:' ';
  height:100%;
  width:34px;
  display:inline-block;
  background-image:url(/images/icons/filter_N.png);
  background-position:center;
  background-repeat:no-repeat;
  background-size:14px;
  right:0;
  top:0;
}
label.filters>.filterTrigger.applied{
  border-color:var(--primary);
}
label.filters>.filterTrigger.applied:before{
  content:'필터 적용됨';
  color:var(--primary);
  font-weight:400;
}
label.filters>.filterTrigger.applied:after{
  background-image:url(/images/icons/filter_Y.png);
}
label.filters>.filterTrigger.open{
  border-color:var(--primary);
  border-radius:4px 4px 0 0;
}
label.filters>.filterTrigger.open + ul.filter{
  display:block;
}
.sign-icon{
  width:68px;
  height:88px;
  padding:0;
  border-radius:15px;
  overflow:hidden;
  display:inline-block;
  margin-bottom:18px;
}
.sign-icon + .sign-icon{
  margin-left:18px;
}
.sign-icon:hover{
  box-shadow:0 4px 8px rgba(0,0,0, 0.12);
}label.select{
  position:relative;
}
label.select>select{
  width: 100%;
  height:36px;
  border:1px solid var(--silver);
  border-radius:4px;
  font-weight: 300;
  font-size: 14px;
  padding: 0 13px;
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
label.select>select:disabled{
  opacity:1;
  color: var(--dark);
  background-color: var(--gray-smoke);
  border: 1px solid var(--silver);
}
label.select-r>select{
  height:32px;
  line-height:20px;
  width:100%;
  font-weight:400;
  font-size:14px;
  padding:5px 13px;
}
label.select>select>option[value='']{display:none;}
label.select>select:disabled>option{
  color: var(--dark-gray);
}
label.select>select+.arrow{
  content: ' ';
  position: absolute;
  right: 8px;
  top: 0;
  display: block;
  width: 22px;
  height: 22px;
  background-image: url(/images/icons/select.svg);
  background-repeat: no-repeat;
  background-position: center;
}
option{
  height:36px;
}