.daterangepicker {
    position:fixed;
    top:calc(50% - 264px) !important;
    left:calc(50% - 392px) !important;
    width:784px;
    height:529px;
    color: inherit;
    background-color:#fff;
    padding:20px;
    padding-bottom:0;
    z-index: 3001;
    display:none;
    font-size:15px;
    line-height:1em;
    overflow-y:auto;
    box-shadow:0 0 20px rgba(0,0,0,0.2);
    border-radius:8px;
  }
  
  
  .daterangepicker ._head{z-index:9;width:100%;height:40px;font-size:16px;font-weight:700;background:#fff;display:flex;align-items:center;justify-content:flex-start;}
  .daterangepicker ._head .closeBtn{position:absolute;right:20px;font-size:0;}
  .daterangepicker ._head .closeBtn:before{content:'\e93d';font-family:'myfont';font-size:18px;font-weight:normal;}
  .daterangepicker ._head + *{margin-top:70px;}
  
  .daterangepicker .drp-selected{margin-left:auto;margin-right:auto;display:none;align-items:center;justify-content:center;gap:10px;}
  .daterangepicker .drp-selected .tmp_inp{font-size:15px;font-size:600;padding:0 15px;height:37px;min-width:100px;border-radius:40px;color:var(--primary01);background:var(--primary06);display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:14px;}
  /*.daterangepicker .drp-selected .tmp_inp{flex:1;height:42px;font-size:14px;font-size:600;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;border:1px solid var(--G300);background: var(--G100);}
  .daterangepicker.single .drp-selected{display: none;}*/
  
  .daterangepicker.single .daterangepicker .ranges, .daterangepicker.single .drp-calendar {float: none;}
  .daterangepicker.show-calendar .drp-calendar {display: block;}
  .daterangepicker.show-calendar .drp-buttons {/*display: block;*/}
  .daterangepicker.auto-apply .drp-buttons {/*display: block;*/}
  .daterangepicker .drp-calendar {display: none;}
  .daterangepicker .drp-calendar.left{display:inline-flex; width:50%; border-right:1px solid var(--G300); padding-right:30px; }
  .daterangepicker .drp-calendar.right{display:inline-flex; width:50%; padding-left:30px; }
  .daterangepicker .drp-calendar.single .calendar-table {border: none;}
  @media screen and (max-width:780px) {
      .daterangepicker .drp-calendar.left{margin-top:25px;}
      .daterangepicker .drp-calendar.right{margin-top:25px;}
  }
  
  .daterangepicker .calendar-table{width:100%; background-color:#fff;margin-top:20px;}
  .daterangepicker .calendar-table table{width:100%;margin:0;border-spacing:0;border-collapse: collapse;}
  .daterangepicker .calendar-table thead{position:relative;}
  .daterangepicker .calendar-table thead .month{text-align:left;font-size:18px;font-weight:700;}
  .daterangepicker .calendar-table thead .month .inner{display:flex;align-items:center;gap:5px; width:100%; }
  .daterangepicker .drp-calendar.right thead .month .inner{padding-left:13px;}
  .daterangepicker .calendar-table thead .next span, .daterangepicker .calendar-table thead .prev span{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;}
  .daterangepicker .calendar-table thead .prev span:before{content:'\e93f';font-family:'myfont';font-size:15px;font-weight:normal;}
  .daterangepicker .calendar-table thead .next span:before{content:'\e940';font-family:'myfont';font-size:15px;font-weight:normal;}
  .daterangepicker .calendar-table thead ._week{font-size:12px;font-weight:500;color:#A4A4A4}
  
  
  .daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date{border-color:transparent;color:var(--G500);background:transparent;}
  .daterangepicker td.in-range{background-color:#ebf4f8;border-color: transparent;color:#000;border-radius: 0;}
  .daterangepicker td.start-date{border-radius: 4px 0 0 4px;}
  .daterangepicker td.end-date{border-radius: 0 4px 4px 0;}
  
  .daterangepicker .calendar-table th, .daterangepicker .calendar-table td{white-space:nowrap;text-align: center;vertical-align:middle;width:14%;height:44px;font-size:14px;font-weight:500;border-radius:4px;border:0;white-space:nowrap;cursor: pointer;position:relative;}
  .daterangepicker td.available:hover, .daterangepicker th.available:hover {background-color:var(--primary06);border-color:transparent;color: inherit;}
  
  .daterangepicker td.in-range {background-color:var(--mainColor);border-color: transparent;color:#fff;border-radius: 0;}
  .daterangepicker td.start-date {border-radius: 4px 0 0 4px;}
  .daterangepicker td.end-date {border-radius: 0 4px 4px 0;}
  .daterangepicker td.start-date.end-date {border-radius: 4px;}
  
  .daterangepicker td.active, .daterangepicker td.active:hover {background-color:var(--mainColor);;border-color: transparent;color: #fff;}
  
  .daterangepicker .drp-buttons{width:100%;height:55px;margin-top:20px;padding:0 20px;z-index:99;background:#fff;display:flex;align-items:center;gap:15px;}
  .daterangepicker .drp-buttons .resetBtn{width:110px;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:3px;}
  .daterangepicker .drp-buttons .resetBtn:before{content:'';width:20px;height:20px;background:url('./img/reset.svg') no-repeat center / 14px 14px;}
  .daterangepicker .drp-buttons .applyBtn{margin-left:auto;flex:1;width:100%;height:52px;border-radius:4px;font-size:14px;font-weight:700;color:#fff;background: #333;display:flex;align-items:center;justify-content:center;}
  
  
  
  
  .daterangepicker td.disabled, .daterangepicker option.disabled {color: #999;cursor: not-allowed;text-decoration: line-through;}
  .daterangepicker select.monthselect, .daterangepicker select.yearselect {font-size: 12px;padding: 1px;height: auto;margin: 0;cursor: default;}
  .daterangepicker select.monthselect {margin-right: 2%;width: 56%;}
  .daterangepicker select.yearselect {width: 40%;}
  .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {width: 50px;margin: 0 auto;background: #eee;border: 1px solid #eee;padding: 2px;outline: 0;font-size: 12px;}
  .daterangepicker .calendar-time {text-align: center;margin: 4px auto 0 auto;line-height: 30px;position: relative;}
  .daterangepicker .calendar-time select.disabled {color: #ccc;cursor: not-allowed;}
  
  
  
  .daterangepicker.show-ranges.single.rtl .drp-calendar.left {border-right: 1px solid #ddd;}
  .daterangepicker.show-ranges.single.ltr .drp-calendar.left {border-left: 1px solid #ddd;}
  .daterangepicker.show-ranges.rtl .drp-calendar.right {border-right: 1px solid #ddd;}
  .daterangepicker.show-ranges.ltr .drp-calendar.left {border-left: 1px solid #ddd;}
  .daterangepicker .ranges {float: none;text-align: left;margin: 0;}
  .daterangepicker.show-calendar .ranges {margin-top: 8px;}
  .daterangepicker .ranges ul {list-style: none;margin: 0 auto;padding: 0;width: 100%;}
  .daterangepicker .ranges li {font-size: 12px;padding: 8px 12px;cursor: pointer;}
  .daterangepicker .ranges li:hover {background-color: #eee;}
  .daterangepicker .ranges li.active {background-color: #08c;color: #fff;}
  
  /*  Larger Screen Styling */
  @media (min-width: 564px) {
    /*.daterangepicker{width:auto;}
  
    .daterangepicker .ranges ul {
      width: 140px;
    }
  
    .daterangepicker.single .ranges ul {
      width: 100%;
    }
  
    .daterangepicker.single .drp-calendar.left {
      clear: none;
    }
  
    .daterangepicker.single .ranges, .daterangepicker.single .drp-calendar {
      float: left;
    }
  
    .daterangepicker {
      direction: ltr;
      text-align: left;
    }
  
    .daterangepicker .drp-calendar.left {
      clear: left;
      margin-right: 0;
    }
  
    .daterangepicker .drp-calendar.left .calendar-table {
      border-right: none;
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }
  
    .daterangepicker .drp-calendar.right {
      margin-left: 0;
    }
  
    .daterangepicker .drp-calendar.right .calendar-table {
      border-left: none;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }
  
    .daterangepicker .drp-calendar.left .calendar-table {
      padding-right: 8px;
    }
  
    .daterangepicker .ranges, .daterangepicker .drp-calendar {
      float: left;
    }
  }*/
}
  @media (min-width: 730px) {
    /*.daterangepicker .ranges {
      width: auto;
    }
  
    .daterangepicker .ranges {
      float: left;
    }
  
    .daterangepicker.rtl .ranges {
      float: right;
    }
  
    .daterangepicker .drp-calendar.left {
      clear: none !important;
    }*/
  }