/*****#####===== 프로젝트 가로스크롤 제거 =====#####*****/
html{
    overflow-x: hidden
}

/*=================================================
			전체
=================================================*/
#loading {
    position: fixed;
    top: 0;
    left: 0;

    width: 100vw;
    height: 100vh;

    background-color: #FFFFFF;
    opacity: 0.7;
    z-index: 9999;
}

/*=================================================
            REM 설정
=================================================*/
@import url('https://fastly.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

html, body{
    position: relative;

    font-family: "Pretendard", Sans-Serif;
    font-size: 16px;
    font-weight: 400;
    color: #222222;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** lg *****/
@media (min-width: 992px) and (max-width: 1199.98px){
    html:not(.iframe),
    body:not(.iframe){
        font-size: 14px;
    }
}
/***** md *****/
@media (min-width: 768px) and (max-width: 991.98px){
    html:not(.iframe),
    body:not(.iframe){
        font-size: 13px;
    }
}
/***** sm *****/
@media (min-width: 576px) and (max-width: 767.98px){
    html:not(.iframe),
    body:not(.iframe){
        font-size: 12px;
    }
}
/***** xs *****/
@media (min-width: 100px) and (max-width: 575.98px) {
    html:not(.iframe),
    body:not(.iframe){
        font-size: 12px;
    }
}

/*=================================================
			텍스트 설정
=================================================*/
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
    margin: 0;
}

h1,.h1{
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.56em;
}

h2,.h2{
    font-size: 1.667rem;
    font-weight: 700;
    line-height: 1.58em;
}

h3,.h3{
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.6em;
}

h4,.h4{
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.6em;
}

h5,.h5{
    font-size: 1.167rem;
    font-weight: 500;
    line-height: 1.56em;
}

h6,.h6{
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.63em;
}

.display-1{
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.57em;
}

.display-2{
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.5em;
}

.bold{
    font-weight: 700;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** md *****/
@media (min-width: 100px) and (max-width: 767px) {
    h1,.h1{
        font-size: 2rem;
        line-height: 2.08em;
    }

    h2,.h2{
        font-size: 1.667rem;
        line-height: 1.56em;
    }

    h3,.h3{
        font-size: 1.333rem;
        line-height: 1.63em;
    }

    h4,.h4{
        font-size: 1.333rem;
        line-height: 1.63em;
    }

    h5,.h5{
        font-size: 1.167rem;
        line-height: 1.57em;
    }

    h6,.h6{
        font-size: 1rem;
        line-height: 1.5em;
    }

    .display-1{
        font-size: 0.833rem;
        font-weight: 500;
        line-height: 1.57em;
    }

    .display-2{
        font-size: 1rem;
        font-weight: 700;
        line-height: 1.5em;
    }
}

/*=================================================
			버튼, 색 설정
=================================================*/
/*****#####===== 솔루션 =====#####*****/
.point-color-primary{color: #295FF6;}
.point-color-primarylight{color: #E1E7F8;}
.point-sub-dark{color: #222222;}
.point-sub-middle{color: #555555;}
.point-sub-light{color: #999999;}
.point-sub-warning{color: #ff0000;}

.point-btn-primary{
    color: #ffffff !important;

    background-color:#295FF6;
    border: 1px solid #295FF6;
}

.point-btn-purple{
    color: #ffffff !important;

    background-color: #8907cc;
    border: 1px solid #8907cc;
}

.point-btn-sub{
    color: #ffffff !important;

    background-color: #E3E3E3;
    border: 1px solid #E3E3E3;
}

.point-btn-subprimary{
    color: #295FF6 !important;

    background-color: #E9F0FF;
    border: 1px solid #E9F0FF;
}

.point-btn-lightprimary{
    color: #295FF6 !important;

    background-color: transparent;
    border: 1px solid #295FF6;
}

.point-btn-cancel{
    color: #FF0000 !important;

    background-color: transparent;
    border: 1px solid #FF0000;
}

.point-btn-certify{
    color: #ffffff !important;

    background-color: #6653E3;
    border: 1px solid #6653E3;
}

[class*="point-btn"]{
    padding: 1.5rem;

    font-size: 1.333rem;
    font-weight: 500;
    line-height: 1em;
    text-align: center;

    border-radius: 0.667rem;
}

[class*="point-btn"].btn-middle{
    padding: 1.125rem;

    font-size: 1.167rem;
    font-weight: 500;
}

[class*="point-btn"].btn-small{
    padding: 1.25rem 0.833rem;
}

.btn-block+.btn-block{
    margin-top: 1rem;
}

/*=================================================
        [Common] 공통
=================================================*/
/*****#####===== 페이지 =====#####*****/
.page-wrap{
    padding: 0;
}

.pd-box{
    margin: 0 0 3.333rem;
}

.mg-lg-box{
    margin: 1.125rem 0 10rem;
}

/*****#####===== 폼 설정 =====#####*****/
.form-control{
    padding: 1rem 1.25rem;

    color: #222222;

    background: #F8F8F8;

    border: 1px solid #F8F8F8;
    border-radius: 0.667rem !important;
}

.form-control:focus{
    color: #222222;

    background: #F8F8F8;

    border: 1px solid #295FF6;
}

.form-control[readonly],
.form-control[readonly]:focus{
    color: #a5a5a5;

    background-color: #F8F8F8;

    border: 1px solid #F8F8F8;
}

input[type='date'], input[type='time'] {
    -webkit-appearance: none;
}

/*****##### 셀렉트 박스 #####*****/
.form-box,
.srch-box{
    position: relative;

    background: #F8F8F8;

    border: 1px solid #F8F8F8;
    border-radius: 0.667rem !important;

    transition: border .25s;
}

.form-box:focus-within,
.srch-box:focus-within{
    background: #F8F8F8;

    border: 1px solid #295FF6;

    transition: border .25s;
}

.form-box::after{
    content: '';
    display: inline-block;

    position: absolute;
    top: 50%;
    right: 1rem;

    width: 2rem;
    height: 2rem;

    background: url(/front/data/img/component/arrow_select.svg) center center no-repeat;
    background-size: contain;

    transform: translateY(-50%);
}

select.form-custom{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

select.form-custom option:disabled{
    display: none;
}

.form-title{
    margin-bottom: 0.75rem;

    font-size: 1.167rem;
    color: #222222;
}

.form-title.select .select-text{
    display: inline-block;
}

.form-title .select-text{
    font-size: 1rem;
    font-weight: 500;
    color: #295FF6;
}

/*****##### 검색 #####*****/
.srch-box{
    padding: 0.667rem;
}

.srch-box .form-control{
    padding: 0 0.75rem;
}

.srch-box .form-control:focus{
    border: 1px solid #F8F8F8;
}

/*****##### 설명 문구 #####*****/
.desc-wrap{
    color: #555555;
}

.desc-wrap .item-img{
    margin-right: 0.333rem;
}

/*****##### 텍스트형 단일 형태(single) #####*****/
[class*="form-dropzone"][data-type="text"] .dropzone .dz-message{
    padding: 1rem;

    color: #999999;

    background: #fafafa;
    border: 1px dashed #E3E3E3;
}

[class*="form-dropzone"][data-type="text"] .dz-preview .dz-details{
    padding: 0.875rem 0.875rem 0.5rem;
}

[class*="form-dropzone"][data-type="text"] .dz-preview .dz-remove{
    transform: translateY(-35%);
}
/*****##### 이미지형 단일 형태(single) #####*****/
.form-dropzone-single[data-type="image"] .dropzone{
    border: none;
}

.form-dropzone-single[data-type="image"] .dropzone .dz-message{
    width: 8.917rem;
    height: 8.917rem;

    background: #d9d9d9;

    border-radius: 0.667rem;
}

.form-dropzone-single[data-type="image"] .dz-preview .dz-image{
    width: 8.917rem;
    height: 8.917rem;

    border-radius: 0.667rem;
}

.form-dropzone-single[data-type="image"] .dz-preview .dz-remove{
    top: 0.5rem;
    right: 0.5rem;

    background: url('/front/data/img/component/icon_dz_remove.svg') center center no-repeat;
}

/*****##### 이미지형 복수 형태(multi) #####*****/
.form-dropzone-multi[data-type="image"] .dz-preview .dz-remove{
    background: url('/front/data/img/component/icon_dz_remove.svg') center center no-repeat;
}

/*****#####===== 버튼 =====#####*****/
.srch-btn{
    padding: 0.667rem;

    background: #295FF6;

    border-radius: 0.833rem;
}

.filter-btn{
    display: inline-block;

    padding: 0.667rem 0.667rem 0.667rem 1rem;

    font-size: 1.167rem;
    font-weight: 500;

    border: 1px solid #E3E3E3;
    border-radius: 2rem;
}

.sort-btn{
    padding: 0;

    font-size: 1.167rem;
    color: #999999;

    background: transparent;
    border: none;
}

.sort-btn.active{
    color: #295FF6;
}

.sort-btn:not(:last-child){
    margin-right: 1rem;
}

.change-btn{
    padding: 0.25rem;

    background: #E3E3E3;
    border-radius: 0.833rem;
}

.attend-btn{
    display: inline-block;

    margin: 1rem auto 0;
    padding: 0.708rem 1rem;

    font-size: 1.167rem;
    font-weight: 500;
    color: #ffffff;

    background: #295FF6;

    border: none;
    border-radius: 2rem;
}

.attend-btn.disabled{
    background: #E3E3E3;
}

.attend-btn:hover,
.attend-btn:focus{
color: #ffffff;
}

.float-write-btn{
    position: fixed;
    bottom: 9rem;
    right: 1.333rem;

    padding: 1.167rem;

    background: #295FF6;

    border-radius: 3rem;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.16);
}

/*****#####===== svg =====#####*****/
.svg-wrap{
    display: block;
}

.svg-wrap svg{
    margin-top: -0.25rem;
}

.caution-svg-wrap{
    display: block;
}

.caution-svg-wrap svg{
    width: 100%;
    height: 100%;
}


/*****#####===== 밑줄 타이틀 =====#####*****/
.underline-title-wrap{
    margin-top: 4.167rem;
    padding-bottom: 1rem;

    border-bottom: 1px solid #E3E3E3;
}

.underline-title-wrap .underline-title{
    font-size: 2.167rem;
    font-weight: 700;
}

/*****#####===== 밑줄 링크 =====#####*****/
.underline-link{
    display: block;

    font-size: 1.167rem;
    font-weight: 500;
    text-align: center;
    text-decoration: underline;
    color: #999999 !important;
}

/*****#####===== 뷰 타이틀 =====#####*****/
.view-title-wrap {
    padding: 0 0 1.333rem;
}

/*****#####===== 알림리스트 new 뱃지 =====#####*****/
.noti-lists-wrap .lists-content-wrap::after{
    display: none;

    content: 'NEW';
    position: absolute;
    top: 1.5rem;
    left: 1.333rem;

    padding: 0.1rem 0.42rem 0.15rem;

    font-size: 1rem;
    font-weight: 500;
    color: #ffffff;

    background-color: #ff0000;
    border-radius: 2rem;
}

.noti-lists-wrap .lists-content-wrap.active::after{
    display: block;
}

/*****#####===== 알림 내용 =====#####*****/
.noti-content{
    color: #555555;
}

.checked .noti-title,
.checked .noti-content{
    color: #999999;
}

/*****#####===== 프로필 이미지 =====#####*****/
.user-image{
    position: relative;
}

.user-image-sm{
    position: relative;

    width: 4rem;
    height: 4rem;
}

.user-image-md{
    display: inline-block;

    width: 6.667rem;
    height: 6.667rem;

    border-radius: 100%;
}

.user-image::after,
.user-image-sm::after{
    content: '';
    display: none;

    position: absolute;

    background: #35EDAB;

    border-radius: 50%;
}

.user-image.active::after,
.user-image-sm.active::after{
    display: inline-block;
}

.user-image::after{
    display: none;

    right: 0.25rem;
    bottom: 0.25rem;

    width: 1.333rem;
    height: 1.333rem;

    border: 3px solid #ffffff;
}

.user-image.active::after{
    display: block;

    right: 0.25rem;
    bottom: 0.25rem;

    width: 1.333rem;
    height: 1.333rem;

    border: 3px solid #ffffff;
}

.user-image-sm::after{
    display: none;

    right: -0.125rem;
    bottom: -0.125rem;

    width: 1.167rem;
    height: 1.167rem;

    border: 2px solid #ffffff;
}

.user-image-sm.active::after{
    display: block;

    right: -0.125rem;
    bottom: -0.125rem;

    width: 1.167rem;
    height: 1.167rem;

    border: 2px solid #ffffff;
}

/*****#####===== 유저 리뷰 =====#####*****/
.user-review{
    font-size: 0.833rem;
    font-weight: 400;
}

/*****#####===== 유저 타입(레벨) =====#####*****/
.user-type{
    display: inline-block;

    padding: 0.333rem 0.667rem;

    font-size: 1rem;
    font-weight: 400;
    line-height: 1em;
    color: #295FF6;

    background: #E9F0FF;
    border-radius: 2rem;
}

.user-type.driver{
    color: #930EFF;

    background: #F5EAFF;
}

/*****##### 태그 #####*****/
.tag-item{
    margin-bottom: 0.5rem;

    font-size: 1rem;
    font-weight: 400;
    color: #222222;

    background: #fafafa;
}

.tag-item:not(:last-child){
    margin-right: 0.25rem;
}

.tag-item.pool{
    background: #E9F0FF;
}

.tag-item.gift{
    background: #F5EAFF;
}

/*****#####===== 약관 =====#####*****/
.every-terms-wrap{
    border: 1px solid #dddddd;
}

.all-terms-wrap{
    border-bottom: 1px solid #dddddd;
}

/*****#####===== 리스트 =====#####*****/
.list-wrap{
    padding: 1.667rem 0;
}

/*****#####===== 컨텐츠 리스트 =====#####*****/
.content-list-wrap{
    padding: 2.5rem 0;
}

/*****#####===== 컨텐츠 리스트 =====#####*****/
.empty-icon{
    margin-bottom: 2.333rem;
}

/*****##### 회색 배경 #####*****/
.content-list-wrap.gray{
    background: #fafafa;
}

.list-item-wrap{
    padding: 1rem;

    background: #ffffff;
    border-radius: 1rem;
}

.list-item-wrap:not(:last-child){
    margin-bottom: 1rem;
}

/*****#####===== 컨텐츠 아이템 =====#####*****/
.content-item-wrap{
    padding: 2.5rem 0;
}

/*****##### 리뷰 항목 #####*****/
.review-item-wrap{
    margin-bottom: 1.333rem;
}

/*****##### 정보 항목 #####*****/
.info-item-wrap:not(:last-child){
    margin-bottom: 0.625rem;
}

.info-item-wrap .info-title{
    width: 10rem;
}

/*****##### 유저 정보 영역 #####*****/
[data-type="app"] .user-info-box{
    background: #E9F0FF;
    border-radius: 0.833rem;
}

[data-type="app"] .user-info-box .each-col:not(:last-child){
    border-right: none;
}

/*****#####===== 탭메뉴 =====#####*****/
.tab-menu{
    border-bottom: 1px solid #dddddd;
}

.tab-menu .tab-item.active{
    color: #222222;

    border-bottom: 2px solid #222222;
}

/*****#####===== 카드 아이템 =====#####*****/
.app-card-item{
    border-radius: 0.833rem;
}

/*****#####===== empty-wrap =====#####*****/
.empty-wrap{
    border-bottom: none;
}

/*=================================================
			드로워
=================================================*/
.drawer-alert .drawer-footer{
    padding: 2rem 1.333rem;
}

#select_drawer .select_confirm_btn{
    border-radius: 0.833rem;
}

/*****#####===== 카카오 주소 =====#####*****/
.drawer-alert.show {
    max-height: 61%;
}

/*=================================================
			알럿
=================================================*/
/*****#####===== 신고하기 =====#####*****/
.fancy-alert .alert-incomplete-content-wrap{
    padding: 2rem 0;
    font-size: 1.167rem;
}

.fancy-alert .alert-incomplete-content-wrap .item-list:not(:last-child){
    margin-bottom: 1.333rem;
}

/*****#####===== 토스트 알럿 =====#####*****/
.component-wrap[data-comp="toast"] .toast-wrap {
    position: fixed;
    bottom: 6.333rem;
    left: 50%;

    min-width: 24.167rem;
    padding: 1rem;

    text-align: center;
    color: #ffffff;

    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 3.333rem;

    transform: translateX(-50%);
    z-index: 999;
}

/*=================================================
			네비게이션
=================================================*/
#gnb[data-type="app"] .gnb-wrap{
    box-shadow: none;
}

/*****#####===== 메인 네비 =====#####*****/
.gnb-wrap .user-type{
    padding: 0.5rem 0.75rem 0.5rem 0.875rem;
}

.gnb-wrap .user-type svg{
    margin: -0.125rem 0.25rem 0 0;
}

.gnb-wrap .filter-btn{
    padding: 0.333rem 0.5rem 0.333rem 1rem;
}

.gnb-wrap .gnb-btn{
    padding-left: 0.5rem;

    font-size: 1.25rem;
    color: #999999;
    font-weight: 500;
}

/*****##### 알림 버튼 #####*****/
.gnb-wrap .gnb-btn[data-type="noti"]{
    position: relative;
}

.gnb-wrap .gnb-btn[data-type="noti"] .active-num{
    display: none;
}


/*****##### : .active #####*****/
.gnb-wrap .gnb-btn[data-type="noti"].active .active-num{
    display: block;
    position: absolute;
    top: 0;
    right: 0;

    width: 1.375rem;
    height: 1.375rem;

    background: #ff0000;
    color: #ffffff;

    text-align: center;

    border-radius: 1rem;

    transform: translate(25%,-50%);

    font-size: 0.875rem;
}

/*****#####===== 서브 네비 (뒤로가기 포함) =====#####*****/
.gnb-wrap[data-type="sub"] .gnb-title{
    position: relative;
    top: 0;
    left: 0;

    transform: translate(0, 0);
}

.gnb-wrap .back-btn{
    margin-right: 1.667rem;
}

.gnb-wrap .back-btn svg{
    margin-top: -0.25rem;
}

/*=================================================
        [Common] pretty
=================================================*/
.pretty.p-default .state label{
    line-height: 1rem;
    text-indent: 2.333em;
}

.pretty.p-default .state label:after,
.pretty.p-default .state label:before{
    top: calc((0% - (100% - 1.625em)) - 8%);

    width: calc(1em + 10px);
    height: calc(1em + 10px);

    border: none;
}

.pretty.p-default .state label:before{
    background: url('/front/data/img/app/pretty_off.svg') center center no-repeat;
    background-size: contain;
}

.pretty.p-default input[type="radio"]:checked~.state label:after,
.pretty.p-default input:checked~.state label:after{
    background-color: transparent !important;
}

.pretty.p-default input:checked~.state label:before{
    background: url('/front/data/img/app/pretty_on.svg') center center no-repeat;
    background-size: contain;
}

.pretty.p-switch.p-fill input:checked~.state label:after{
    left: 0.875em;
}

/*=================================================
        [Component] user_profile_wrap.php
=================================================*/
/*****#####===== 프로필 이미지 =====#####*****/
.user-profile-item .user-image{
    position: relative;

    width: 7rem;
    height: 7rem;
}

/*****#####===== 상세 이미지 =====#####*****/
.user-profile-item .detail-image{
    position: absolute;
    top: 50%;
    right: -3.5rem;

    padding: 0.417rem 0.677rem;

    font-weight: 400;
    color: #ffffff;

    background: #295FF6;
    border-radius: 2rem;

    transform: translateY(-50%);
}

/*****#####===== 회원명 =====#####*****/
.user-profile-item .user-title{
    font-size: 1.667rem;
    font-weight: 700;

    margin: 1rem 0 0.125rem;
}

/*=================================================
        [Component] pool_wrap.php
=================================================*/
/*****#####===== 회원정보 =====#####*****/
.pool-wrap .user-image-sm{
    width: 4.583rem;
    height: 4.583rem;
}

/*****#####===== 상태 =====#####*****/
.pool-status{
    font-size: 1.333rem;
    font-weight: 700;
    color: #295FF6;
}

/*****#####===== 회원명 =====#####*****/
.pool-wrap .user-title{
    font-size: 1.333rem;
    font-weight: 600;
}

/*****#####===== 카풀 정보 =====#####*****/
.pool-wrap .pool-info{
    margin: 0.833rem 0 1.333rem;
    padding: 1rem;

    background: #F8F8F8;
    border-radius: 0.667rem;
}

/*****##### 출발지 / 도착지 #####*****/
.pool-info .info-item:not(:last-child){
    margin-bottom: 1rem;
}

.pool-info .info-item .item-icon{
    display: inline-block;

    position: relative;

    width: 0.667rem;
    height: 0.667rem;

    background: #295FF6;
    border-radius: 50%;
}

.pool-info .info-item:not(:last-child) .item-icon{
    background: #F8F8F8;
    border: 1px solid #295FF6;
}

#pool-latest-page .pool-info .info-item:not(:last-child) .item-icon::after{
    height: 4.2rem;
}

.pool-info .info-item:not(:last-child) .item-icon::after{
    content: '';
    display: inline-block;

    position: absolute;

    width: 1px;
    height: 4rem;

    background: #295FF6;

    z-index: 0;
}

.pool-info .info-item:last-child .item-icon::before{
    content: '';
    display: inline-block;

    position: absolute;

    left: 50%;
    top: 0.75rem;

    width: 5px;
    height: 4rem;

    background: #F8F8F8;
    transform: translateX(-50%);

    z-index: 1;
}

#pool-latest-page .pool-info .info-item:last-child .item-icon::before{
    height: 1rem;
}


.pool-info .info-item:not(:first-child) .item-icon::after{
    top: -2rem;
    left: 0.21rem;
}

.pool-info .info-item:not(:last-child) .item-icon::after {
    top: 100%;
    left: 50%;

    transform: translateX(-50%);
}

/*****##### 예상 택시비 #####*****/
.pool-info .info-item .taxi-price{
    margin-top: 1rem;
    padding-left: 1.5rem;

    font-weight: 400;
    color: #999999;
}

/*****##### 태그  #####*****/
.date-wrap{
    font-weight: 400;
    color: #999999;
}

/*****#####===== 신청 리스트 =====#####*****/
.apply-list-wrap{
    margin-top: 1.667rem;
}

.apply-list-wrap[aria-expanded="true"] .collapse-icon{
    transform: rotate(180deg);
}

.apply-list-wrap .item-wrap{
    padding: 0.5rem 0;
}

/*=================================================
        [Component] review_item.php
=================================================*/
.apply-list-wrap .item-wrap{
    padding: 0.5rem 0;
}

/*=================================================
        [Component] float_menu.php
=================================================*/
#float-menu{
    padding: 1.125rem 0.5rem 1.5rem;

    border-radius: 0;
    box-shadow: -4px 0px 20px rgba(0, 0, 0, 0.082);
}

#float-menu .item-wrap .item-icon.warp{
    width: 6.083rem;
    height: 6.083rem;
    margin-top: -3rem;
}

#float-menu .item-link.active .item-title {
    color: #295FF6;
}

#float-menu .item-link{
    text-align: center;
}

#float-menu .item-link .item-title{
    text-wrap: 500;
    color: #999999;
}

#float-menu .item-link .item-icon{
    position: relative;
    overflow: hidden;
    margin-bottom: 0.417rem;
}

#float-menu .item-icon .icon-badge{
    position: absolute;
    display: inline-block;
    padding: 2px 6px;
    top: 0;
    left: calc(50% + 2px);

    background-color: #FF0000;
    border-radius: 10px;

    font-weight: 400;
    font-size: 12px;
    line-height: 12px;
    color: #ffffff;
}

#float-menu .item-link .icon-active{
    display: none;
}

#float-menu .item-link.active .icon{
    display: none;
}

#float-menu .item-link.active .icon-active{
    display: inline-block;
}

#route_drawer .route-wrap{
    display: none;
}

#route_drawer.show{
    max-height: 85%;
}

#route_drawer .route-wrap.show{
    display: block;
    height: 100%;
}

#route_drawer .route_map_wrap > .d-flex{
    height: 100%;
}

#route_drawer .map_wrap {
    flex: 1;
}

.map_container{
    height: 85vh;
}

#route_drawer .map_container{
    height: 100%;
}

#route_drawer .info-wrap{
    height: 16rem;
}

#route_drawer .btn-wrap{
    padding: 0 1.333rem;
}

#route_drawer .map_address{
    padding: 1.333rem;

    background: #fff;
}

#route_drawer .display_address{
    margin-bottom: 0.333rem;

    font-size: 1.333rem;
    font-weight: 700;
}

#route_drawer .roadname,
#direction_write .roadname{
    display: inline-block;

    margin-right: 0.333rem;
    padding: 0.333rem 0.5rem;

    color: #414860;

    background: #e6e6e6;
    border-radius: 0.333rem;
}

#route_drawer .address_name,
#direction_write .address_name{
    display: inline-block;

    font-size: 1.167rem;
    color: #7d7f97;
}

#route_drawer .btn-wrap{
    position: relative;
}

/*=================================================
        [Mypage] setting.php
=================================================*/
.user-setting-wrap .menu-list-wrap .item-ver-latest,
.user-setting-wrap .menu-list-wrap .item-ver-old{
    display: none;
}

.user-setting-wrap .menu-list-wrap .item-ver-latest.active,
.user-setting-wrap .menu-list-wrap .item-ver-old.active{
    display: block;
}

.ads-banner-warp{
    margin-top: 0.75rem;
    border-radius: 1rem;

    overflow: hidden;
}

.custom-popup-wrapper{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    background-color: rgba(0,0,0,0.8);

    z-index: 3000;
}

.custom-popup-wrapper .custom-popup-wrap{
    position: absolute;
    top: 50%;
    left: 50%;

    width: 280px;

    transform: translate(-50%,-50%);
}

.custom-popup-wrapper.hide{
    display: none;
}

.custom-popup-wrapper .popup-btn-wrap{
    margin-top: 0.5rem;
    color: #ffffff;

    font-size: 1rem;
}

.custom-popup-wrapper .popup-btn-wrap button{
    font-size: 1rem;
}

.custom-popup-wrapper .popup-image{
    border-radius: 1rem;

    overflow: hidden;
}

#pool-latest-page .underline-title-wrap {
    margin-top: 2.167rem;
}

.pool_road_lists_btn{
    font-size: 1rem !important;
}


.pretty.p-active {
    display: block;

    width: 100%;
}

.pretty.p-active input~.state label {
    display: block;

    width: 100%;
    padding: 0.625rem 0;

    text-align: center;
    text-indent: 0;
    color: #999999;

    border: 1px solid #dddddd;
    border-radius: 0.313rem;
}

.pretty.p-active input:checked~.state label {
    border-color: #295FF6;
}

.pretty.p-active .state label:before,
.pretty.p-active .state label:after {
    display: none;
}


.box-radio-wrap .deposit-radio-item{
    margin-bottom: 1rem;

    font-size: 1.3rem;
}

.box-radio-wrap .deposit-radio-item .item-top svg{
    margin-top: -0.25rem;
}

.user-marker-wrap{
    width: 5rem;
    height: 5rem;
}

.user-marker-wrap img{
    width: 100%;
}

/*****#####===== 댓글/채팅 작성 폼 =====#####*****/
.send-input{
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.571rem;

    padding: 0.375rem 0.75rem;

    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: 0.714rem;
}

.send-input.disabled{
    background-color: #f3f3f3;
}

.send-input.disabled .send-message-wrap,
.send-input.disabled .send-text{
    background-color: #f3f3f3;
}

.send-image-wrap{
    display: none;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;

    margin-bottom: 0.5rem;
}

.send-image-wrap.show{
    display: grid;
}

.send-input .form-control{
    padding: 0.5rem 0;

    border: none;
}

.chat_wrap .send-text-wrap{
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.571rem;

    align-items: center;
}

#chat-room-page .send-input{
    grid-template-columns: auto 1fr auto;
}

#chat-room-page .send-input.disabled{
    grid-template-columns: 1fr;
}


.chat_wrap .chat-upload-btn{
    cursor: pointer;
}

.chat_wrap .send-message-wrap{
    padding: 0;

    background-color: #ffffff;
}

.chat_wrap .send-text{
    background-color: #ffffff;
}

.chat_wrap .btn-send{
    padding: 0.75rem 1.125rem;
}

.btn-remove{
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;

    width: 1.5rem;
    height: 1.5rem;

    text-indent: -999999rem;

    background: url('/img/app/solution/icon_dz_remove.svg') center center no-repeat;
    background-size: contain;
    border: none;

    z-index: 999;
}

.pool-caution-wrap{
    display: flex;
    align-content: center;
    padding: 20px 10px;
    background-color: #E5E5E5;

    gap: 1rem;
}

#point-deposit-page{
    padding-bottom: 130px;
}

.chat-info-btn{
    display: inline-block;
    width: 8rem;
    padding: 0.3rem 0.875rem;
    border-radius: 5px;
    background-color: #f62930;
    color: #ffffff;

    text-align: center;
}

.user-gender{
    display: inline-block;
    width: 1rem;
}

.user-gender svg{
    width: 100%;
    height: 100%;
}