/*=================================================
        [User] login.php
=================================================*/
#user-login-body{
    position: relative;

    min-height: 100vh;

    background: url('/front/data/img/app/img_login.svg') center center no-repeat;
    background-size: cover;

    overflow-x: hidden;
}

#user-login-body:not(.iframe) .page-wrap .login-box{
    margin: 0 auto;
}

.gradient-wrap{
    position: absolute;
    top: 0;
    right: 0;

    z-index: -1;
}

.user-login-wrap .large-logo-wrap{
    width: 22.083rem;
    margin: 0 auto 10rem;
    padding-top: 11rem;
}

.user-login-wrap .login-desc{
    margin-top: 1rem;

    font-size: 1.5rem;
    font-weight: 600;
    text-align: center;
    color: #ffffff;
}

#user-login-page .btn-sns{
    position: relative;

    padding: 1.625rem 1.333rem;

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

    background: #ffffff;

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

#user-login-page .btn-sns+.btn-sns{
    margin-top: 1.333rem;
}

#user-login-page .btn-sns[data-type='naver']{
    color: #222222 !important;
}

.icon-sns{
    position: absolute;

    top: 50%;
    left: 1.333rem;

    transform: translateY(-50%);
}

.user-login-wrap .underline-link{
    margin: 2.5rem auto 5rem;
}

/*=================================================
        [User] signup.php
=================================================*/
.user-signup-wrap.pd-box{
    margin: 3.333rem auto 10rem;
}

.user-signup-wrap .work_type_transform{
    display: none;
}

/*=================================================
        [User] signup_complete.php
=================================================*/
.signup-complete-wrap .img-wrap{
    margin-bottom: 2.667rem;
}

.btn-icon{
    position: absolute;

    top: 50%;
    right: 1.333rem;

    transform: translateY(-50%);
}

.btn-icon.driver{
    z-index: 99;
}

.signup-complete-wrap [class*="point-btn"]{
    position: relative;
}

.signup-complete-wrap .point-btn-subprimary.driver{
    color: #930EFF !important;

    background: #F5EAFF;
    border: 1px solid #F5EAFF;
}

.pool-select-wrap .point-btn-primary.driver{
    color: #ffffff !important;

    background: #930EFF;
    border: 1px solid #930EFF;
}

.signup-complete-wrap .tooltip{
    transform: translate3d(-24.167rem, 1.333rem, 0px) !important;
}

.signup-complete-wrap .tooltip-inner{
    width: 26rem;
    max-width: 26rem;
    padding: 1.667rem;

    font-family: "Pretendard", Sans-Serif;
    font-size: 1.167rem;
    text-align: left;
    color: #677078;

    background: #ffffff;
    border-radius: 0.667rem;

    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.123);
}

.signup-complete-wrap .tooltip .arrow{
    display: none;
}

.signup-complete-wrap .underline-link{
    margin: 2.5rem auto 5rem;
}

.signup-complete-wrap .tooltip-inner{
    word-wrap: break-word;
    word-break: keep-all;
}

/*=================================================
        [Main] index.php
=================================================*/
/*****#####===== 네비게이션 =====#####*****/
#main-index-body #gnb[data-type="app"] .gnb-wrap{
    padding: 1rem 0 0.5rem;
}

#main-index-body .user-image-sm{
    width: 2.667rem;
    height: 2.667rem;
}

#main-index-body .user-image-sm::after{
    display: none;

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

    width: 0.667rem;
    height: 0.667rem;

    border: 1px solid #ffffff;
}

#main-index-body .user-image-sm.active::after{
    display: block;
}

#main-index-body .gnb-btn.noti svg{
    margin-top: -0.25rem;
}

/*****#####===== 지도 =====#####*****/
.main-index-wrap .main_map_wrap{
    position: relative;
}

/*****##### 현재 위치 정보 #####*****/
.main-index-wrap .main_map_wrap .current-addr{
    position: absolute;
    top: 2.5rem;
    left: 50%;

    padding: 0.667rem 1.333rem;

    font-weight: 500;

    background: #ffffff;
    border-radius: 2rem;

    transform: translateX(-50%);

    z-index: 99;
}

/*****##### 버튼 #####*****/
.main-index-wrap .btn-func{
    position: absolute;

    padding: 1.167rem;

    background: #ffffff;

    border: none;
    border-radius: 50%;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.16);

    z-index: 99;
}

.main-index-wrap .btn-func.current{
    top: 1.667rem;
    right: 1.333rem;
}

.main-index-wrap .btn-func.refresh{
    bottom: 2.5rem;
    left: 1.333rem;
}

.main-index-wrap .float-write-btn{
    position: absolute;
    bottom: 2.5rem;
    right: 1.333rem;

    z-index: 99;
}

.main-index-wrap .pulse-pin{
    background: #FF0000;
}

.main-index-wrap .pulse-pin-effect{
    background: rgba(255, 0, 0, 0.2);
}

.main-index-wrap .info-overlay-wrap .user-image-sm{
    border: 2px solid #295FF6;
}

.main-index-wrap .info-overlay-wrap .user-image-sm.on{
    border: 2px solid #930EFF;
}

.main-index-wrap .map_container{
    height: calc(100vh - 10.375rem);
}

/*=================================================
        [User] profile.php
=================================================*/
.user-profile-wrap .user-image::after{
    display: none;

    width: 1.667rem;
    height: 1.667rem;
}

.user-profile-wrap .user-image.active::after{
    display: block;
}

.user-profile-wrap .profile-btn{
    display: none;

    margin: 2.083rem 0 0;
}

.user-profile-wrap .underline-link{
    font-size: 1rem;
    font-weight: 400;
}

.user-profile-wrap .pool-wrap .user-detail-wrap,
.user-profile-wrap .pool-wrap .apply-list-wrap{
    display: none;
}

/*=================================================
        [User] profile_pool.php
=================================================*/
#user-profile_pool-page{
    min-height: 100vh;

    background: #fafafa;
}

.profile-pool-wrap .pool-wrap .user-detail-wrap,
.profile-pool-wrap .pool-wrap .apply-list-wrap{
    display: none;
}

/*=================================================
        [User] profile_detail.php
=================================================*/
.profile-detail-wrap .user-info .each-col:not(:last-child){
    margin-right: 0.5rem;
    padding-right: 0.5rem;
}

.profile-detail-wrap .user-info .each-col:not(:last-child)::after{
    content: '';
    display: inline-block;

    position: absolute;
    top: 50%;
    right: 0;

    width: 1px;
    height: 0.833rem;

    background: #dddddd;

    transform: translateY(-50%);
}

.profile-detail-wrap .user-info{
    margin-top: 1.667rem;
}

.profile-detail-wrap .info-item-wrap .img-wrap{
    border-radius: 0.667rem;

    overflow: hidden;
}

/*=================================================
        [pool] lists.php
=================================================*/
#pool-lists-page{
    min-height: 100vh;

    background: #F5F5F5;
}

.pool-lists-wrap .list-top-wrap{
    padding: 1.667rem 1.333rem 0.833rem;

    background: #ffffff;
}

.pool-lists-wrap .sort-wrap .pretty .state label:before,
.pool-lists-wrap .sort-wrap .pretty .state label:after{
    display: none;
}

.pool-lists-wrap .sort-wrap .pretty .state label{
    font-size: 1.167rem;
    text-indent: 0;
    color: #999999;
}

.pool-lists-wrap .sort-wrap .pretty input:checked~.state label{
    color: #295FF6;
}

#main-index-body .form-box.filter-btn,
.pool-lists-wrap .form-box.filter-btn{
    padding: 0;

    border-radius: 2rem !important;
}

#main-index-body .form-box.filter-btn .form-control,
.pool-lists-wrap .form-box.filter-btn .form-control{
    padding: 0.75rem 3rem 0.75rem 1.25rem;

    background: #ffffff;

    border-radius: 2rem !important;
}

.pool-lists-wrap .pool-wrap .type-distance-wrap,
.pool-lists-wrap .pool-wrap .apply-list-wrap{
    display: none;
}

.pool-lists-wrap .btn-func.refresh{
    width: 52px;
    height: 52px;
    bottom: 9rem;
    left: 1.333rem;
}

@media(max-width: 375px){
    .pool-lists-wrap .float-write-btn{
        bottom: 7.75rem;
    }

    .pool-lists-wrap .btn-func.refresh{
        bottom: 7.75rem;
    }
}

.pool-lists-wrap .btn-func{
    position: fixed;

    padding: 1.167rem;

    background: #ffffff;

    border: none;
    border-radius: 50%;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.16);

    z-index: 99;
}

.pool-lists-wrap .btn-func.current{
    top: 1.667rem;
    right: 1.333rem;
}


/*=================================================
        [pool] regular.php
=================================================*/
#pool-regular-page{
    min-height: 100vh;

    background: #F5F5F5;
}

.pool-lists-wrap .list-top-wrap{
    padding: 1.667rem 1.333rem 0.833rem;

    background: #ffffff;
}

.pool-lists-wrap .sort-wrap .pretty{
    margin-right: 0.5rem;
}

.pool-lists-wrap .sort-wrap .pretty .state label:before,
.pool-lists-wrap .sort-wrap .pretty .state label:after{
    display: none;
}

.pool-lists-wrap .sort-wrap .pretty .state label{
    font-size: 1.167rem;
    text-indent: 0;
    color: #999999;
}

.pool-lists-wrap .sort-wrap .pretty input:checked~.state label{
    color: #295FF6;
}

#main-index-body .form-box.filter-btn,
.pool-lists-wrap .form-box.filter-btn{
    padding: 0;

    border-radius: 2rem !important;
}

#main-index-body .form-box.filter-btn .form-control,
.pool-lists-wrap .form-box.filter-btn .form-control{
    padding: 0.75rem 3rem 0.75rem 1.25rem;

    background: #ffffff;

    border-radius: 2rem !important;
}

.pool-lists-wrap .pool-wrap .type-distance-wrap,
.pool-lists-wrap .pool-wrap .apply-list-wrap{
    display: none;
}

.pool-lists-wrap .btn-func.refresh{
    width: 52px;
    height: 52px;
    bottom: 9rem;
    left: 1.333rem;
}

@media(max-width: 375px){
    .pool-lists-wrap .float-write-btn{
        bottom: 7.75rem;
    }

    .pool-lists-wrap .btn-func.refresh{
        bottom: 7.75rem;
    }
}

.pool-lists-wrap .btn-func{
    position: fixed;

    padding: 1.167rem;

    background: #ffffff;

    border: none;
    border-radius: 50%;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.16);

    z-index: 99;
}

.pool-lists-wrap .btn-func.current{
    top: 1.667rem;
    right: 1.333rem;
}



/*=================================================
        [pool] view.php
=================================================*/
.pool-view-wrap .user-profile-item .detail-image{
    display: none;
}

.pool-view-wrap .user-image::after{
    display: none;

    width: 1.667rem;
    height: 1.667rem;
}

.pool-view-wrap .user-image.active::after{
    display: block;
}

.pool-view-wrap .pool-wrap .user-detail-wrap,
.pool-view-wrap .pool-wrap .apply-list-wrap{
    display: none;
}

.pool-view-wrap .list-item-wrap{
    padding: 0;
}

.pool-view-wrap .float-btn-wrap .pool-submit.active{
    display: none;
}

/*=================================================
        [pool] select.php
=================================================*/
#pool-select-page{
    min-height: 90vh;
}

.pool-select-wrap{
    padding-top: 4.167rem;
}

.pool-select-wrap .img-bg{
    position: absolute;
    bottom: 6.667rem;
    right: 0;
}

/*=================================================
        [pool] write.php
=================================================*/
.pool-write-wrap .item-gift{
    margin-bottom: 1rem;
}

.pool-write-wrap .change-wrap .item-price,
.pool-write-wrap .change-wrap .item-gift{
    display: none;
}

.pool-write-wrap .change-wrap .item-price.active,
.pool-write-wrap .change-wrap .item-gift.active{
    display: block;
}

.pool-write-wrap .selectize-input{
    height: auto;
    padding: 1rem;

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

    background: #F8F8F8;

    border: none;
    border-radius: 0.333rem !important;
    box-shadow: none;

    resize: none;
}

.pool-write-wrap .selectize-input.focus{
    box-shadow: none;
}

.pool-write-wrap .selectize-input.full{
    background: #F8F8F8;
}

.pool-write-wrap .selectize-control.multi .selectize-input.has-items{
    padding: 0.75rem 1rem 0.5rem;
}

.pool-write-wrap .selectize-control.multi .selectize-input [data-value]{
    display: inline-block;

    margin-right: 0.25rem;
    padding: 0.333rem 0.667rem;

    font-size: 1.167rem;
    text-shadow: none;
    color: #555555;

    background-color: #e2f6f8;
    background-image: none;

    border: none;
    border-radius: 0.333rem;
    box-shadow: none;
}

.pool-write-wrap .selectize-control.plugin-remove_button .item .remove{
    margin-left: 0;

    border-left: none;
}

/*=================================================
        [chat] lists.php
=================================================*/
.chat-lists-item .lists-item{
    padding: 1.333rem;
}

.chat-lists-item .profile-img{
    width: 4rem;
    height: 4rem;
}

.chat-lists-item .item-content{
    word-wrap: break-word;
    word-break: break-all;
}

.chat-lists-item .lists-item .item-badge{
    width: 1.833rem;
    height: 1.833rem;

    background: #FF0000;
}

.chat-lists-item .lists-item .badge{
    font-size: 1rem;
}

.chat-lists-item .lists-item.active{
    pointer-events: none;
}

.chat-lists-item .lists-item.active .item-title{
    color: #999999;
}

.chat-lists-item .lists-item.active .item-content{
    position: relative;

    color: #999999;
}

.chat-lists-item .lists-item.active .item-content:after{
    content: '탈퇴회원';
    position: absolute;
    top: 0;
    right: 0;

    padding: 0 0.5rem;

    font-size: 0.5rem;
    color: #ffffff;

    background-color: #999999;
    border-radius: 0.333rem;
}

/*=================================================
        [chat] room.php
=================================================*/
#chat-room-page {
    padding: 0;
}

#chat-room-page .pool-wrap .user-detail-wrap,
#chat-room-page .pool-wrap .type-distance-wrap,
#chat-room-page .pool-wrap .apply-list-wrap,
#chat-room-page .pool-wrap .date-wrap{
    display: none;
}

#chat-room-page .list-item-wrap{
    padding: 1rem 0 0;
}

#chat-room-page .gnb-wrap[data-type="chat"] .btn-wrap{
    padding: 1.5rem 0;

    border-top: 1px solid #E3E3E3;
}

#chat-room-page .noti-btn{
    padding: 0.75rem;

    background: #F5EAFF;
    border-radius: 50%;
}

#chat-room-page #gnb-wrap .user-image-sm{
    width: 2.667rem;
    height: 2.667rem;
    margin-right: 1rem;

    border-radius: 100%;
}

.chat_wrap .message_wrap{
    height: calc(100vh - 15.5rem);
    padding: 0 1.333rem;
    overflow-y: scroll;
}

.chat_wrap[data-direct="true"] .message_wrap{
    height: calc(100vh - 10.5rem);
}

.send_text_wrap {
    padding: 1.333rem 0;
}

.date_divider{
    color: #cccccc;
}

.date_divider > span{
    background: #E9F0FF;
}

.date_divider::before{
    background-color: #cccccc;
}

.chat_bubble_wrap.my_chat .user-image{
    display: none;
}

.chat_bubble_wrap .bubble_text{
    padding: 0.667rem 0.833rem;

    font-size: 1.167rem;
}

.chat_bubble_wrap .bubble_date {
    color: #999999;
}

.send_text{
    width: calc(100% - 4rem);
    padding: 1rem;

    background-color: #f8f8f8;
    border-color: #f8f8f8;
}

.send_text_wrap.disabled .send_text{
    background-color: #E3E3E3
}

.send_text_wrap.disabled .send_text:focus{
    border: 1px solid #E3E3E3;
}

#chat_room .collapse_btn[aria-expanded="true"] span.front{
    display: none;
}

#chat_room .collapse_btn[aria-expanded="false"] span.back{
    display: none;
}
/*=================================================
        [notification] lists.php
=================================================*/
/*****#####===== 알림리스트 =====#####*****/
.noti-lists-wrap .lists-content-wrap{
    position: relative;
}

/*****##### 제목, 내용 #####*****/
.noti-lists-wrap .lists-content-wrap .noti-title,
.noti-lists-wrap .lists-content-wrap .noti-content{
    color: #999999;
}

/*****##### : .active #####*****/
.noti-lists-wrap .lists-content-wrap.active .noti-title{
    padding-left: 3.5rem;

    color: #222222;
}

.noti-lists-wrap .lists-content-wrap.active .noti-content{
    color: #222222;
}

/*=================================================
        [Admin] login.php
=================================================*/
#admin_login .form-control{
    padding: 0.417rem 0.75rem;

    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;

    background-color: #ffffff;
    border: 1px solid #ced4da;
    border-radius: 0.25rem !important;
}

#admin_login .form-group{
    margin-bottom: 1rem;
}


#maps-index-page .pulse-pin{
    background: #FF0000;
}

#maps-index-page .pulse-pin-effect{
    background: rgba(255, 0, 0, 0.2);
}

#maps-index-page .info-overlay-wrap .user-image-sm{
    border: 2px solid #295FF6;
}

#maps-index-page .info-overlay-wrap .user-image-sm.on{
    border: 2px solid #930EFF;
}
