@charset "utf-8";

.calendar-wrap .ui-widget-content{
    padding:0;
    border:0;
    width: 730px !important;
    display: flex !important;
    justify-content: space-between;
    column-gap: 64px;
    height:330px;
    
}

.calendar-wrap .ui-widget-content:before,
.calendar-wrap .ui-widget-content:after {
    content: none;
}

.calendar-wrap .ui-widget-content .ui-datepicker-row-break{
    display: none;
}

.calendar-wrap .ui-datepicker-multi .ui-datepicker-group{
    margin-top:33px;
}

.calendar-wrap .ui-datepicker-prev, .calendar-wrap .ui-datepicker-next{
    display: inline-block;
    /* width: 33px;
    height:33px; */
}

.calendar-wrap .ui-datepicker .ui-datepicker-prev span, .calendar-wrap .ui-datepicker .ui-datepicker-next span{
    display: inline-block;
    position:initial;
    cursor: pointer;
    margin:0;
}
.calendar-wrap .ui-datepicker .ui-datepicker-prev span{
    background: url(/images/bt_pre2.png) no-repeat;
}

.calendar-wrap .ui-datepicker .ui-datepicker-next span{
    background: url(/images/bt_next2.png) no-repeat;
}

.calendar-wrap .ui-datepicker .ui-datepicker-header{
    padding:0;
    height:auto;
}

.calendar-wrap .ui-widget-header .ui-datepicker-title,
.calendar-wrap .ui-widget-header .ui-datepicker-year,
.calendar-wrap .ui-widget-header .ui-datepicker-month{
    font-size: 18px;
    text-align: left;
    color: #000;
    font-weight:700;
    line-height: 1.5;
    margin:0;
}

.calendar-wrap .ui-datepicker-multi .ui-datepicker-group table{
    margin:0 auto !important;
}

.calendar-wrap .calendar td,
.calendar-wrap .calendar td > * {
    font-size: 15px;
    border: 0 !important;
    padding: 0;
}

.calendar-wrap .calendar td{
    height: 40px;
    width: 48px;
    text-align: center;
}

.calendar-wrap .calendar td > * {
    height: 30px;
    line-height: 30px;
}

.calendar-wrap .calendar td > a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #666;
    width: 40px;
    height:40px;
    position: relative;
    margin: 0 auto;
}
.calendar-wrap .calendar td.datepicker-selected.datepicker-start {
    background:linear-gradient(to right, #fff 50%, #fdeded 50%);
}
.calendar-wrap .calendar td.datepicker-selected.datepicker-end {
    background:linear-gradient(to left, #fff 50%, #fdeded 50%);
}
.calendar-wrap .calendar td.datepicker-selected.datepicker-start a,
.calendar-wrap .calendar td.datepicker-selected.datepicker-end a {
    width: 40px;
    height: 40px;
    background-color: #ec5050 !important;
    color: #fff !important;
    border-radius:50%;
}
.datepicker-start.datepicker-end {background:#fff !important;}

.calendar-wrap .calendar td.datepicker-selected-term { background:#fdeded; }
.calendar-wrap .calendar td.datepicker-selected-term a { background:#fdeded; }

.sr-only {
    overflow: hidden;
    width: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
    position: absolute;
}

/* input {appearance: none;} */

/* 레이어 */
.layer{position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: 10000;display: flex;max-height:inherit;background-color: rgba(0,0,0, .4);align-items: center;justify-content: center; }
.layer>*{width: 1100px; max-height: 90%; background-color: #fff;}
.layer-header{display: flex; height: 76px; padding:0 20px 0 30px; align-items: center; justify-content: space-between; background-color: #37b7b5; font-size: 21px; color: #fff;}

/* .btn-close { --bs-btn-close-bg: unset; } */
.btn-close{overflow:hidden; position: relative; width:14px; height:14px; background-color: transparent; color: transparent; border: 0; cursor: pointer; margin-top:10px; padding:0 !important; }
.btn-close:before,
.btn-close:after{content:''; position: absolute; top: 50%; left: 50%; width: 100%; height:1px; background-color: #000; transform-origin: center; transform:translateX(-50%)}
.btn-close:before{transform:translateX(-50%) rotate(45deg)}
.btn-close:after{transform:translateX(-50%) rotate(-45deg)}

.btn-up{overflow:hidden; position: relative; width: 30px; height: 30px; background-color: transparent; color: transparent; border: 0; cursor: pointer;}
.btn-up:before,
.btn-up:after{content:''; position: absolute; top: 50%; left: 50%; width: 60%; height: 2px; background-color: #fff; margin-top: -1px; transform-origin: center; transform:translateX(-50%)}
.btn-up:before{transform: translateX(-10%) rotate(45deg);}
.btn-up:after{transform: translateX(-80%) rotate(-45deg);}

.btn-down{overflow:hidden; position: relative; width: 30px; height: 30px; background-color: transparent; color: transparent; border: 0; cursor: pointer;}
.btn-down:before,
.btn-down:after{content:''; position: absolute; top: 50%; left: 50%; width: 60%; height: 2px; background-color: #fff; margin-top: -1px; transform-origin: center; transform:translateX(-50%)}
.btn-down:before{transform: translateX(-10%) rotate(-45deg);}
.btn-down:after{transform: translateX(-80%) rotate(45deg);}

.layer-contents::-webkit-scrollbar{width:5px;}
.layer-contents::-webkit-scrollbar-track{background-color: transparent;}
.layer-contents::-webkit-scrollbar-thumb{border-radius:3px; background-color: rgba(0,0,0, .3);}
.layer-btns{display: flex; column-gap: 10px;}
.layer-btns>*{flex:1; height: 46px; font-size: 19px;}

.rent-layer > div {position: relative; box-sizing: border-box;}
.rent-layer-header {margin: 32px 32px 24px 32px; border-bottom: 1px solid #ebebeb;}
.rent-layer-header > p {font-size: 21px; font-weight: bold; padding-bottom: 20px;}
.rent-layer-header .btn-close{width: 26px; height: 26px; position: absolute; top: 36px; right: 30px;}
.rent-layer-header .btn-close:before,
.rent-layer-header .btn-close:after{background-color: #979797;}
.rent-layer-body {box-sizing: border-box; padding: 0 32px 32px;}

/* 날짜선택 */
.choose-schedule{position: relative; width:856px; border-radius: 20px;  }
.choose-schedule .btn-close {position: absolute; top: -30px; right: -30px; width: 30px; height: 30px; border: 1px solid #fff; border-radius: 50%;} */

.choose-schedule .btn-close:before,
.choose-schedule .btn-close:after{width: 70%; background-color: #fff; height: 1px;}
.calendar-navi{display: flex; width: 730px; margin: 0 auto; justify-content: space-between;}
.calendar-navi>*{position: relative; width: 33px; height: 33px; background: url(./img/icon.png) no-repeat;}
.calendar-navi .btn-prev{background-position: 100% -108px;}
.calendar-navi .btn-next{background-position: 100% -75px;}
.choose-schedule .calendar-wrap{display: flex; width: 730px; margin: 0 auto; padding: 40px 0 14px 0; justify-content: space-between;}
.choose-schedule .calendar-wrap .calendar{flex:1; text-align: center;}
.calendar .year-month{font-size: 18px; text-align: center; color: #000;}
.calendar table{/* width:100%; */ border-spacing:0; margin-top: 21px; border-collapse: collapse; table-layout: fixed;}
.calendar td{height: 44px; font-size: 15px; border: 0; padding: 0;}
/* .calendar th{ font-size: 14px; color: #000; border-bottom:1px solid #f5f5f5; } */
.calendar td>*{width: 100%; height: 30px;}
.calendar td>*.selected{background-color: rgb(139 123 117 / 10%);}
.calendar td>*.selected.start,
.calendar td>*.selected.end{width:30px; background-color: #7c6246; color: #fff;}
.calendar td>*.selected.start{margin-left: calc(100% - 30px); border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.calendar td>*.selected.end{margin-right: calc(100% - 30px); border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.calendar :disabled{color: #c4c4c4;}
.acquisition-return{display: flex; height:100px; padding:20px 50px; justify-content: space-evenly; background-color: #f8f8f8; border-radius: 0 0 20px 20px;}
.acquisition-return>dl{display: flex; flex:1 1 auto; column-gap: 10px}
.acquisition-return dt{font-size: 14px; font-weight: bold; color: #000; line-height:40px; text-align:center; }
.acquisition-return #dp_date {width:180px;height:40px;border:0;background:#ddd;border-radius:10px;margin-right:40px;font-size:16px;line-height:40px;text-align:center;}
.acquisition-return .form-control{width:160px;}
.acquisition-return p{font-size: 12px; margin-top: 7px; color: #979797;}
.acquisition-return select { border:1px solid #ccc; border-radius:10px; width:120px; height:40px; padding:5px 10px; font-size:16px;  }
.choose-schedule .btn_comm {position:absolute; width:240px; height:50px; left:50%; margin:-65px 0 0 -120px; font-size: 16px; background-color:#ec5050; border:0; border-radius:10px; color: #FFF; }
.choose-schedule .calendar-wrap .ui-widget-content {justify-content: center;}
.choose-schedule .calendar-wrap .calendar .ui-datepicker-multi .ui-datepicker-group{margin-top: 10px;}

/* 달력 팝업 체크인/아웃 문구 적용 */
/* .layer.rc-cal .calendar-wrap .calendar td.datepicker-selected.datepicker-start a::after,
.layer.rc-cal .calendar-wrap .calendar td.datepicker-selected.datepicker-end a::after{position: absolute; top: 22px; left: 50%; transform: translateX(-50%); font-size: 11px; color: #7c6246; word-break: keep-all; z-index: 10;}
.layer.rc-cal .calendar-wrap .calendar td.datepicker-selected.datepicker-start a::after { content: '대여';}
.layer.rc-cal .calendar-wrap .calendar td.datepicker-selected.datepicker-end a::after {content: '반납';} */
/* .layer.rc-cal .calendar-wrap .calendar td.ui-datepicker-today a {background:#fff; color:#666 !important; } */
.layer.rc-cal .calendar-wrap .calendar td.ui-datepicker-today a::after { position: absolute; top:20px; left: 50%; transform: translateX(-50%); font-size: 11px; color: #bbb; word-break: keep-all; z-index: 10; content: 'today'; }


/* 캘린더 datepicker 스킨 재정의 */
.ui-widget-content{ border:#ebebeb 1px solid; padding:10px;}
.ui-widget-header{ border:none; background:none; height:32px; }
.ui-datepicker .ui-datepicker-title{ margin:0 8% !important;}

.ui-widget-header .ui-datepicker-year,.ui-widget-header .ui-datepicker-month{ font-size:16px;}
.ui-state-default, .ui-widget-content .ui-state-default{ background:#fff; border:#ebebeb 1px solid; text-align:center; font-size:15px;}

/* .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active{ background:#ec5050; color:#fff !important; border-radius:50%; } */
.ui-state-disabled{ color:#e0e0e0}
.ui-datepicker-calendar { width:92%; margin:15px auto 0 !important;}
.ui-datepicker-calendar th{ color:#808080; font-weight:normal;}

td.ui-datepicker-week-end:nth-child(1) a { color:#ec5050;} /*일요일 */
td.ui-datepicker-week-end:nth-child(7) a { color:#01b3ff;}  /*토요일 */
td.date-holiday a { color:#ec5050 !important; } /* 공휴일 */

.ui-icon, .ui-widget-content .ui-icon {   background-image: url("../img/btn_navi_total.gif") ;}
.ui-icon-circle-triangle-w{background-position:0 0;}
.ui-icon-circle-triangle-e{background-position:-48px 0; right:10px;}
.ui-icon { width:32px; height:32px; text-indent: -99999px; overflow: hidden;}
.ui-state-hover, ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover{ border:none; background:none; }
.ui-datepicker .ui-datepicker-prev{position: absolute; top: 55px; left: 75px; }
/* .ui-datepicker .ui-datepicker-prev-hover{position: absolute; left: 55px; top: 50px;} */

.ui-datepicker .ui-datepicker-next{position: absolute; top:55px; right:60px;}
/* .ui-datepicker .ui-datepicker-next-hover{position: absolute; right:55px; top: 50px;} */
.ui-datepicker .ui-datepicker-next span{left:-5%;}

#filter_slider.ui-widget-content{ padding:0px;}
#ui-datepicker-div{ z-index: 999999 !important; }

.template{ display: none !important; }

/* 레이어 */
.layer { display: block; width:100%; height: calc(var(--vh) * 100); }
.layer .cal-header-mo { position: fixed; width:100%; height:80px; top:0px; padding-top:10px; background:#fff; color:#333; font-size:16px; font-weight:bold; text-align: center; z-index:999999; border-bottom:1px solid #f5f5f5; max-width:430px; left:50%; transform:translate(-50%, 0); }
.layer .cal-header-mo .ui-datepicker-calendar th { font-size:14px; color:#a0a0a0; }
.layer .cal-btn-mo { position: absolute; top:5px; right:15px; z-index:99999; background:#fff; }
.calendar-wrap .ui-widget-content{ width: 100% !important; height: 100%; }
/* .calendar-wrap .calendar td.datepicker-selected-term a:before { content: ""; left: -4px; right: -4px; } */
.ui-datepicker .ui-datepicker-prev{ display:none; }
.ui-datepicker .ui-datepicker-next{ display:none; }

/* 날짜선택 */
.choose-schedule { overflow: scroll; position:fixed; width:100%; height:calc(100% - 230px); top:80px; left:0; border-radius: 0; padding:0px 0 30px; max-width:430px; left:50%; transform:translate(-50%, 0); }
.choose-schedule .btn-close {position: absolute; top: 0; right: 0; width: 20px; height: 20px; border: 1px solid #fff; border-radius: 50%;}
.choose-schedule .btn-close:before,
.choose-schedule .btn-close:after{width: 70%; background-color: #333; height: 1px;}
.calendar-navi{display: flex; width: 90%; margin: 0 auto; justify-content: space-between;}
.calendar-navi>*{position: relative; width: 33px; height: 33px; background: url(./img/icon.png) no-repeat;}
/* .calendar-navi .btn-prev{background-position: 100% -108px;}
.calendar-navi .btn-next{background-position: 100% -75px;} */
.choose-schedule .calendar-wrap{width:100%; margin:0; padding:0; }
.choose-schedule .calendar-wrap .calendar{text-align: center;}
.calendar .year-month{font-size: 18px; text-align: center; color: #000;}
.calendar table{ width:92%; border-spacing:0 10px; margin-top: 21px; border-collapse: separate; table-layout: fixed;}
.calendar th{ height:1px; border:0; }
.calendar td{height: 44px; font-size: 14px; border: 0; padding: 0;}
.calendar td>*{width: 100%; height: 30px;}
.calendar td>*.selected{background-color: rgb(139 123 117 / 10%); }
.calendar td>*.selected.start,
.calendar td>*.selected.end{width:30px; background-color: #7c6246; color: #fff;}
.calendar td>*.selected.start{margin-left: calc(100% - 30px); border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.calendar td>*.selected.end{margin-right: calc(100% - 30px); border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.calendar :disabled{color: #c4c4c4;}

.acquisition-mo-return { position:fixed; bottom:0px; width:100%; height:170px; left:50%; transform:translateX(-50%); background-color: #f5f5f5; max-width:430px; }
.acquisition-mo-return .hm {display: flex;gap: 30px;padding: 5px 5% 10px;}
.acquisition-mo-return .hm dl { display:inline-block; text-align:left; padding:10px 0; font-size: 12px; text-align:center;}
/* .acquisition-mo-return .hm dl:first-child { margin-right:10.8%; } */
.acquisition-mo-return .hm dt {color: #808080;padding: 0 7px 3px 0px;font-size:14px; text-align: center; }
.acquisition-mo-return .hm dt span {margin-left:10px; font-weight:bold; color:#333; font-size:16px; }
.acquisition-mo-return .hm #dp_date {width:100%;padding:0 5px;border:0;background:#ddd;border-radius:7px;font-size:12px;line-height:30px;text-align:center;}
.acquisition-mo-return .hm select { width:100%; height:40px; padding:0 20px; border:1px solid #ccc; border-radius:7px; background: #ffffff url('/images/select_arrow1.png') no-repeat 90% center;  font-size:16px; }
.acquisition-mo-return .btn_comm {width: 90%; height: 54px; background: #EC5050; border-radius: 12px; font-weight: 500; font-size: 17px; line-height: 19px; color: #FFFFFF; margin-left: 5%; border:0; }
.acquisition-mo-return .hm input.input1  { width: 86% !important; height: 35px !important; color: #505050; border: 1px solid #ddd; border-radius: 12px; padding: 1px 8% 1px 3% !important; font-size: 16px; text-align: center; background: #fff url(/images/arrow-down.svg) no-repeat right 12px center; }

.acquisition-return { position: absolute; right: 0; bottom:0; left: 0;width: 100%; background-color: #FFF; border-top: 1px solid #ebe3d9;  padding: 0 20px 80px 20px;}
.acquisition-return>dl { display: table-cell !important; }
.acquisition-return .hm { display: flex; padding-bottom: 60px; }
.acquisition-return .hm dl { min-width: 50%; text-align:left; padding: 8px 18px; font-size: 13px; color: var(--color-lightgray)}
.acquisition-return .hm select { border: 0; width:100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url('../img/ico_arr_d.svg') no-repeat 100% 50% #fff; }

.choose-schedule .calendar-wrap .ui-widget-content {flex-direction: column; justify-content: center;}
.choose-schedule .calendar-wrap .calendar .ui-datepicker-multi .ui-datepicker-group{margin-top: 30px;}

.bi-chevron-left::before {font-weight: 800 !important; font-size : 1.2em; }

/* 상단 검색바 시간분 선택 */
.time-sheet{position:fixed;inset:0;z-index:9999999;display:none;}
.time-sheet.is-open{display:block;}
.time-sheet .sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.4);}
.time-sheet .sheet-panel{position:absolute;left:50%;bottom:0;transform:translate(-50%,100%);width:100%;max-width:420px;max-height:80vh;background:#fff;border-radius:16px 16px 0 0;overflow:hidden;transition:transform .25s ease;z-index:9999999;}
.time-sheet.is-open .sheet-panel{transform:translate(-50%,0);}
.sheet-header{display:flex;align-items:center;justify-content:flex-start;position:relative;padding:20px 20px 15px;border-bottom:1px solid #eee;font-size:15px;font-weight:600;}
.sheet-header h2{font-size:17px;font-weight:600;}
.btn-sheet-close{position:absolute;right:20px;top:27px;transform:translateY(-50%);border:none;background:none;font-size:18px;}
#timeListWrap{position:relative;max-height:70vh;overflow-y:auto;/* -webkit-overflow-scrolling:touch; */z-index:99999999;}
.sheet-body{max-height:none;}
.time-list{list-style:none;margin:0;padding:0;}
.time-list li+li{border-top:1px solid #f2f2f2;}
.time-item{position:relative;display:block;width:100%;text-align:left;padding:18px 25px;font-size:16px;border:none;background:#fff;}
.time-item.is-selected{background:#f5f9ff;color:#36a3c5;}
.time-item.is-selected::after{content:"";position:absolute;right:20px;top:50%;width:10px;height:5px;transform:translateY(-50%) rotate(-45deg);border:solid #63a1ff;border-width:0 0 3px 3px;border-radius:1px;}