/* 임시 */
#codeigniter_profiler {
    display: none;
}

/*=================================================
            REM 설정
=================================================*/
html, body{
    position: relative;

    font-family: "Spoqa Han Sans Neo", Sans-Serif;
    font-size: 12px;
    font-weight: 400;
    color: #1F1D2B;

    scroll-behavior: smooth;
}

/*****#####===== input number 화살표 버튼 제거 =====#####*****/
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** xl *****/
@media (min-width: 1200px){
    html:not(.iframe),
    body:not(.iframe){
        font-size: 16px;
    }
}
/***** 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: auto;
}

h2,.h2{
    font-size: 1.75rem;
    font-weight: 700;
    line-height: auto;
}

h3,.h3{
    font-size: 1.5rem;
    font-weight: 700;
    line-height: auto;
}

h4,.h4{
    font-size: 1.375rem;
    font-weight: 700;
    line-height: auto;
}

h5,.h5{
    font-size: 1.25rem;
    font-weight: 400;
    line-height: auto;
}

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

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

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

.display-3{
    font-size: 0.625rem;
    font-weight: 400;
    line-height: auto;
}

.gap-3 {
    gap: 0.25rem;
}

.gap-4 {
    gap: 0.333rem;
}

.gap-6 {
    gap: 0.5rem;
}

.bold{
    font-weight:700;
}

/*****#####===== 폰트 =====#####*****/
.font-roboto{
    font-family: 'Roboto';
}

.font-noto{
    font-family: "notokr", Sans-Serif;
}

.font-w500{
    font-weight: 500;
}

.font-w600{
    font-weight: 500;
}

.btn.btn-block {
    padding: 1.167rem 0 !important;
}

/*****#####===== br =====#####*****/
/*****##### 미디어 쿼리 #####*****/
/***** ~ lg *****/
@media (max-width: 1199.98px){
    .d-lg-br br{
        display:none;
    }
}

/***** ~ md *****/
@media (max-width: 991.98px){
    .d-md-br br{
        display:none;
    }
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** lg *****/
@media (min-width: 992px) and (max-width: 1199.98px){
    h1,.h1{
        font-size: 3.2rem;
    }
}

/***** md *****/
@media (min-width: 768px) and (max-width: 991.98px){
    h1,.h1{
        font-size: 3rem;
    }
}

/***** xs / sm *****/
@media (min-width: 100px) and (max-width: 767.98px){
    h1,.h1{
        font-size: 2.75rem;
    }

    .display-1{
        font-size: 1.2rem;
    }

    .display-2{
        font-size: 1.1rem;
    }

    .display-3{
        font-size: 1rem;
    }
}

/*=================================================
            공통
=================================================*/
.page-wrap:not([data-menu="user"]) {
    margin-bottom: 10rem;
    padding: 0;
}

.page-wrap .btn-wrap {
    margin-top: 0;
}

.srch-form-wrap {
    margin-top: 2rem;

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

.srch-form-wrap .form-control {
    background-color: transparent;
    border: none
}

.btn-wrap.float-btn {
    position: fixed;
    bottom: 0;
    left: 0;

    width: 100%;
    padding: 1.333rem;

    background: #FFFFFF;
    border-top: 1px solid #dddddd;
    
    z-index: 999;
}

.btn-wrap.float-btn .price-item {
    margin-bottom: 1rem
}

.btn-wrap.float-btn .item-title {
    font-size: 1.25rem;
    font-weight: 500;
    color: #262C31;
}

.btn-wrap.float-btn .item-title > span {
    font-size: 1rem;
    font-weight: 500;
    text-align: right;
    color: #ADB4BA;
}

.btn-wrap.float-btn .item-value {
    font-size: 1.5rem;
    font-weight: 500;
    color: #104343;
}

.item-title-wrap {
    margin: 2rem 0 1rem 0;
}

.item-title-wrap .item-title {
    font-size: 1.667rem;
    font-weight: bold;
    color: #262C31;
}

.item-title-wrap .item-subtitle {
    font-size: 1.167rem;
    font-weight: 500;
    color: #778088;
}

.item-title-wrap .item-more {
    font-size: 1.167rem;
    font-weight: 500;
    color: #778088;
}

.tag {
    padding: 0.333rem 0.667rem;

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

    background-color: #eeeeee;
    border-radius: 0.167rem;
}

.tag.tag-rsrv {
    color: #104343;

    background-color: #bae3db;
}

.tag.tag-visit {
    color: #9e5a87;

    background-color: #eed9e7;
}

.tag.tag-call {
    color: #4e4eae;

    background-color: #d9d9ee;
}

.lists-wrap .lists-item {
    padding: 1.333rem 0;

    font-size: 1.333rem;
    font-weight: 500;
    color: #222222;

    background-color: #ffffff;
    border-bottom: 1px solid #dddddd;
}

.underline {
    border-bottom: 6px solid #F2F4F5;
}

/*****#####===== swiper =====#####*****/
.swiper-wrap .swiper-pagination-bullet {
    width: 0.5rem;
    height: 0.5rem;

    background-color: #ADB4BA;
    border-radius: 0.667rem;

    opacity: 1;

    transition: color, width 0.25s;
}

.swiper-wrap .swiper-pagination-bullet-active {
    width: 1.333rem;

    background-color: #104343;
}

/*****#####===== slick =====#####*****/
.slick-wrap .slick-dots li {
    width: 0.667rem;
    height: 0.667rem;

    transition: width 0.25s;
}

.slick-wrap .slick-dots li > button {
    background-color: transparent;
    border-radius: 0.667rem;
    border: 1px solid #cccccc;
}

.slick-wrap .slick-dots .slick-active {
    width: 1rem;
}

.slick-wrap .slick-dots .slick-active > button {
    background-color: #104343;
    border-color: #104343;
}

/*****#####===== top menu =====#####*****/
.top-menu-wrap {
    background-color: #FFFFFF;
    border-bottom: 1px solid #CCD1D7;
}

.top-menu-wrap.fixed {
    position: fixed;
    top: 4.6rem;
    left: 0;

    height: auto;
    width: 100%;

    z-index: 1019;
}

.top-menu-wrap .menu-item-wrap {
    text-align: center;
}

.top-menu-wrap .menu-item {
    padding: 1.167rem 0;

    font-size: 1.167rem;
    font-weight: 500;
    color: #777777;
}

.top-menu-wrap .menu-item.active {
    font-weight: bold;
    color: #222222;

    border-bottom: 2px solid #222222;
}

/*****#####===== top-info(건수/필터) =====#####*****/
.top-info-wrap {
    margin: 1.667rem 0 1.333rem;
}

.top-info-wrap .info-count {
    font-size: 1.167rem;
    font-weight: 500;
    color: #369a85;
}

.top-info-wrap .info-sort {
    display: flex;
    gap: 0.5rem;
}

.top-info-wrap .info-sort .sort-btn {
    padding: 0.25rem;

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

    background-color: #ffffff;
    border-color: #dddddd;
    border-radius: 0.167rem;
}

.top-info-wrap .sort-btn.sort-rsrv {
    color: #104343;

    background-color: #bae3db;
    border-color: #104343;
}

.top-info-wrap .sort-btn.sort-visit {
    color: #9e5a87;

    background-color: #eed9e7;
    border-color: #9e5a87;
}

.top-info-wrap .sort-btn.sort-call {
    color: #4e4eae;

    background-color: #d9d9ee;
    border-color: #4e4eae;
}

/*****#####===== 별점 =====#####*****/
.rate-star-wrap {
    display: flex;
    align-items: center;
    gap: 0.333rem;
}

.rate-star-wrap .rate-score {
    margin-left: 0.25rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.rate-star-item {
    display: inline-block;
    width: 1.667rem;
    height: 1.667rem;

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

.rate-star-item.active {
    background: url(/front/data/img/app/star_on.svg) center no-repeat;
}

.rate-star-item[data-type="sm"] {
    width: 1rem;
    height: 1rem;

    background: url(/front/data/img/app/star_sm_off.svg) center no-repeat;
}

.rate-star-item[data-type="sm"].active {
    background: url(/front/data/img/app/star_sm_on.svg) center no-repeat;
}

/*****#####===== 드랍존 =====#####*****/
.profile-drop-wrap .dz-message,
.profile-drop-wrap .dropzone .dz-preview .dz-image {
    border: 1px dashed #dddddd;
    border-radius: 0;
}

.profile-drop-wrap .dropzone .dz-remove:after {
    top: 0.3rem;
    right: 0.3rem;

    width: 2rem;
    height: 2rem;

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

    box-shadow: none;
}

.dropzone[data-size='small'] .dz-message {
    margin: 0;
}

.profile-drop-wrap .dz-message,
.profile-drop-wrap .user-image,
.profile-drop-wrap .dropzone .dz-preview .dz-image {
    width: 10rem;
    height: 10rem;
}

/*****#####===== swiper =====#####*****/
@media (min-width: 100px) and (max-width: 767.98px){
    .swiper-wrap .swiper-slide {
        padding: 0 16px;
    }
}

/*****#####===== slick =====#####*****/
@media (min-width: 100px) and (max-width: 767.98px){
    .slick-wrap .slide-wrap {
        padding: 0 16px;
    }
}

/*=================================================
            버튼, 색 설정
=================================================*/
/*****#####===== 프로젝트 =====#####*****/
.point-color-1{color: #244157;}
.point-color-1:visited{color: #244157;}
.point-color-2{color: #0060AA;}
.point-color-2:visited{color: #0060AA;}
.point-color-3{color: #38ACA3;}
.point-color-3:visited{color: #38ACA3;}
.point-color-4{color: #040FB0;}
.point-color-4:visited{color: #040FB0;}
.point-color-5{color: #DC0000;}
.point-color-5:visited{color: #DC0000;}
.point-color-6{color: #04B014;}
.point-color-6:visited{color: #04B014;}
.point-sub-1{color: #1F1D2B;}
.point-sub-1:visited{color: #1F1D2B;}
.point-sub-2{color: #353A46;}
.point-sub-2:visited{color: #353A46;}
.point-sub-3{color: #474E5f;}
.point-sub-3:visited{color: #474E5f;}
.point-sub-4{color: #858585;}
.point-sub-4:visited{color: #858585;}
.point-sub-5{color: #ffffff;}
.point-sub-5:visited{color: #ffffff;}
.point-bg-1{background-color: #E8F1F9;}
.point-bg-2{background-color: #F5F5F5;}

/*=================================================
            point-btn
=================================================*/
[class*="point-btn"]{
    font-size: 1.167rem;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;

    border-radius: 0.333rem;
}

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

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

.point-btn-2{
    color: #104343 !important;

    background-color: #ffffff;
    border: 1px solid #104343;
}

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

    background-color: #e2a747 !important;
    border: 1px solid #e2a747;
}

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

    background-color: #dddddd;
    border: 1px solid #dddddd;

    pointer-events: none;
}

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

    background-color: #e2a747;
    border: 1px solid #e2a747;

    pointer-events: all;
}

.point-btn-5{
    color: #777777 !important;

    background-color: #ffffff;
    border: 1px solid #dddddd;
}

.point-btn-6{
    color: #df0000 !important;

    background-color: #ffffff;
    border: 1px solid #df0000;
}

.point-btn-7{
    color: #369a85 !important;

    background-color: #eafbf7;
    border: 1px solid #369a85;
}

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

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

/*=================================================
            form-control
=================================================*/
.form-control{
    height: auto;
    padding: 1.167rem 1rem;

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

    border-radius: 0.333rem !important;
    overflow-y: scroll;

    resize: none;
}

.form-control::placeholder{
    font-size: 1.167rem;
    color: #999999;
}

/*=================================================
            전체
=================================================*/
.bottom-shadow{
    box-shadow: 0 3vh 5vh 5vh rgba(0,0,0,0.8);
}

.sticky-container{
    height: 200vh;
}

.sticky-wrap{
    position: sticky;
    top: 1px;

    height: 100vh;
}

.upper-section{
    z-index: 4;
}

.downer-section{
    margin-top: -90vh;
    z-index: 3;
}

.fancy-alert .form-control {
    background-color: transparent;
}

#float-menu {
    position: fixed;
    bottom: 0;
    left: 0;

    width: 100%;
    padding: 0.917rem 0 1.167rem;

    border-top-left-radius: 0.833rem;
    border-top-right-radius: 0.833rem;
    background: #FFFFFF;

    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    z-index: 999;
}

#float-menu .each-col {
    font-weight: 500;
    color: #262C31;
    text-align: center;
}

.user-signup-wrap .auth-wrap .btn {
    height: 4rem;
}

.page-header {
    margin: 1rem 0 1.667rem;
}

.page-header-title {
    padding: 1rem 0;

    font-size: 2rem;
    font-weight: 700;
    color: #222222;
}

.page-header-title > span {
    color: #369a85;
}

.page-header-subtitle {
    margin-top: 0.333rem;
    
    font-size: 1.167rem;
    color: #778088;
}

.fancybox-button--zoom {
    display: none !important;
}

.select-box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.333rem;
    min-height: 47px;

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

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

.select-box .empty_preset,
.select-box .drawer_select_box {
    width: 100%;
    padding: 1rem 0;

    text-align: center;
}

.select-box > input {
    display: flex;

    height: 100%;
    padding-top: 0;
    padding-bottom: 0;

    border: none;
}

/*****#####===== 모바일 스크롤 =====#####*****/
/*****##### 미디어 쿼리 #####*****/
/***** xs / sm *****/
@media (min-width: 100px) and (max-width: 767.98px){
    .scroll-row{
        flex-wrap: nowrap;

        overflow-x: scroll;
        -ms-overflow-style: none; /* IE and Edge */
        scrollbar-width: none; /* Firefox */
    }

    .scroll-row::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Opera*/
    }
}

/*****#####===== height =====#####*****/
.height-full-apply{
    height: auto;
}

/*****#####===== 배경 이미지 =====#####*****/
.back-img-wrap{
    position: absolute;
    top: 2rem;
    left: 0;

    max-width: 33.938rem;

    z-index: -1;
}

/*****##### 미디어 쿼리 #####*****/
/***** xl *****/
@media (min-width: 1200px) and (max-width: 1599.98px){
    .back-img-wrap{
        max-width: 22.938rem;
    }
}

/***** lg *****/
@media (min-width: 992px) and (max-width: 1199.98px){
    .back-img-wrap{
        max-width: 22.938rem;
    }
}

/***** md *****/
@media (min-width: 768px) and (max-width: 991.98px){
    .back-img-wrap{
        max-width: 20.938rem;
    }
}

/***** xs / sm *****/
@media (min-width: 100px) and (max-width: 767.98px){
    .back-img-wrap{
        max-width: 15.938rem;
    }
}

.back-img-wrap.leftbottom{
    left: 0;
    bottom: 6rem;

    max-width: 10.5rem;
}

.back-img-wrap.rightbottom{
    top: initial;
    bottom: 0;
    left: initial;
    right: 0;

    max-width: 18rem;
}

#user-admin_login-body .form-control {
    height: 40px;
    
    font-size: 1rem;

    border-radius: 0 !important;
}

/*=================================================
            pretty
=================================================*/
.pretty .state label:before{
    border-radius: 2px;
}

.pretty.p-default.p-thick .state label:after,
.pretty.p-default.p-thick .state label:before {
    background-color: #104343;
}

.pretty.p-default input:checked~.state label:after {
    background-color: #104343 !important;
}

.pretty .state label:before {
    border-color: #104343;
}

.pretty.p-svg .state .svg {
    background-color: #104343;

    border-radius: 0.333rem;
    overflow: hidden;
}

.pretty.p-svg .state .svg path {
    stroke: none !important;
    fill: #ffffff !important;
}


/*****#####===== 페이지네이션 =====#####*****/
.pagination-wrap{
    margin: 0.75rem 0 0 0;
}

.pagination-wrap .page-item .page-link,
.pagination-wrap .page-item [class^="ti-"] {
    padding: 0.5rem 0.6rem;
}

.pagination-wrap .page-item .page-link {
    position: relative;

    padding: 0.35rem 0.6rem;

    font-family: 'Roboto';

    border-radius: 0;
}

.pagination-wrap .page-item .page-link:focus{
    box-shadow: none;
}

.pagination-wrap .page-item [class^="ti-"]{
    font-weight: 700;
    color: #000000;
}

/*****##### active #####*****/
.pagination-wrap .page-link,
.pagination-wrap .page-link:hover,
.pagination-wrap .page-item.active .page-link{
    font-size: 0.875rem;
    font-weight: 500;
    color: #999999;
}

.pagination-wrap .page-item.active .page-link {
    color: #ffffff;

    background-color: #0060AA;
}

/*****##### hover #####*****/
.pagination-wrap .page-item:not(.active):hover .page-link{
    background-color: initial;
}

/*****#####===== nav-backdrop =====#####*****/
[id^="nav-backdrop"]{
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

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

    cursor: pointer;
    z-index: 98;
}

[id^="nav-backdrop"].show{
    display: block;
}

/*=================================================
            alert
=================================================*/
/*****#####===== alert =====#####*****/
.fancybox-content {
    position: absolute;
    left: 0;
    bottom: 0;

    width: 100%;
    max-width: unset;
    padding: 0;

    border: none;
}

.custom-fancy-leave .fancybox-content {
    width: 100%;
    max-width: unset;
}

.fancybox-content .alert-content-wrap {
    padding: 2.667rem 1.333rem;
}

.fancybox-content .alert-content-wrap .alert-image {
    margin-bottom: 0.667rem;

    text-align: center;
}

.fancybox-content .alert-content-wrap .alert-text {
    padding: 0;

    font-size: 1.333rem;
    font-weight: 500;
    text-align: center;
    color: #222222;
}

.fancybox-content .alert-btn-wrap {
    padding: 1.333rem;

    border-top: 1px solid #dddddd;
}

/*=================================================
            container
=================================================*/
.container {
    padding-right: 16px;
    padding-left: 16px;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** xl ~ *****/
@media (min-width: 1200px){
    .container[data-type="view"]{
        max-width: 1030px;
    }
}

/***** xl ~ *****/
@media (min-width: 1400px){
    .container{
        max-width: 1310px;
    }
}

/***** xl ~ *****/
@media (min-width: 1100px){
    .container[data-type="goods"]{
        max-width: 1030px;
    }
}

/***** sm ~ *****/
@media (min-width: 700px){
    .container[data-type="banner"]{
        max-width: 670px;
    }
}

/*=================================================
            row
=================================================*/
/*****##### 6 #####*****/
.row-6{
    margin-left: -6px;
    margin-right: -6px;
}

.row-6 > div[class*='col']{
    padding-left: 6px;
    padding-right: 6px;
}

/*****##### 8 #####*****/
.row-8{
    margin-left: -8px;
    margin-right: -8px;
}

.row-8 > div[class*='col']{
    padding-left: 8px;
    padding-right: 8px;
}

/*****##### 12 #####*****/
.row-12{
    margin-left: -12px;
    margin-right: -12px;
}

.row-12 > div[class*='col']{
    padding-left: 12px;
    padding-right: 12px;
}

/*****##### 40 #####*****/
.row-40 {
    margin-left: -40px;
    margin-right: -40px;
}

.row-40 > div[class*='col'] {
    padding-left: 40px;
    padding-right: 40px;
}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** xl *****/
@media (min-width: 1200px) and (max-width: 1599.98px){
    /*****##### 40 #####*****/
    .row-40 {
        margin-left: -30px;
        margin-right: -30px;
    }

    .row-40 > div[class*='col'] {
        padding-left: 30px;
        padding-right: 30px;
    }

    /*****##### 12 #####*****/
    .row-12{
        margin-left: -10px;
        margin-right: -10px;
    }

    .row-12 > div[class*='col']{
        padding-left: 10px;
        padding-right: 10px;
    }
}

/***** lg *****/
@media (min-width: 992px) and (max-width: 1199.98px){
    /*****##### 40 #####*****/
    .row-40 {
        margin-left: -20px;
        margin-right: -20px;
    }

    .row-40 > div[class*='col'] {
        padding-left: 20px;
        padding-right: 20px;
    }

    /*****##### 30 #####*****/
    .row-30 {
        margin-left: -20px;
        margin-right: -20px;
    }

    .row-30 > div[class*='col'] {
        padding-left: 20px;
        padding-right: 20px;
    }

    /*****##### 20 #####*****/
    .row-20 {
        margin-left: -15px;
        margin-right: -15px;
    }

    .row-20 > div[class*='col'] {
        padding-left: 15px;
        padding-right: 15px;
    }

    /*****##### 12 #####*****/
    .row-12{
        margin-left: -10px;
        margin-right: -10px;
    }

    .row-12 > div[class*='col']{
        padding-left: 10px;
        padding-right: 10px;
    }
}

/***** md *****/
@media (min-width: 768px) and (max-width: 991.98px){
    /*****##### 40 #####*****/
    .row-40 {
        margin-left: -10px;
        margin-right: -10px;
    }

    .row-40 > div[class*='col'] {
        padding-left: 10px;
        padding-right: 10px;
    }

    /*****##### 30 #####*****/
    .row-30 {
        margin-left: -10px;
        margin-right: -10px;
    }

    .row-30 > div[class*='col'] {
        padding-left: 10px;
        padding-right: 10px;
    }

    /*****##### 20 #####*****/
    .row-20 {
        margin-left: -10px;
        margin-right: -10px;
    }

    .row-20 > div[class*='col'] {
        padding-left: 10px;
        padding-right: 10px;
    }

    /*****##### 12 #####*****/
    .row-12{
        margin-left: -10px;
        margin-right: -10px;
    }

    .row-12 > div[class*='col']{
        padding-left: 10px;
        padding-right: 10px;
    }
}

/***** xs / sm *****/
@media (min-width: 100px) and (max-width: 767.98px){
    /*****##### 40 #####*****/
    .row-40 {
        margin-left: -5px;
        margin-right: -5px;
    }

    .row-40 > div[class*='col'] {
        padding-left: 5px;
        padding-right: 5px;
    }

    /*****##### 30 #####*****/
    .row-30 {
        margin-left: -5px;
        margin-right: -5px;
    }

    .row-30 > div[class*='col'] {
        padding-left: 5px;
        padding-right: 5px;
    }

    /*****##### 20 #####*****/
    .row-20 {
        margin-left: -5px;
        margin-right: -5px;
    }

    .row-20 > div[class*='col'] {
        padding-left: 5px;
        padding-right: 5px;
    }

    /*****##### 12 #####*****/
    .row-12{
        margin-left: -5px;
        margin-right: -5px;
    }

    .row-12 > div[class*='col']{
        padding-left: 5px;
        padding-right: 5px;
    }
}

/*=================================================
            col
=================================================*/
/*****#####===== 미디어 쿼리 =====#####*****/
/***** xl ~ *****/
@media (min-width: 1200px) {
    /*****##### 45 #####*****/
    .col-xl-45 {
        -ms-flex: 0 0 45.148%;
        flex: 0 0 45.148%;
        max-width: 45.148%;
    }

    /*****##### 55 #####*****/
    .col-xl-55 {
        -ms-flex: 0 0 54.852%;
        flex: 0 0 54.852%;
        max-width: 54.852%;
    }
}

/***** lg ~ *****/
@media (min-width: 992px) {
    /*****##### 45 #####*****/
    .col-lg-45 {
        -ms-flex: 0 0 45.148%;
        flex: 0 0 45.148%;
        max-width: 45.148%;
    }

    /*****##### 55 #####*****/
    .col-lg-55 {
        -ms-flex: 0 0 54.852%;
        flex: 0 0 54.852%;
        max-width: 54.852%;
    }
}

/***** md ~ *****/
@media (min-width: 768px) {
    /*****##### 45 #####*****/
    .col-md-45 {
        -ms-flex: 0 0 45.148%;
        flex: 0 0 45.148%;
        max-width: 45.148%;
    }

    /*****##### 55 #####*****/
    .col-md-55 {
        -ms-flex: 0 0 54.852%;
        flex: 0 0 54.852%;
        max-width: 54.852%;
    }
}

/*=================================================
            gnb
=================================================*/
#gnb-wrap {
    min-height: 4.667rem;

    padding: 1.167rem 0;

    background-color: #ffffff;
    border-bottom: 1px solid #dddddd;
}

[id*="user-admin_"] #gnb-wrap,
[id*="user-admin_"] #float-menu {
    display: none;
}

#gnb-wrap .gnb-title {
    font-size: 1.333rem;
    font-weight: 700;
    color: #222222;
}

#gnb-wrap .gnb-noti.active::after {
    content: '';
    top: 0;
    right: 0;
    position: absolute;

    width: 0.333rem;
    height: 0.333rem;

    background-color: #F24147;
    border-radius: 50%;
    overflow: hidden;
}

#gnb-wrap .gnb-market-info .info-title {
    font-weight: 500;
    color: #5A636A;
}

#gnb-wrap .gnb-market-info .info-price {
    font-size: 1.25rem;
    font-weight: 600;
    color: #262C31;
}

#gnb-wrap .gnb-market-info .info-price > span {
    font-size: 1.167rem;
    font-weight: 500;
}

#gnb-wrap .gnb-back {
    position: absolute;

    top: 50%;
    left: 16px;
    transform: translateY(-50%);
}

#gnb-wrap .gnb-bookmark {
    position: absolute;

    top: 50%;
    right: 16px;
    transform: translateY(-50%);
}

.check-point,
.check-coupon{
    position: fixed;
    bottom: 8rem;
}

.check-point{
    display: flex;
    align-items: center;
    justify-content: center;
    left: 1.333rem;

    padding: 0.667rem 0.833rem;

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

.check-point .point-text{
    margin-right: 0.5rem;

    font-weight: bold;
    color: #555555;
}

.check-point .point-text span{
    color: #999999;
}

.check-point svg{
    width: 2.667rem;
    height: 2.667rem;
}

.check-coupon{
    display: flex;
    align-items: center;
    justify-content: center;
    right: 1.333rem;

    width: 4rem;
    height: 4rem;

    background-color: #ffffff;
    border-radius: 100%;
}

/*=================================================
            스위치
=================================================*/
.pretty.p-switch.p-fill input:checked~.state:before {
    background-color: #104343 !important;
}

.pretty.p-switch .state:before {
    background-color: #999999;
    border: none;
}

.pretty.p-switch .state label:after {
    background-color: #ffffff !important;
}

.pretty.p-switch {
    font-size: 2rem;
}

.pretty.p-switch .state label:after,
.pretty.p-switch .state label:before {
    transform: scale(0.6);
}

.pretty.p-switch .state label:after, .pretty .state label:before,
.pretty.p-switch .state .svg {
    top: calc((0% - (100% - 1em)) - 30%);
}

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

/*=================================================
            form-group
=================================================*/
.page-wrap[id^='user-'] .form-control {
    height: auto;
}

.form-group-wrap .form-group {
    margin-bottom: 2.667rem;
}

.form-group .form-title {
    margin-bottom: 0.417rem;

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

.form-id {
    display: block;

    margin-bottom: 1.333rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.form-id-box {
    margin-bottom: 0.833rem;
    padding: 1rem 1.333rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;

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

.form-noti {
    margin-top: 0.333rem;

    color: #369a85;
}

.form-group-wrap.underline {
    margin-bottom: 2.667rem;
    
    border-bottom: 6px solid #F2F4F5;
}

/*=================================================
            user
=================================================*/
.page-wrap[id^='user-'] {
    padding: 0;
}

.page-wrap[id^='user-'] .page-header {
    margin: 1rem 0 1.667rem
}

.page-wrap[id^='user-'] .logo-wrap svg {
    width: 4rem;
    height: 4rem;
}

.page-wrap[id^='user-'] .btn-wrap .btn {
    padding: 1.167rem 0;
}

.btn-wrap .btn {
    padding: 1.167rem 0;
}

.user-signup-wrap .all-terms-wrap {
    padding: 1rem;
}

.user-signup-wrap .terms-item {
    margin: 0;
}

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

/*****#####===== login =====#####*****/
.user-login-wrap {
    height: 100vh;
    margin: 0;
}

.user-login-wrap .logo-wrap {
    margin-bottom: 5.083rem !important;

    text-align: center;
}

.user-login-wrap .form-id {
    margin-top: 0;
    margin-bottom: 0.5rem;

    font-size: 1.333rem;
    font-weight: 500;
    text-align: left;
    color: #222222;
}

.user-login-wrap .form-group-wrap {
    margin-bottom: 2.667rem;
}

.user-login-wrap .form-group {
    margin-bottom: 1.667rem;
}

.user-login-wrap .find-wrap .bottom-link {
    font-size: 1rem;
    color: #555555;
}

.user-login-wrap .sns-login-wrap .sns-login-title {
    margin-bottom: 1.667rem;
}

.user-login-wrap .line-title-wrap {
    margin-top: 6vh;
    margin-bottom: 1.5rem;
}

.user-login-wrap .line-title-wrap .sns-login-title {
    font-size: 1.167rem;
    color: #999999;
}

.user-login-wrap .line-title-wrap .line-title {
    padding: 0 1.333rem;
}

.user-login-wrap .login-btn {
    font-weight: 500;
    font-size: 1.167rem;
}

.user-login-wrap .signup-btn {
    margin-top: 0.667rem;
    
    font-weight: 500;
    font-size: 1.167rem;
}

.user-login-wrap .auto-login > label {
    font-weight: 500;
    font-size: 1rem;
    color: #222222;
}

.user-login-wrap .btn-sns > svg {
    width: 48px;
    height: 48px;
}

#user-login-body .pretty.p-svg .state .svg {
    background-color: #104343;
}

/*****#####===== signup =====#####*****/
.user-signup-wrap {
    padding-bottom: 10rem;
}

.user-signup-wrap .title-wrap .title-title {
    margin-bottom: 1.667rem;

    font-size: 1.333rem;
    font-weight: 700;
    color: #222222;
}

.user-signup-wrap .authcode-btn {
    padding: 1.167rem;

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

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

.user-signup-wrap .form-group {
    margin-bottom: 2.667rem;
}

.user-signup-wrap .form-group.plural-form {
    margin-bottom: 0.333rem;
}

.user-signup-wrap .every-terms-wrap {
    border-radius: 0.333rem;
}

.user-signup-wrap .every-terms-wrap label {
    font-size: 1.25rem;
}

.user-signup-wrap .every-terms-wrap label > span {
    color: #104343;
}

.user-signup-wrap .pretty.p-svg .state .svg {
    font-size: 1.25rem;
}

.user-signup-wrap .terms-wrap .term-show-btn {
    font-size: 1.083rem;
    color: #ADB4BA;
}

.user-signup-wrap .all-terms-wrap label {
    font-weight: 500;
}

.user-signup-wrap .terms-wrap label {
    font-weight: 500;
}

.page-wrap .user-signup-wrap .btn-wrap {
    margin-top: 0;
}

.page-wrap[id^='user-signup'] .btn-wrap .point-btn-1 {
    padding: 1.5rem 0;
}

/*=================================================
            예외
=================================================*/
#user-login-body #gnb-wrap {
    display: none;
}


/*=================================================
            drawer-alert
=================================================*/
.component-wrap[data-comp="drawer-alert"] .drawer-item-wrap .drawer-icon{
    width: 2rem;
    height: 2rem;
    margin: 0 auto;
}

.component-wrap[data-comp="drawer-alert"] .drawer-item-wrap .drawer-text{
    padding-top: 1.333rem;

    font-size: 1.333rem;
    font-weight: bold;
    text-align: center;
}

.component-wrap[data-comp="drawer-alert"] .drawer-item-wrap .drawer-text span{
    color: #df0000;
}

.component-wrap[data-comp="drawer-alert"] .drawer-footer{
    padding: 1.333rem;

    border-top: 1px solid #eeeeee;
}

/*=================================================
            [Component] info_wrap.php
=================================================*/
.component-wrap[data-comp="info_wrap"]{
    border-radius: 0 0 0.833rem 0.833rem;
    overflow: hidden;
}

.component-wrap[data-comp="info_wrap"] .title-wrap{
    position: relative;

    padding: 1.333rem 0;

    border-bottom: 1px solid #eeeeee;
}

.component-wrap[data-comp="info_wrap"] .title-wrap .title-content{
    font-size: 1.333rem;
    font-weight: bold;
    text-align: center;
}

.component-wrap[data-comp="info_wrap"] .title-wrap svg{
    position: absolute;
    top: 50%;
    right: 1.333rem;

    transform: translateY(-50%);
}

.component-wrap[data-comp="info_wrap"] .profile-wrap{
    padding: 1.333rem;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .personal-wrap{
    margin-bottom: 1.333rem;
    padding-bottom: 1.333rem;

    border-bottom: 1px solid #eeeeee;
}

.component-wrap[data-comp="info_wrap"] .personal-wrap .profile-img{
    width: 100%;
    height: auto;

    border-radius: 100%;

    overflow: hidden;
}

.component-wrap[data-comp="info_wrap"] .personal-wrap .profile-content{
    display: flex;
    align-items: center;

    height: 100%;
    padding-left: 0.833rem;
}

.component-wrap[data-comp="info_wrap"] .personal-wrap .content-name{
    font-size: 1.333rem; 
    font-weight: bold;
}

.component-wrap[data-comp="info_wrap"] .personal-wrap .content-name span{
    font-size: 1.167rem;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .profile-phone{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 3.333rem;
    height: 3.333rem;

    border-radius: 100%;
    background-color: #eeeeee;
}

.component-wrap[data-comp="info_wrap"] .personal-wrap .profile-phone svg{
    width: 1.333rem;
    height: 1.333rem;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-wrap{
    padding-bottom: 1.333rem;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-service{
    margin-bottom: 1.333rem;

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

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-service .tag{
    margin-right: 0.5rem;
    padding: 0.5rem 1rem;
 
    font-size: 1.167rem;
    color: #104343;

    border-radius: 1.333rem;
    background-color: #bae3db;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-service .on{
    color: #369a85;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-service .off{
    color: #df0000;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-address{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-time{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="info_wrap"] .profile-wrap .text-time span{
    color: #369a85;
}

.component-wrap[data-comp="info_wrap"] .profile-btnbox .btnbox-time{
    margin-bottom: 0.833rem;

    font-size: 1.167rem;
    font-weight: bold;
    color: #df0000;
}

/*=================================================
            [Component] lists_item_1.php
=================================================*/
.component-wrap[data-comp="lists_item_1"]{
    background-color: #ffffff;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    border-radius: 0.333rem;
}

.component-wrap[data-comp="lists_item_1"] .profile-wrap{
    padding: 1.333rem;
}

.component-wrap[data-comp="lists_item_1"] .profile-img{
    width: 100%;
    height: auto;

    border-radius: 100%;

    overflow: hidden;
}

.component-wrap[data-comp="lists_item_1"] .content-name{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="lists_item_1"] .content-number{
    font-size: 1rem;
    color: #555555;
}

.component-wrap[data-comp="lists_item_1"] .profile-phone{
    display: flex;
    align-items: center;
    justify-content: center;
    
    width: 3.333rem;
    height: 3.333rem;

    border-radius: 100%;
    background-color: #eeeeee;
}

.component-wrap[data-comp="lists_item_1"] .profile-phone svg{
    width: 1.333rem;
    height: 1.333rem;
}

.component-wrap[data-comp="lists_item_1"] .info-wrap{
    padding: 1.333rem;
    margin-bottom: 0;
}

.component-wrap[data-comp="lists_item_1"] .info-wrap:not(:first-child){
    border-top: 2px solid #eeeeee;
}

.component-wrap[data-comp="lists_item_1"] .info-content{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.component-wrap[data-comp="lists_item_1"] .info-content:not(:last-child){
    margin-bottom: 0.667rem;
}

.component-wrap[data-comp="lists_item_1"] .info-primary{
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 1rem;
}

.component-wrap[data-comp="lists_item_1"] .info-date{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="lists_item_1"] .info-service{
    border-radius: 0.167rem;
}

.component-wrap[data-comp="lists_item_1"] .info-title{
    font-size: 1.167rem;
    color: #777777;
}

.component-wrap[data-comp="lists_item_1"] .info-value{
    font-size: 1.167rem;
    font-weight: bold;
    color: #555555;
}

.component-wrap[data-comp="lists_item_1"] .info-value.active{
    color: #df0000;
}

.component-wrap[data-comp="lists_item_1"] .list-btn{
    padding: 1.333rem;

    border-top: 2px solid #eeeeee;
}

/*=================================================
            [Component] lists_item_2.php
=================================================*/
.component-wrap[data-comp="lists_item_2"] .profile-wrap{
    padding: 1.5rem 1.333rem;

    background-color: #f4f4f4;
    border: 1px solid #dddddd;
    border-radius: 0.333rem;
}

.component-wrap[data-comp="lists_item_2"] .lists-item-wrap.active .profile-wrap{
    background-color: #eafbf7;
    border: 1px solid #369a85;
}

.component-wrap[data-comp="lists_item_2"] .profile-img{
    border-radius: 100%;
    overflow: hidden;
}

.component-wrap[data-comp="lists_item_2"] .profile-text .text-name{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="lists_item_2"] .profile-text .text-grade{
    display: flex;
    align-items: center;
}

.component-wrap[data-comp="lists_item_2"] .profile-text .text-grade svg{
    width: 1.333rem;
    height: 1.333rem;
    margin-right: 0.167rem;
}

.component-wrap[data-comp="lists_item_2"] .profile-text .text-grade span{
    font-size: 1.167rem;
}

.component-wrap[data-comp="lists_item_2"] .profile-distance div{
    text-align: end;
}

.component-wrap[data-comp="lists_item_2"] .profile-distance .distance-text{
    margin-bottom: 0.333rem;

    color: #777777;
}

.component-wrap[data-comp="lists_item_2"] .profile-distance .distance-km{
    font-size: 1.167rem;
    color: #555555;
}

/*=================================================
            [Component] lists_item_3.php
=================================================*/
.component-wrap[data-comp="lists_item_3"] .item-img{
    margin-bottom: 1rem;

    background-color: #eeeeee;
    border-radius: 0.333rem;
    overflow: hidden;
}

.component-wrap[data-comp="lists_item_3"] .item-name{
    font-size: 1.167rem;
}

.component-wrap[data-comp="lists_item_3"] .item-price{
    display: flex;
    align-items: center;
}

.component-wrap[data-comp="lists_item_3"] .item-price .price-dc{
    margin-right: 0.5rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #df0000;
}

.component-wrap[data-comp="lists_item_3"] .item-price .price-text{
    font-size: 1.333rem;
    font-weight: bold;
}

/*=================================================
            [Component] lists_item_4.php
=================================================*/
.component-wrap[data-comp="lists_item_4"] .pick-img{
    border-radius: 0.167rem;
    overflow: hidden;
}

.component-wrap[data-comp="lists_item_4"] .pick-name{
    margin-bottom: 0.25rem;

    font-size: 1.167rem;
}

.component-wrap[data-comp="lists_item_4"] .pick-price{
    margin-bottom: 0.833rem;
}

.component-wrap[data-comp="lists_item_4"] .pick-price .price-dc{
    margin-right: 0.5rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #df0000;
}

.component-wrap[data-comp="lists_item_4"] .pick-price .price-text{
    font-size: 1.333rem;
    font-weight: bold;
}

/*=================================================
            [Component] lists_item_5.php
=================================================*/
.component-wrap[data-comp="lists_item_5"]{
    padding: 2rem 0;

    border-bottom: 1px solid #dddddd;
}

.component-wrap[data-comp="lists_item_5"] .notice-icon{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 3.5rem;
    height: 3.5rem;

    background-color: #ffffff;
    border-radius: 100%;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    overflow: hidden;
}

.component-wrap[data-comp="lists_item_5"] .notice-text .notice-desc{
    margin-bottom: 0.5rem;
    
    font-size: 1.167rem;
    font-weight: bold;
}

.component-wrap[data-comp="lists_item_5"] .notice-text .notice-date{
    font-size: 1.083rem;
    color: #777777;
}

/*=================================================
            [Component] lists_item_6.php
=================================================*/
.component-wrap[data-comp="lists_item_6"] .lists-item{
    margin-bottom: 1.333rem;
    padding: 1.667rem 1.333rem;

    border: 1px solid #eeeeee;
    border-radius: 0.333rem;

    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.component-wrap[data-comp="lists_item_6"] .item-title{
    font-size: 1.5rem;
    font-weight: bold;
}

.component-wrap[data-comp="lists_item_6"] .item-date{
    margin-bottom: 1.583rem;

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

.component-wrap[data-comp="lists_item_6"] .item-price{
    font-size: 1.667rem;
    font-weight: bold;
    text-align: end;
    color: #369a85;
}

.component-wrap[data-comp="lists_item_6"] .lists-item.active .item-price{
    color: #df0000;
}

/*=================================================
            [Component] lists_item_7.php
=================================================*/
.component-wrap[data-comp="lists_item_7"]{
    background-color: #ffffff;
    border-radius: 0.333rem;
    overflow: hidden;
}

.component-wrap[data-comp="lists_item_7"] .lists-item-wrap {
    margin-bottom: 1.333rem;

    border: solid 1px #eee;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.component-wrap[data-comp="lists_item_7"] .coupon-text{
    height: 7.417rem;
    padding: 1.333rem 1.333rem 0 1.333rem;
}

.component-wrap[data-comp="lists_item_7"] .coupon-text .text-title{
    margin-bottom: 0.5rem;
}

.component-wrap[data-comp="lists_item_7"] .coupon-text .text-dc{
    font-weight: bold;
    color: #104343;
}

.component-wrap[data-comp="lists_item_7"] .coupon-desc{
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 1rem 1.333rem;

    background-color: #f4f4f4;
    border: 1px solid #eeeeee;
}

.component-wrap[data-comp="lists_item_7"] .coupon-desc .desc-status{
    color: #555555;
}

.component-wrap[data-comp="lists_item_7"] .coupon-desc .desc-date{
    color: #555555;
}

.component-wrap[data-comp="lists_item_7"] .lists-item-wrap.active .coupon-text{
    background-color: #f4f4f4;
}

.component-wrap[data-comp="lists_item_7"] .lists-item-wrap.active .coupon-desc{
    background-color: #dddddd;
    border: 1px solid #eeeeee;
}

.component-wrap[data-comp="lists_item_7"] .lists-item-wrap.active .coupon-text .text-dc {
    color: #222222;
}

.component-wrap[data-comp="lists_item_7"] .lists-item-wrap.active .coupon-desc .desc-date,
.component-wrap[data-comp="lists_item_7"] .lists-item-wrap.active .coupon-desc .desc-status{
    color: #555555;
}

/*=================================================
            [Component] floater_wrap.php
=================================================*/
.component-wrap[data-comp="floater_wrap"]{
    background-color: #ffffff;
    border-radius: 0.833rem 0.833rem 0 0;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.component-wrap[data-comp="floater_wrap"] .floater-title{
    padding: 1.5rem 0;

    font-size: 1.333rem;
    font-weight: bold;
    text-align: center;

    border-bottom: 1px solid #dddddd;
}

.component-wrap[data-comp="floater_wrap"] .floater-content{
    padding: 1.333rem;
}

.component-wrap[data-comp="floater_wrap"] .content-profile{
    margin-bottom: 1.333rem;
    padding-bottom: 1.333rem;

    border-bottom: 1px solid #eeeeee;
}

.component-wrap[data-comp="floater_wrap"] .content-profile .profile-img{
    margin-right: 0.833rem;

    width: 4rem;
    height: 4rem;

    border-radius: 100%;
    overflow: hidden;
}

.component-wrap[data-comp="floater_wrap"] .content-profile .text-name{
    margin-bottom: 0.167rem;

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

.component-wrap[data-comp="floater_wrap"] .content-profile .text-grade{
    display: flex;
    align-items: center;
}

.component-wrap[data-comp="floater_wrap"] .content-profile .text-grade svg{
    margin-right: 0.167rem;
    
    width: 1.333rem;
    height: 1.333rem;
}

.component-wrap[data-comp="floater_wrap"] .content-profile .text-grade span{
    font-size: 1.167rem;
}

.component-wrap[data-comp="floater_wrap"] .content-profile .profile-phone{
    display: flex;
    align-items: center;
    justify-content: center;
    
    width: 3.333rem;
    height: 3.333rem;

    background-color: #eeeeee;
    border-radius: 100%;
    overflow: hidden;
}

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-service{
    margin-bottom: 2.667rem;

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

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-service .on{
    color: #369a85;
}

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-service .off{
    color: #df0000;
}

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-service .tag-rsrv{
    padding: 0.5rem 1rem;

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

    background-color: #bae3db;
    border-radius: 1.333rem;
}

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-service .tag-visit{
    padding: 0.5rem 1rem;

    font-size: 1.167rem;
    color: #9e5a87;

    background-color: #eed9e7;
    border-radius: 1.333rem;
}

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-service .tag-call{
    padding: 0.5rem 1rem;

    font-size: 1.167rem;
    color: #4e4eae;

    background-color: #d9d9ee;
    border-radius: 1.333rem;
}

.component-wrap[data-comp="floater_wrap"] .content-desc .desc-address{
    margin-bottom: 1.167rem;

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

.component-wrap[data-comp="floater_wrap"] .desc-btnbox .btnbox-time{
    margin-bottom: 0.833rem;

    font-size: 1.167rem;
    font-weight: bold;
    color: #df0000;
}

/*=================================================
            form-type-1
=================================================*/
.component-wrap[data-comp="form-type-1"] .form-type-wrap{
    margin-bottom: 50px;
}

.component-wrap[data-comp="form-type-1"] .form-nav{
    position: relative;

    padding: 1.5rem 0;

    border-bottom: 1px solid #dddddd;
}

.component-wrap[data-comp="form-type-1"] .form-nav .nav-title{
    font-size: 1.333rem;
    font-weight: bold;
    text-align: center;
}

.component-wrap[data-comp="form-type-1"] .form-nav .nav-close{
    position: absolute;
    top: 50%;
    right: 1.333rem;

    transform: translateY(-50%);
}

.component-wrap[data-comp="form-type-1"] .form-desc{
    padding: 2rem 1.333rem;

    border-bottom: 10px solid #eeeeee;
}

.component-wrap[data-comp="form-type-1"] .form-desc .desc-title{
    margin-bottom: 1rem;

    font-size: 2rem;
    font-weight: bold;
}

.component-wrap[data-comp="form-type-1"] .desc-title .tag.tag-rsrv{
    padding: 0.5rem 1rem;

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

    background-color: #bae3db;
    border-radius: 1.333rem;
}

.component-wrap[data-comp="form-type-1"] .desc-title .tag.tag-visit{
    padding: 0.5rem 1rem;

    font-size: 1.167rem;
    color: #9e5a87;

    background-color: #eed9e7;
    border-radius: 1.333rem;
}

.component-wrap[data-comp="form-type-1"] .desc-title .tag.tag-call{
    padding: 0.5rem 1rem;

    font-size: 1.167rem;
    color: #4e4eae;

    background-color: #d9d9ee;
    border-radius: 1.333rem;
}

.component-wrap[data-comp="form-type-1"] .desc-title .title-price{
    color: #369a85;
}

.component-wrap[data-comp="form-type-1"] .form-desc .desc-subtitle{
    font-size: 1.167rem;
    font-weight: lighter;
    color: #555555;
}

.component-wrap[data-comp="form-type-1"] .form-info{
    padding: 2rem 1.333rem;

    border-bottom: 1px solid #dddddd;
}

.component-wrap[data-comp="form-type-1"] .form-info .info-titlebox {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 1.667rem;
}

.component-wrap[data-comp="form-type-1"] .info-titlebox .titlebox-title {
    font-size: 1.667rem;
    font-weight: bold;
}

.component-wrap[data-comp="form-type-1"] .info-titlebox .titlebox-fixbtn {
    display: flex;
    align-items: center;

    padding: 0.583rem 1rem;

    color: #555555;
    
    background-color: #eeeeee;
    border-radius: 0.333rem;
}

.component-wrap[data-comp="form-type-1"] .info-titlebox .titlebox-fixbtn svg{
    margin-right: 0.333rem;
}

.component-wrap[data-comp="form-type-1"] .info-text{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.component-wrap[data-comp="form-type-1"] .info-text .text-name{
    font-size: 1.167rem;
    color: #777777;
}

.component-wrap[data-comp="form-type-1"] .info-text .text-value{
    font-size: 1.167rem;
    font-weight: bold;
}

.component-wrap[data-comp="form-type-1"] .form-service{
    padding: 1.333rem 1.333rem;
}

.component-wrap[data-comp="form-type-1"] .form-service .service-titlebox{
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 0.333rem;
}

.component-wrap[data-comp="form-type-1"] .service-titlebox .titlebox-title{
    font-size: 1.667rem;
    font-weight: bold;
}

.component-wrap[data-comp="form-type-1"] .service-titlebox .titlebox-price{
    font-size: 1.5rem;
    font-weight: bold;

    color: #369a85;
}

.component-wrap[data-comp="form-type-1"] .form-service .service-subtitle{
    color: #369a85;
}

.component-wrap[data-comp="form-type-1"] .form-service .service-textbox{
    padding: 1.333rem 0;
}

.component-wrap[data-comp="form-type-1"] .service-textbox .textbox-title{
    margin-bottom: 1rem;

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

.component-wrap[data-comp="form-type-1"] .textbox-valuebox .valuebox-title{
    margin-bottom: 0.667rem;

    font-size: 1.137rem;
    font-weight: bold;
}

.component-wrap[data-comp="form-type-1"] .textbox-valuebox .valuebox-info{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.component-wrap[data-comp="form-type-1"] .valuebox-info .valuebox-name{
    font-size: 1.167rem;
    color: #777777;
}

.component-wrap[data-comp="form-type-1"] .valuebox-info .valuebox-value{
    font-size: 1.167rem;
    font-weight: bold;
}

.component-wrap[data-comp="form-type-1"] .form-bike{
    padding: 0 1.333rem;
}

.component-wrap[data-comp="form-type-1"] .form-bike .bike-textarea{
    width: 100%;
    height: auto;
    margin: 1.333rem 0;
    padding: 1.167rem 1.333rem;

    font-size: 1.167rem;
    
    border: 1px solid #dddddd;
    border-radius: 0.333rem;

    resize: none;
}

.component-wrap[data-comp="form-type-1"] .form-bike .bike-textarea::placeholder{
    font-size: 1.167rem;
}

.component-wrap[data-comp="form-type-1"] .form-bikeimg{
    padding: 0 1.333rem;

    border-radius: 0.333rem;
    overflow: hidden;
}

.component-wrap[data-comp="form-type-1"] .form-request{
    padding: 1.25rem 1.333rem;

    background-color: #eafbf7;
}

.component-wrap[data-comp="form-type-1"] .form-request .request-img{
    margin-right: 0.5rem;

    width: 2rem;
    height: 2rem;

    border-radius: 100%;
    overflow: hidden;
}

.component-wrap[data-comp="form-type-1"] .form-request .request-alarm{
    font-size: 1.167rem;
    font-weight: bold;
    letter-spacing: -0.035rem;
}

.component-wrap[data-comp="form-type-1"] .form-request .request-alarm span{
    font-size: 1.167rem;
    font-weight: bold;
    color: #df0000;
}


/*=================================================
            mypage
=================================================*/
[id^="mypage-"] .page-wrap {
    background-color: #ffffff;
}

/*****#####===== 메인 =====#####*****/
.mypage-main-wrap .info-wrap {
    padding: 2rem 0 1.667rem;

    border-bottom: 0.667rem solid #eeeeee;
}

.mypage-main-wrap .info-wrap .info-title {
    font-size: 1.667rem;
    font-weight: bold;
    color: #222222;
}

.mypage-main-wrap .info-wrap .info-title > span {
    color: #104343;
}

.mypage-main-wrap .bike-wrap {
    margin-top: 1.667rem;
}

.mypage-main-wrap .bike-wrap .title-wrap {
    padding: 1.333rem;

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

    background-color: #1b6868;
    border-top-left-radius: 0.333rem;
    border-top-right-radius: 0.333rem;
}

.mypage-main-wrap .bike-wrap .content-wrap {
    padding: 1.333rem;

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

    background-color: #104343;
    border-bottom-left-radius: 0.333rem;
    border-bottom-right-radius: 0.333rem;
}

.mypage-main-wrap .bike-wrap .content-item:not(:last-child) {
    margin-bottom: 0.583rem;
}

.mypage-main-wrap .bike-wrap .empty-content-item {
    padding: 1.167rem 0;
}

.mypage-main-wrap .bike-wrap .middle-box .inner {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mypage-main-wrap .bike-wrap .middle-box .inner svg{
    margin-right: 0.333rem;
}

.mypage-main-wrap .bike-wrap .pocket-wrap {
    margin-top: 1rem;
    padding: 1rem;

    text-align: center;

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

.mypage-main-wrap .pocket-wrap .each-col:not(:last-child) {
    border-right: 1px solid #dddddd;
}

.mypage-main-wrap .pocket-wrap .item-value {
    font-size: 1.167rem;
    font-weight: bold;
    color: #222222;
}

.mypage-main-wrap .pocket-wrap .item-title {
    margin-top: 0.417rem;

    font-size: 1rem;
    color: #777777;
}

.mypage-main-wrap .rsrv-wrap {
    padding: 1.667rem 0;

    border-bottom: 0.667rem solid #eeeeee;
}

.mypage-main-wrap .rsrv-item {
    padding: 1.167rem 1rem 1.167rem 0.5rem;

    border-radius: 0.333rem;
    overflow: hidden;

    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.mypage-main-wrap .rsrv-item .item-title {
    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.mypage-main-wrap .rsrv-item .item-title > span {
    color: #104343;
}

.mypage-main-wrap .rsrv-item .item-arrow {
    display: flex;
    justify-content: center;
    align-items: center;

    width: 2.667rem;
    height: 2.667rem;

    border: 1px solid #dddddd;
    border-radius: 50%;
}

.mypage-main-wrap .menu-wrap {
    border-bottom: 0.667rem solid #eeeeee;
}

.mypage-main-wrap .menu-item {
    padding: 1.333rem 0;
    
    font-size: 1.167rem;
    font-weight: bold;
    color: #222222;
}

.mypage-main-wrap .menu-item:not(:last-child) {
    border-bottom: 1px solid #eeeeee;
}

.mypage-main-wrap .menu-item .col > span {
    margin-left: 0.667rem;

    font-size: 1.083rem;
    color: #F24147;
}

.mypage-main-wrap .menu-item .col > span.active {
    font-size: 1.083rem;
    color: #2458F1;
}

.mypage-main-wrap .menu-item .item-icon {
    display: inline-block;

    margin-left: auto;
}

.mypage-main-wrap .item-desc {
    margin-top: 0.083rem;

    font-size: 1.083rem;
    color: #ADB4BA;
}

.mypage-main-wrap .logout-btn {
    padding: 1.333rem 0;
}

.mypage-main-wrap .pretty.p-switch.p-fill input:checked~.state:before { 
    background-color: #537541 !important;
}

.mypage-main-wrap .pretty.p-switch.p-fill {
    font-size: 2rem;
}

.mypage-main-wrap .pretty.p-switch .state label:after, .pretty.p-switch .state label:before {
    transform: scale(.7);
}

.mypage-main-wrap .pretty .state label:after,
.mypage-main-wrap .pretty .state label:before,
.mypage-main-wrap .pretty.p-svg .state .svg {
    top: calc((0% - (100% - 1em)) - 25%);
}

.mypage-main-wrap .pretty.p-switch.p-fill input:checked~.state label:after {
    left: 0.8em;
}

.mypage-main-wrap .info-wrap .info-profile{
    margin-bottom: 1.25rem;
}

.mypage-main-wrap .info-wrap .info-intro{
    margin-bottom: 0.583rem;

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

.mypage-main-wrap .info-intro-2 .info-star{
    display: inline-flex;
    align-items: center;
    gap: 0.167rem;
    position: relative;
}

.mypage-main-wrap .info-intro-2 .info-star::after{
    content: "|";

    margin: 0 0.583rem;

    color: #dddddd;
}

.mypage-main-wrap .info-intro-2 .info-star span{
    margin-left: 0.167rem;

    color: #999999;
}

.mypage-main-wrap .info-wrap .info-revenue{
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 1.25rem 1.667rem;

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

.mypage-main-wrap .info-revenue .revenue-text{
    font-size: 1.167rem;
    color: #ffffff;
}

.mypage-main-wrap .info-revenue .revenue-money{
    font-size: 1.5rem;
    font-weight: bold;
    color: #ffffff;
}

/*****#####===== 정보 수정 =====#####*****/
.mypage-info-wrap {
    margin: 0;
    padding: 2rem 0 0;
}

.mypage-info-wrap .user-signup-wrap {
    padding: 0;
}

.mypage-info-wrap .mypage-info-inner {
    border-radius: 0;
    border: none;
    background-color: transparent;
}

.mypage-info-wrap .form-title {
    background-color: transparent;
}

.mypage-info-wrap .form-group-wrap .form-group {
    margin-bottom: 2.667rem;

    border: none;
}

.mypage-info-wrap .form-group {
    border-top: none;
}

.mypage-info-wrap .form-control {
    height: auto;
}

.mypage-info-wrap .form-content {
    padding: 0;

    border: none;
}

.mypage-info-wrap .form-content .form-control{
    height: auto;

    padding: 1.167rem 1rem;

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

.form-group .form-title {
    padding: 0;

    border: none;
}
/* 
#mypage-info-page .form-group-wrap.underline {
    border-bottom: 6px solid #F2F4F5;
} */

#mypage-info-page .form-label {
    margin-top: 2rem;
    margin-bottom: 1.333rem;

    font-size: 1.5rem;
    font-weight: 700;
    color: #262C31;
}

#mypage-info-page .edit-btn {
    height: 4.25rem;

    padding: 1.167rem 2.333rem;

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

    background-color: #222222;
    border-radius: 0.333rem;
    overflow: hidden;
}

#mypage-info-page .auth-wrap {
    margin-bottom: 3rem;
}

#mypage-info-page .leave-wrap{
    display: flex;
    align-items: center;
    justify-content: end;

    margin-top: 1.583rem;
}

#mypage-info-page .leave-desc{
    color: #999999;
}

#mypage-info-page .leave-btn {
    margin-left: 0.5rem;
    padding: 0.4rem 0.5rem 0.25rem 0.5rem;

    color: #ffffff;

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

#mypage-info-page .btn-wrap {
    margin-top: 5.833rem;
}

#mypage-info-body .pretty .state label:after,
#mypage-info-body .pretty .state label:before,
#mypage-info-body .pretty.p-svg .state .svg {
    top: 0;

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

#mypage-info-body .terms-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#mypage-info-body a{
    color: #777777;
}

/*****#####===== 약관 상세 =====#####*****/
.terms-view-wrap .terms-title {
    margin-top: 2rem;
    font-size: 2rem;
    font-weight: bold;
    color: #222222;
}

.terms-content-wrap {
    margin-top: 1.833rem;
}

/*****#####===== 자전거 리스트 =====#####*****/
.bike-lists-wrap {
    padding: 2rem 0 0;
}

.bike-lists-wrap .lists-item {
    border: 1px solid #eeeeee;
    border-radius: 0.333rem;
    overflow: hidden;

    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.bike-lists-wrap .lists-item:not(:last-child) {
    margin-bottom: 1.333rem;
}

.bike-lists-wrap .lists-item .title-wrap {
    padding: 1.333rem;

    font-size: 1.167rem;
    font-weight: bold;
    color: #222222;

    background-color: #eeeeee;
}

.bike-lists-wrap .lists-item .content-wrap {
    padding: 1.333rem;

    font-size: 1.167rem;
    font-weight: 500;
    color: #555555;
}

.bike-lists-wrap .content-wrap .content-item:not(:last-child) {
    margin-bottom: 0.583rem;
}

/*****#####===== 자전거 등록 =====#####*****/
.bike-write-wrap .form-group-wrap {
    margin-top: 1.667rem;
}

.bike-write-wrap .form-group {
    margin-bottom: 2.667rem;
}

/*****#####===== 포인트, 쿠폰 리스트 =====#####*****/
.payment-lists .title-wrap {
    margin-bottom: 1rem;
}

.payment-lists .title-wrap .title-title {
    margin-bottom: 0.25rem;

    font-size: 1.667rem;
    font-weight: bold;
}

.payment-lists .title-wrap .title-desc {
    font-size: 1.167rem;
    color: #555555;
}

.payment-lists .wrap-title > span {
    font-size: 1.167rem;
    font-weight: 500;
    color: #369a85;
}

.payment-lists .info-wrap {
    padding: 2rem 0;

    background-color: #f4f4f4;
}

.payment-lists .info-content {
    padding: 1.167rem 1rem;

    font-size: 1.167rem;
    font-weight: bold;
    color: #104343;

    background-color: #ffffff;
    border: 1px solid #104343;
    border-radius: 0.333rem;
}

.payment-lists .lists-wrap {
    padding: 2.667rem 0 0;
}

.payment-lists .coupon-btn {
    height: 4.25rem;

    padding: 1.167rem 0;
}

/*****#####===== 예약 리스트 =====#####*****/
#mypage-rsrv_lists-body,
#mypage-rsrv_lists-page {
    background-color: #f4f4f4;
}

.rsrv-lists-wrap .lists-item{
    margin-bottom: 1.333rem;
    padding: 0;
}

/*=================================================
            support
=================================================*/
/*****#####===== 수신 동의 =====#####*****/
#support-agree-body {
    background-color: #f4f4f4;
}

.agree-lists-wrap {
    background-color: #f4f4f4;
}

.agree-lists-wrap .item-content {
    padding: 1rem 0;

    background-color: #ffffff;
    border-bottom: 1px solid #dddddd;
}

.agree-lists-wrap .content-title {
    font-size: 1.333rem;
    font-weight: 500;
    color: #222222;
}

.agree-lists-wrap .item-desc {
    padding: 1.667rem 0;

    font-size: 1.167rem;
    font-weight: 500;
    color: #555555;
}

/*****#####===== 고객 센터 =====#####*****/
.contact-view-wrap .page-header-title {
    padding-bottom: 2.667rem;
}

.contact-view-wrap .content-item:not(:last-child) {
    margin-bottom: 1.667rem;
}

.contact-view-wrap .item-title {
    margin-bottom: 0.5rem;

    font-size: 1.333rem;
    font-weight: 500;
    color: #777777;
}

.contact-view-wrap .item-value {
    font-size: 1.5rem;
    font-weight: bold;
    color: #222222;
}

/*****#####===== 약관 리스트 =====#####*****/
#support-terms-body {
    background-color: #f4f4f4;
}

.form-group-wrap .terms-wrap .state label span{
    color: #222222;
}

.terms-body {
    display: none;
}

.terms-body.show {
    display: block;
}

/*=================================================
            제휴신청
=================================================*/
.partnership-write-wrap .form-group .form-content{
    margin-bottom: 2.667rem;
}

/*=================================================
            알림
=================================================*/
.noti-lists-wrap .noti-item {
    padding: 1.333rem 0;
}

.noti-lists-wrap .noti-item:not(:last-child) {
    border-bottom: 1px solid #dddddd;
}

.noti-lists-wrap .noti-item .item-image {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 3.5rem;
    height: 3.5rem;
    
    background-color: #ffffff;
    border-radius: 50%;

    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
}

.noti-lists-wrap .noti-item .item-title {
    font-size: 1.167rem;
    font-weight: bold;
    color: #222222;
}

.noti-lists-wrap .noti-item .item-date {
    font-size: 1.083rem;
    font-weight: 500;
    color: #777777;
}

/*=================================================
            media (페달링 이야기/페달링 교육)
=================================================*/
.media-view-wrap .info-wrap {
    padding: 1.167rem 0 1.667rem;

    border-bottom: 0.667rem solid #eeeeee;
}

.media-view-wrap .info-wrap .info-channel {
    font-size: 1.167rem;
    font-weight: 500;
    color: #222222;
}

.media-view-wrap .info-wrap .info-title {
    margin-top: 1rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.media-view-wrap .info-wrap .info-desc {
    margin-top: 0.333rem;

    font-size: 1rem;
    color: #999999;
}

.media-view-wrap .info-desc .desc-item {
    font-weight: bold;
    color: #104343;
}

.media-view-wrap .info-desc .desc-count {
    font-weight: bold;
    color: #222222;
}

.media-view-wrap .content-wrap {
    padding: 1.667rem 0;
}

.media-view-wrap .content-wrap .content-title {
    margin-bottom: 1rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.media-view-wrap .content-wrap .content-desc {
    font-size: 1.167rem;
    color: #555555;
}

/*=================================================
            active-btn
=================================================*/
/*****#####===== 항목 선택 버튼(액티브 버튼)/경로선택 버튼 =====#####*****/
.active-btn{
    width: 100%;

    margin: 0;

    border: 1px solid #D8DAE3;
    border-radius: 0.333rem;
}

.active-btn .state label{
    display: inline-block;

    width: 100%;
    height: 100%;
    padding: 1.167rem;

    font-size: 1.167rem;
    font-weight: 600;
    text-align: center;
    color: #999fb5;

    text-indent: 0;
}

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

.active-btn input:checked~.state label{
    color: #369a85;

    background-color: #eafbf7;
    outline: 1px solid #369a85;
    border-radius: 0.333rem;
}

/*=================================================
            자동 배정 설정
=================================================*/
.option-contact-wrap .form-group-wrap .form-group .form-content{
    position: relative;
}

.option-contact-wrap .form-group-wrap .form-group .form-content .form-text{
    position: absolute;
    top: 50%;
    right: 1.333rem;

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

    transform: translateY(-50%);
}

/*=================================================
            내 평점
=================================================*/
.review-lists-wrap .lists-wrap .lists-item{
    margin-bottom: 1.333rem;
    padding: 0;

    box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
}

.review-lists-wrap .item-info{
    padding: 1.333rem;

    border-bottom: 2px solid #f4f4f4;
}

.review-lists-wrap .item-content{
    padding: 1.333rem;
}

.review-lists-wrap .content-grade{
    display: flex;
    align-items: center;

    margin-bottom: 1.167rem;
}

.review-lists-wrap .content-grade .grade-svg{
    margin-right: 0.167rem;
}

.review-lists-wrap .content-grade .grade-item{
    margin-right: 0.667rem;

    font-weight: bold;
}

.review-lists-wrap .content-grade .tag{
    border-radius: 0.167rem;
}

.review-lists-wrap .item-content .content-content{
    margin-bottom: 0.833rem;
}

.review-lists-wrap .item-content .content-date{
    color: #777777;
}

/*=================================================
            정비예약
=================================================*/
/*****#####===== 정비사 선택 =====#####*****/
.reservation-lists-wrap .page-header{
    margin-bottom: 2rem;
   
    border-bottom: 5px solid #dddddd;
}

.reservation-lists-wrap .srch_multi_wrap{
    padding-bottom: 2.667rem;
}

.reservation-lists-wrap .point-btn-1{
    padding: 1.333rem 0;
}

.reservation-lists-wrap .form-wrap{
    margin-bottom: 2.667rem;
}

.reservation-lists-wrap .reservation-title .form-title{
    padding-left: 1.333rem;
}

.reservation-lists-wrap .select-box {
    min-height: 4.417rem;
}

.reservation-lists{
    padding-top: 0.833rem;
}

.reservation-lists .lists-item{
    margin-bottom: 0.833rem;
    padding: 1.5rem 1.333rem;

    background-color: #f4f4f4;
    border: 1px solid #dddddd;
    border-radius: 0.333rem;
}

.reservation-lists .lists-item.active{
    background-color: #eafbf7;
    border: 1px solid #369a85;
}

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

.reservation-lists .item-img .user-image-wrap{
    width: 100%;
    height: 100%;
}

.reservation-lists .item-img .user-image{
    width: 100%;
    height: 100%;
}

.reservation-lists .item-title{
    padding-left: 0.667rem;

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

.reservation-lists .item-text{
    margin-bottom: 0.583rem;

    font-weight: bold;
    color: #777777;
}

.reservation-lists .item-distance{
    font-size: 0.833rem;
    font-weight: bold;
    color: #555555;
    text-align: end;
}

/*****#####===== 서비스 선택 =====#####*****/
.form-id-box svg {
    transition: all .3s;
    transform: rotate(180deg);
}

.form-id-box.collapsed svg {
    transform: rotate(0deg);
}

.reservation-write .form-content .content-item {
    padding: 0.5rem 0;
}

.reservation-write .content-wrap {
    margin-bottom: 1.167rem;
}

.reservation-write .content-item .item-title {
    font-size: 1.167rem;
    font-weight: 500;
    color: #222222;
}

.reservation-write .content-item .item-desc {
    font-size: 1rem;
    font-weight: 500;
    color: #369a85;
}

.reservation-write .content-item .item-price {
    font-size: 1.167rem;
    font-weight: bold;
    color: #222222;
}

.reservation-write .content-title .title-title {
    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.reservation-write .content-title .title-title {
    margin-bottom: 0.5rem;
}

.reservation-write .content-title .title-desc {
    font-size: 1rem;
    font-weight: 500;
    color: #369a85;
}

.reservation-write .pretty .state label:after,
.reservation-write .pretty .state label:before,
.reservation-write .pretty.p-svg .state .svg {
    top: -10%;

    font-size: 1.25rem;
}

.reservation-write .pretty .state label,
.reservation-write .pretty.p-svg input:checked~.state .svg {
    font-size: 1.25rem;
}

.reservation-write .total-wrap {
    display: flex;
    justify-content: space-between;

    margin-top: 1.333rem;
    padding-top: 2rem;

    border-top: 1px solid #999999;
}

.reservation-write .total-wrap .total-text{
    font-size: 1.333rem;
    font-weight: bold;
}

.reservation-write .total-wrap .total-price{
    font-size: 1.333rem;
    font-weight: bold;
    color: #104343;
}

.reservation-write .dropzone {
    min-height: unset;

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

    border: 1px dashed #dddddd;
}

/*****#####===== AI 견적 =====#####*****/
.loading-mask{
    position: fixed;
    z-index: 10000;
    left:0;
    top:0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
}
.loading{
    position: fixed;
    z-index: 10000;
    left:0;
    top:0;
    width: 100vw;
    height: 100vh;
    color:#fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction:column;
}

.loading .spinner {
    position: relative;
    width: 130px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loading .dot {
    position: absolute;
    width: 14px;
    height: 14px;
    background-color: #fff;
    border-radius: 50%;
    opacity: 0;
    animation: fadeInOut 1.2s linear infinite;
}

@keyframes fadeInOut {
    0%, 100% { opacity: 0; }
    50% { opacity: 1; }
}

.loading .dot:nth-child(1)  { transform: rotate(  0deg) translate(65px); animation-delay: 0s; }
.loading .dot:nth-child(2)  { transform: rotate( 30deg) translate(65px); animation-delay: 0.1s; }
.loading .dot:nth-child(3)  { transform: rotate( 60deg) translate(65px); animation-delay: 0.2s; }
.loading .dot:nth-child(4)  { transform: rotate( 90deg) translate(65px); animation-delay: 0.3s; }
.loading .dot:nth-child(5)  { transform: rotate(120deg) translate(65px); animation-delay: 0.4s; }
.loading .dot:nth-child(6)  { transform: rotate(150deg) translate(65px); animation-delay: 0.5s; }
.loading .dot:nth-child(7)  { transform: rotate(180deg) translate(65px); animation-delay: 0.6s; }
.loading .dot:nth-child(8)  { transform: rotate(210deg) translate(65px); animation-delay: 0.7s; }
.loading .dot:nth-child(9)  { transform: rotate(240deg) translate(65px); animation-delay: 0.8s; }
.loading .dot:nth-child(10) { transform: rotate(270deg) translate(65px); animation-delay: 0.9s; }
.loading .dot:nth-child(11) { transform: rotate(300deg) translate(65px); animation-delay: 1.0s; }
.loading .dot:nth-child(12) { transform: rotate(330deg) translate(65px); animation-delay: 1.1s; }

.loading p{
    font-size: 1.6em;
    margin-top: 1em;
}

@keyframes dots {
    0% { opacity: 0; }
    25% { opacity: 1; }
    100% { opacity: 1; }
}

.loading p span {
    opacity: 0;
    animation: dots 3s infinite;
}

.loading p span:nth-child(1) { animation-delay: 0s; }
.loading p span:nth-child(2) { animation-delay: 0.5s; }
.loading p span:nth-child(3) { animation-delay: 1s; }
.loading p span:nth-child(4) { animation-delay: 1.5s; }



/*****#####===== 결제 =====#####*****/
.order-wrap .content-wrap {
    padding: 1.667rem 0;

    border-bottom: 8px solid #eeeeee;
}

.order-wrap .form-content .form-noti {
    font-size: 1rem;
    color: #777777;
}

.order-wrap .form-content .form-noti > span {
    font-size: 1.167rem;
    font-weight: bold;
    color: #222222;
}

.order-wrap .content-wrap:not(:last-child) {
    border-bottom: 0.667rem solid #eeeeee;
}

.order-wrap .content-title-wrap {
    margin-bottom: 1.333rem;
}

.order-wrap .content-title-wrap .content-title {
    font-size: 1.667rem;
    font-weight: bold;
    color: #222222;
}

.order-wrap .content-title-wrap .content-desc {
    margin-top: 0.333rem;

    font-size: 1rem;
    font-weight: 500;
    color: #369a85;
}

.order-wrap .content-item-wrap .content-title {
    margin-bottom: 1rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.order-wrap .content-item-wrap .content-item:not(:last-child) {
    margin-bottom: 0.667rem;
}

.order-wrap .content-item {
    display: flex;
    justify-content: space-between;
}

.order-wrap .content-label {
    margin-bottom: 0.667rem;

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

.order-wrap .content-item .item-title {
    font-size: 1.167rem;
    font-weight: 500;
    color: #777777;
}

.order-wrap .content-item .item-value {
    font-size: 1.167rem;
    font-weight: 500;
    color: #222222;
}

.order-wrap .content-wrap .item-image {
    border-radius: 0.333rem;

    overflow: hidden;
}

.order-wrap .content-item[data-type="final"] .item-title {
    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.order-wrap .content-item[data-type="final"] .item-value {
    font-size: 1.333rem;
    font-weight: bold;
    color: #104343;
}

.order-wrap .pretty label {
    font-size: 1.167rem;
    font-weight: 500;
    color: #222222;
}

.order-wrap .content-wrap textarea {
    width: 100%;
    height: auto;
    padding: 1.167rem 1.333rem;

    font-size: 1.167rem;

    border: 1px solid #dddddd;
    border-radius: 0.333rem;

    resize: none;
}

#order-form-body.fancybox-active .fancybox-content {
    max-width: 100%;
}

#order-form-body .pretty.p-default.p-thick .state label:after,
#order-form-body .pretty.p-default.p-thick .state label:before {
    background-color: #ffffff;
}

#order-form-body .pretty .state label:after,
#order-form-body .pretty .state label:before,
#order-form-body .pretty.p-svg .state .svg {
    top: calc((0% - (100% - 1em)) - 20%);
}

.dc-wrap .dc-content-wrap{
    padding: 1.667rem 0 1.667rem 0;
}

.dc-wrap .dc-content-wrap:not(:last-child) {
    border-bottom: 8px solid #eeeeee;
}

.dc-wrap .dc-content-wrap .content-title{
    margin-bottom: 1.333rem;

    font-size: 1.667rem;
    font-weight: bold;
}

.dc-wrap .dc-content-wrap .form-control{
    padding: 1.167rem 1.333rem;
}

.dc-wrap .dc-content-wrap .form-control::placeholder{
    font-weight: bold;
    color: #999999;
}

.dc-wrap .content-desc-wrap{
    margin-top: 0.333rem;
}

.dc-wrap .content-desc-wrap .desc-title{
    color: #777777;
}

.dc-wrap .content-desc-wrap .desc-point{
    font-weight: bold;
}

.dc-wrap .dc-content-wrap .content-paymethod{
    display: flex;
    flex-direction: column;
}

.dc-wrap .content-paymethod .pretty{
    display: flex;
    align-items: center;
    
    font-size: 1.167rem;
}

.dc-wrap .content-paymethod .pretty:not(:last-child){
    margin-bottom: 1rem;
}

.dc-wrap .content-paymethod .pretty .valid-check{
    width: 2rem;
    height: 2rem;
}

.payment-wrap{
    margin-bottom: 1.667rem;
    padding: 0 1.333rem 1.667rem 1.333rem;

    border-bottom: 8px solid #eeeeee;
}

.payment-wrap .payment-desc-wrap{
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-bottom: 0.667rem;
}

.payment-wrap .payment-desc-wrap .desc-title{
    font-size: 1.167rem;
    font-weight: 600;
    color: #777777;
}

.payment-wrap .payment-desc-wrap .desc-number{
    font-size: 1.167rem;
    font-weight: 600;
}

.every-terms-wrap {
    border: 1px solid #d9d9d9;
    border-radius: 0.333rem;
}

.terms-wrap{
    padding: 1.167rem 1rem;
}

.terms-wrap .terms-title{
    font-size: 1.167rem;
    font-weight: 600;
}

.terms-wrap .pretty.p-svg .state .svg{
    font-size: 1.167rem;
}

.terms-wrap .term-show-btn{
    color: #777777;
}

.terms-wrap .terms-body{
    height: 10rem;
    margin-top: 1.333rem;
    padding: 1rem;

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

    border: 1px solid #dddddd;
    border-radius: 0.333rem;

    overflow: scroll;
}

/*****#####===== 자전거 이상증상 =====#####*****/
.breakdown-wrap .page-header-title{
    margin: 2rem 0 2.667rem 0;
    padding: 0;
}

.breakdown-wrap .breakdown-info-wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    margin-bottom: 0.667rem;
    padding: 2rem 0;

    background-color: #f4f4f4;
    border: 1px solid #eeeeee;
}

.breakdown-wrap .breakdown-info-wrap .info-img{
    margin-bottom: 1rem;
}

.breakdown-wrap .breakdown-info-wrap .info-desc{
    color: #999999;
}

.breakdown-wrap .breakdown-symptom{
    margin-bottom: 2.667rem;
}

.breakdown-wrap .breakdown-symptom .form-control{
    overflow-y: scroll;
}

.breakdown-wrap .dropzone{
    min-height: 3.75rem;
    padding: 1.333rem;

    color: #999999;

    border: 1px dashed #dddddd;
    border-radius: 0.333rem;
}

.breakdown-wrap .dropzone svg{
    width: 1.083rem;
    height: 1.083rem;
    margin-right: 0.333rem;
}

/*****#####===== 캘린더 =====#####*****/
.calendar-wrap .page-header-title{
    margin: 2rem 0 2.667rem 0;
    padding: 0;

    font-size: 2rem;
    font-weight: bold;
}

.calendar-wrap .fc .fc-view-harness{
    height: 28rem !important;

    border-radius: 0.333rem;

    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.14);
}

.calendar-wrap .inu_calendar.fc .fc-header-toolbar .fc-toolbar-title{
    font-size: 1.333rem;
    font-weight: bold;
    color: #369a85;
}

.calendar-wrap .inu_calendar.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
    color: #369a85;
}


.calendar-wrap .inu_calendar .fc-col-header{
    border-radius: 0.333rem 0.333rem 0 0;

    overflow: hidden;
}

.calendar-wrap .inu_calendar .fc-col-header-cell{
    position: relative;
    
    padding: 1rem 0;

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

    background-color: #104343;
}

.calendar-wrap .inu_calendar .fc-col-header-cell::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;

    width: 1px;
    height: 40%;

    background-color: #ffffff;

    transform: translateY(-50%);
}

.calendar-wrap .inu_calendar .fc-col-header-cell:last-child:before{
    background-color: transparent;
}

.calendar-wrap .inu_calendar .fc-daygrid-day-number{
    font-size: 1.333rem;
    color: #555555;

    background-color: none;
}

.calendar-wrap .inu_calendar.fc .fc-daygrid-day.fc-day.prevent_rsrv .fc-daygrid-day-number {
    color: #555555;

    background-color: #999999;
    border-radius: 50%;
}

.calendar-wrap .inu_calendar.fc .fc-daygrid-day.fc-day-sat .fc-daygrid-day-number{
    background-color: transparent;
}

.calendar-wrap .inu_calendar.fc .fc-daygrid-day.date_selected .fc-daygrid-day-number{
    background-color: #104343;
}

.calendar-wrap .time-select-group:not(:last-child){
    margin-bottom: 2.667rem;
}

.calendar-wrap .fc-daygrid-day-events,
.calendar-wrap .fc-daygrid-day-bg {
    display: none !important;
}

.calendar-wrap .attention-wrap {
    margin-top: 0.583rem;

    font-size: 1rem;
    font-weight: 500;
    color: #555555;
}

.calendar-wrap .detail-item {
    display: inline-block;
    width: 0.833rem;
    height: 0.833rem;
    text-align: center;
    border-radius: 50%;
}

.calendar-wrap .detail-item.depart {
    background-color: #104343;
}

.calendar-wrap .detail-item.arrival {
    background-color: #999999;
}

/*****#####===== 시간 =====#####*****/
.time-select-wrap {
    margin-top: 2.667rem;
}

.rsrv-time-wrap:not(:last-child){
    margin-bottom: 2.667rem;
}

.rsrv-time-wrap .time_lists_wrap .rsrv_item{
    margin-top: 0.875rem;
    padding: 1.167rem 0;

    border: 1px solid #dddddd;
    border-radius: 0.333rem;

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

    color: #777777;

    text-align: center;
}

.rsrv-time-wrap .time_lists_wrap .rsrv_item.active{
    background-color: #eafbf7;
    border: 1px solid #369a85;

    color: #369a85;
}

.rsrv-time-wrap .time_lists_wrap .rsrv_item[data-status="apply"] {
    background-color: #f6f6f6;
}

.rsrv-time-wrap .card-header .card-body{
    padding: 0;
}

/*****#####===== 특가상품 선택 =====#####*****/
.reservation-equipment-wrap .page-header-title{
    margin: 2rem 0 2.667rem 0;
    padding: 0 1.333rem;
}

.reservation-equipment-wrap .equipment-lists-wrap{
    margin-bottom: 1.667rem;
    padding: 0 1.333rem;

    border-bottom: 5px solid #dddddd;   
}

.reservation-equipment-wrap .lists-item{
    margin-bottom: 1.667rem;
}

.reservation-equipment-wrap .equipment-img{
    margin-bottom: 1rem;

    border-radius: 0.333rem;
    
    overflow: hidden;
}

.reservation-equipment-wrap .equipment-title{
    font-size: 1.167rem;
}

.reservation-equipment-wrap .equipment-pricebox{
    display: flex;
    align-items: center;

    margin-bottom: 0.5rem;
}

.reservation-equipment-wrap .pricebox-dc{
    margin-right: 0.5rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #df0000;
}

.reservation-equipment-wrap .pricebox-price{
    font-size: 1.333rem;
    font-weight: bold;
}

.reservation-equipment-wrap .equipment-total-wrap{
    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-top: 1.333rem;

    border-top: 1px solid #999999;
}

.reservation-equipment-wrap .equipment-total-wrap .total-text{
    font-size: 1.333rem;
    font-weight: bold;
}

.reservation-equipment-wrap .equipment-total-wrap .total-price{
    font-size: 1.333rem;
    font-weight: bold;
    color: #104343;
}

.reservation-equipment-wrap .btn.btn-default{
    width: 100%;

    background-color: #104343;
}

.reservation-equipment-wrap .btn.equipment_btn{
    display: block;

    width: 100%;

    background-color: #e2a747;
}

.goods-count-btn .btn {
    width: 3.333rem;
    height: 3.333rem;
    padding: 0 1.167rem;
}

.goods-count-btn {
    width: auto;
}

.goods-count-num {
    width: 4rem;
}

/*****#####===== 특가상품 선택 - 선택상품 =====#####*****/
.equipment-item{
    padding-bottom: 1.333rem;
    margin-bottom: 1.333rem;

    border-bottom: 1px solid #dddddd;
}

.equipment-item:last-child{
    margin-bottom: 0;

    border: 0;
}

.equipment-item .d-flex{
    justify-content: space-between;
}

.equipment-item .item-content-wrap{
    display: flex;
}

.equipment-item .item-img{
    width: 6.083rem;
    height: 6.083rem;
    margin-right: 1.417rem;

    border-radius: 0.333rem;

    overflow: hidden;
}

.equipment-item .item-title{
    font-size: 1.167rem;
}

.equipment-item .item-pricebox{
    display: flex;
    align-items: center;

    margin-bottom: 0.833rem;
}

.equipment-item .item-dc{
    margin-right: 0.5rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #df0000;
}

.equipment-item .item-price{
    font-size: 1.333rem;
    font-weight: bold;
}

.equipment-item .item-ea{
    font-size: 1.167rem;
}

.equipment-item .form-control{
    width: 10.667rem;
    padding: 0.833rem;
}

.equipment-item .goods-count-btn .gds_count_btn{
    display: flex;
    align-items: center;
    justify-content: center;
}

.equipment-item .item-ea .gds_count_btn:last-child{
    border-right: 1px solid #dddddd;
}

.equipment-item .btn.equipment_btn{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 2rem;
    height: 2rem;
    padding: 0;

    border-radius: 100%;
    background-color: transparent;
}

/*****#####===== 특가상품 선택 - 상품상세 =====#####*****/
.equipment-detail-wrap .detail-title{
    margin: 4.25rem 0 1rem 0;
    
    font-size: 1.667rem;
    font-weight: bold;
}

.equipment-detail-wrap .detail-desc{
    margin-bottom: 1.667rem;
    
    font-size: 1.167rem;
    font-weight: bold;
    color: #555555;
}

.equipment-detail-wrap .detail-price-wrap{
    padding-bottom: 2rem;
    
    border-bottom: 1px solid #dddddd;
}

.equipment-detail-wrap .detail-price-wrap .price-title{
    font-size: 1.167rem;
    font-weight: bold;
    color: #555555;
}

.equipment-detail-wrap .detail-price-wrap .price-pricebox{
    display: flex;
    align-items: center;
}

.equipment-detail-wrap .price-pricebox .pricebox-dc{
    margin-right: 0.667rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #df0000;
}

.equipment-detail-wrap .price-pricebox .pricebox-price-1{
    margin-right: 0.333rem;

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

.equipment-detail-wrap .price-pricebox .pricebox-price-2{
    font-weight: bold;
    color: #999999;
    text-decoration: line-through;
}

.equipment-detail-wrap .btn-default{
    display: block;

    width: 100%;
}

/*=================================================
            order-wrap
=================================================*/
.order-wrap .page-header {
    margin: 1rem 0 0;
}

.order-wrap .content-profile .text-name{
    margin-bottom: 0.167rem;

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

.order-wrap .content-profile .text-grade{
    display: flex;
    align-items: center;
}

.order-wrap .content-profile .text-grade svg{
    margin-right: 0.167rem;
    
    width: 1.333rem;
    height: 1.333rem;
}

.order-wrap .content-profile .text-grade span{
    font-size: 1.167rem;
}

.order-wrap .content-profile .profile-phone{
    display: flex;
    align-items: center;
    justify-content: center;
    
    width: 3.333rem;
    height: 3.333rem;

    background-color: #eeeeee;
    border-radius: 100%;
    overflow: hidden;
}

/*=================================================
            drawer
=================================================*/
.drawer-alert[data-layout="blind"].show {
    max-height: 40%;
}

.drawer-alert .drawer-title {
    position: relative;

    padding: 1.333rem 0;

    font-size: 1.333rem;
    font-weight: bold;
    text-align: center;

    border-bottom: 1px solid #eeeeee;
}

.drawer-alert .close-btn {
    position: absolute;
    right: 1.333rem;
    top: 50%;
    transform: translateY(-50%);
}

.drawer-alert .drawer-content {
    padding: 0;
}

.drawer-alert .drawer-content .content-info {
    padding: 1.333rem 0;

    border-bottom: 1px solid #eeeeee;
}

.drawer-alert .info-item-wrap .item-title {
    margin-bottom: 0.083rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.drawer-alert .content-info .info-phone {
    padding: 1rem;

    background-color: #eeeeee;
    border-radius: 50%;
}

/*=================================================
            [Component] info_drawer_alert.php
=================================================*/
.component-wrap[data-comp="info_drawer_alert"] {
    border-radius: 0 0 0.833rem 0.833rem;
    overflow: hidden;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="title"]{
    position: relative;

    padding: 1.333rem 0;

    border-bottom: 1px solid #eeeeee;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="title"] .content-wrap{
    font-size: 1.333rem;
    font-weight: bold;
    text-align: center;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="user"]{
    margin-bottom: 1.333rem;
    padding: 1.333rem 0;

    border-bottom: 1px solid #eeeeee;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="user"] .text-name{
    margin-bottom: 0.083rem;

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

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="user"] .profile-phone{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 3.333rem;
    height: 3.333rem;

    border-radius: 100%;
    background-color: #eeeeee;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="noti"] .content-wrap{
    margin-bottom: 1rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="noti"] .tag{
    margin-right: 0.5rem;
    padding: 0.5rem 1rem;

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

    border-radius: 1.333rem;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="content"] .content-wrap{
    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;

    line-height: 1.9;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="content"] .on{
    color: #369a85;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="content"] .off{
    color: #df0000;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="content"] .text-address{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="content"] .text-time{
    font-size: 1.333rem;
    font-weight: bold;
}

.component-wrap[data-comp="info_drawer_alert"] .info_drawer_wrap[data-type="button"]{
    margin-top: 2.667rem;
    padding-bottom: 1rem;
}

.empty-wrap {
    height: 60vh;
}

.empty-wrap[data-type="sm"] {
    height: 45vh;
}

.empty-wrap .empty-image {
    margin-bottom: 1rem;
}

.empty-wrap .empty-title {
    margin-bottom: 1.333rem;

    font-size: 1.5rem;
    font-weight: bold;
    color: #222222;
}

.empty-wrap .empty-content {
    margin-bottom: 1.333rem;

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

.copy_row {
    margin-bottom: 1rem;

    border-bottom: 1px solid #dddddd;
}

/*=================================================
            리뷰 작성
=================================================*/
.review-write-wrap .info-wrap {
    padding: 2rem 0 1.667rem;

    border-bottom: 1px solid #dddddd;
}

.review-write-wrap .info-wrap .info-img {
    width: 6rem;
    height: 6rem;

    margin: 0 auto;
}

.review-write-wrap .info-wrap .info-title {
    padding-top: 1rem;

    font-size: 1.333rem;
    font-weight: bold;
    color: #222222;
}

.review-write-wrap .info-wrap .info-grade {
    padding-top: 0.167rem;

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

.review-write-wrap .info-wrap .info-address {
    padding-top: 1rem;

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

.review-write-wrap .info-wrap .info-address > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 1.667rem;
    height: 1.667rem;

    background-color: #eeeeee;
    border-radius: 50%;
}

.review-write-wrap .tag {
    padding: 0.5rem 1rem;

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

    border-radius: 1.333rem;
}

.review-write-wrap .content-wrap {
    padding: 2.667rem 0 0;
}

.review-write-wrap .content-wrap .content-title {
    padding-bottom: 1rem;

    font-size: 1.667rem;
    font-weight: bold;
    color: #222222;
}

.review-write-wrap .content-wrap .content-desc {
    padding-bottom: 2.667rem;

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

.review-write-wrap .dropzone {
    min-height: unset;
    padding: 0;

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

    border: 1px dashed #dddddd;
}

.review-write-wrap .dropzone.dz-clickable .dz-message {
    margin: 1.167rem 0;
}

.review-write-wrap .form-group-wrap .form-group {
    margin-bottom: 0.667rem;
}

.rating-star-wrap .rating-star-o:before {
    content: '';
    display: inline-block;
    width: 1.667rem;
    height: 1.667rem;

    background: url(/front/data/img/app/star_off.svg) center no-repeat;
}

.rating-star-wrap [class^='rating-star']:not(.view):hover:before,
.rating-star-wrap [class^='rating-star'].active:before,
.rating-star-wrap [class^='rating-star']:not(.view):hover~[class^='rating-star']:before,
.rating-star-wrap [class^='rating-star'].active~[class^='rating-star']:before {
    content: '';

    background: url(/front/data/img/app/star_on.svg) center no-repeat;
}




.review_pop_wrap .popover {
    transform: translate3d(-124px, 27px, 0px) !important;
}

.review_pop_wrap .arrow {
    display: none !important;
}

.review_pop_wrap .popover-body {
    min-width: 11.667rem;

    padding: 0;
}

.review_pop_wrap .review-pop-btn {
    padding: 1rem 0;

    font-size: 1.167rem;
    text-align: center;
    color: #222222;
}

.review_pop_wrap .review-pop-btn[data-type="est"] {
    color: #064b96;
}

.review_pop_wrap .review-pop-btn:not(:last-child) {
    border-bottom: 1px solid #dddddd;
}