/*=================================================
            tutorial
=================================================*/
#user-tutorial-body #gnb-wrap {
    display: none;
}

.tutorial-wrap {
    margin-bottom: 8.333rem;
    padding-top: 1.333rem;
}

.tutorial-wrap .slick-wrap {
    padding: 0;
}

.tutorial-wrap .slide-image {
    border-radius: 0.5rem;
    overflow: hidden;
}

.tutorial-wrap .slide-content {
    margin-top: 2rem;
}

.tutorial-wrap .slick-dots {
    bottom: 8rem;
}

.tutorial-wrap .slide-content .content-title {
    margin-bottom: 1.25rem;

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

.tutorial-wrap .slide-content .content-desc {
    font-size: 1.333rem;
    color: #555555;
}

.tutorial-wrap .slide-content .content-desc > span {
    color: #369a85;
}

.tutorial-wrap .custom-slick-next.slick-disabled .btn[data-type="next"] {
    display: none;
}

.tutorial-wrap .custom-slick-next .btn[data-type="end"] {
    display: none;
}

.tutorial-wrap .custom-slick-next.slick-disabled .btn[data-type="end"] {
    display: block;
}

/*=================================================
            float menu
=================================================*/
#float-menu .float-menu-item {
    position: relative;

    height: 100%;
}

#float-menu .float-menu-item .item-title {
    color: #777777;
}

#float-menu .float-menu-item.active .item-title {
    color: #222222;
}

#float-menu .float-menu-item[data-type="main"] .item-icon {
    position: absolute;

    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);

    width: 5.5rem;
    height: 5.5rem;
}

#float-menu .float-menu-item[data-type="main"] .icon-open {
    display: block;
    opacity: 1;
}

#float-menu .float-menu-item[data-type="main"].show .icon-open {
    display: none;
    opacity: 0;
}

#float-menu .float-menu-item[data-type="main"] .icon-close {
    display: none;
    opacity: 0;
}

#float-menu .float-menu-item[data-type="main"].show .icon-close {
    display: block;
    opacity: 1;
}

#float-menu .float-menu-item[data-type="main"] .icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;

    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #104343;

    width: 100%;
    height: 100%;

    background-color: #104343;
    border-radius: 2.833rem;

    cursor: pointer;
    z-index: 1;
}

#float-menu .float-menu-item[data-type="main"] .item-title {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);

    width: 100%;
}

#float-menu .float-menu-item[data-type="main"] .icon-drawer {
    position: absolute;

    bottom: 0;
    left: 50%;
    transform: translateX(-50%);

    width: 5.5rem;
    height: 5.5rem;
    padding: 0.5rem;

    background-color: #104343;
    border-radius: 2.833rem;
    overflow: hidden;

    z-index: 0;
    
    transition: height 0.3s;
}

#float-menu .float-menu-item[data-type="main"].show .icon-drawer {
    /* height: 21.75rem; */
    height: 26.25rem;
}

#float-menu .float-menu-item[data-type="main"] .drawer-item {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 4.5rem;

    color: #ffffff;

    background-color: #369a85;
    border: 1.5px solid #b2d4cc;
    border-radius: 50%;
}

#float-menu .float-menu-item[data-type="main"] .drawer-item:not(:last-child) {
    margin-bottom: 0.667rem;
}

.float-menu-wrap .point-svg {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 2.667rem;
    height: 2.667rem;

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

.float-menu-wrap .point-svg > svg{
    width: 20px;
}

/*=================================================
            partnership
=================================================*/
/*****#####===== main =====#####*****/
.partnership-main-wrap .section-wrap {
    padding: 3.333rem 0;
}

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

.section-wrap .section-title {
    margin-bottom: 3.333rem;

    font-size: 1.5rem;
    font-weight: bold;
    text-align: center;
    color: #222222;
}

.section-wrap .section-title > span {
    color: #104343;
}

.section-wrap .section-image,
.section-wrap .item-image {
    border-radius: 0.333rem;

    overflow: hidden;
}

.section-wrap[data-type="partnership_process"] {
    background-color: #f1f4f5;
}

.section-wrap[data-type="partnership_process"] .section-item {
    padding: 1.167rem;

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

.section-wrap[data-type="partnership_process"] .section-item .item-subtitle {
    margin-bottom: 0.167rem;

    font-weight: 500;
    color: #104343;
}

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

.section-wrap[data-type="partnership_subscribe"] {
    padding: 3.333rem 0 0;
}

/*=================================================
            review
=================================================*/
/*****#####===== lists =====#####*****/
.review-lists-wrap .lists-wrap .lists-item {
    margin-top: 1.333rem;

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

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

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

    border-bottom: 1px solid #eeeeee;
}

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

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

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

.review-lists-wrap .item-content-wrap .grade-item {
    margin-left: 0.167rem;

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

.review-lists-wrap .item-content-wrap .content-image {
    border-radius: 0.167rem;
    overflow: hidden;
}

.review-lists-wrap .item-content-wrap .content-desc {
    font-size: 1.167rem;
    font-weight: 500;
    color: #222222;
}

.review-lists-wrap .item-content-wrap .content-date {
    margin-top: 0.833rem;

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

.review-lists-wrap .item-content-wrap .tag {
    margin-left: 0.667rem;
}

/*****#####===== view =====#####*****/
.review-view-wrap .slick-wrap,
.review-view-wrap .slide-wrap {
    padding: 0;
}

.review-view-wrap .info-wrap {
    padding: 1rem 0;

    font-size: 1.167rem;
    text-align: center;

    background-color: #eafbf7;
}

.review-view-wrap .info-wrap .info-image {
    margin-right: 0.5rem;
}

.review-view-wrap .info-wrap .info-image > img {
    width: 2rem;
    height: 2rem;

    border-radius: 50%;
}

.review-view-wrap .info-wrap > span {
    color: #104343;
}

.review-view-wrap .slick-dots {
    bottom: 0.833rem;
}

.review-view-wrap .slick-dots li {
    width: 0.333rem;
    height: 0.333rem;
}

.review-view-wrap .slick-dots li > button {
    background-color: #dddddd;
}

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

.review-view-wrap .content-wrap {
    padding-top: 1.833rem;
}

.review-view-wrap .content-wrap .content-title {
    margin-bottom: 1.583rem;

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

.review-view-wrap .content-wrap .content-tag {
    display: flex;
    gap: 0.5rem;

    margin-top: 1.167rem;
}

.review-view-wrap .content-wrap .content-content {
    margin-top: 0.833rem;

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

.review-view-wrap .content-wrap .content-date {
    margin-top: 1.333rem;

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

/*=================================================
            페달링 이야기
=================================================*/
/*****#####===== lists =====#####*****/
.story-lists-wrap .item-info {
    padding: 1.167rem 0;
}

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

.story-lists-wrap .lists-wrap .lists-item {
    padding: 0;
}

/*=================================================
                Drawer Select
=================================================*/
#select_drawer.show{
    max-height: 100%;
}

#select_drawer .select_wrap{
    position: relative;
    overflow: hidden;
    padding: 10px 3rem;
}

#select_drawer .select_wrap:not(.multiple):before{
    content: '';
    position: absolute;
    width: 50%;
    height: 40px;
    top: 50%;
    left: 50%;

    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;

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

#select_drawer .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;

    text-align: center;
    font-size: 12px;
    color: #CCCCCC;
}

#select_drawer .select_wrap:not(.multiple) .swiper-slide.swiper-slide-active{
    font-size: 20px;
    color: #000000;
}

#select_drawer .swiper-slide .slide_item{
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 0 25px;
}

#select_drawer .select_confirm_btn{
    padding: 1.5rem;

    border-radius: 0;
}

#select_drawer .select_wrap.multiple .swiper-slide{
    justify-content: left;

    text-align: left;
    font-size: 14px;
    color: #888888;
}

#select_drawer .select_wrap.multiple .multiple_item.active{
    font-size: 16px;
    color: #000000;
}

#select_drawer .select_wrap.multiple .multiple_item.active:before{
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    left: 0;

    background-image: url('/front/data/img/component/icon_route_main.svg');
}

#select_drawer .adding_item_input{
    width: 100%;
    padding: 6px;

    border: 1px solid #ced4da;
}

/*=================================================
                Main
=================================================*/
#main-index-body #gnb-wrap {
    display: none;
}

.main-map-wrap {
    position: relative;
    overflow: hidden;
}

.main-map-wrap .map_container {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.main-map-wrap .map-button-wrap {
    position: fixed;
    top: 1.333rem;
    left: 50%;
    
    width: 100%;
    padding: 0 1.333rem;

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

.main-map-wrap .map-address {
    padding: 1.167rem 1.333rem;

    font-size: 1.167rem;
    color: #222222;
    
    background: #ffffff;
    border-radius: 0.333rem;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.main-map-wrap .map-address .open_address_drawer {
    cursor: crosshair;
}

.main-map-wrap #address_drawer.show{
    max-height: 100%;
    
    border-radius: 0;
}

.main-map-wrap #address_drawer .address_wrap{
    height: 100%;
}

.main-map-wrap .btn.btn-func {
    padding: 0.667rem;

    background-color: #ffffff;
    border-radius: 0.333rem;

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

.main-map-wrap .favorite-btn {
    padding: 0;
}

.main-map-wrap .favorite-btn .favorite-icon-off {
    display: block;
}

.main-map-wrap .favorite-btn.active .favorite-icon-off {
    display: none;
}

.main-map-wrap .favorite-btn .favorite-icon-on {
    display: none;
}

.main-map-wrap .favorite-btn.active .favorite-icon-on {
    display: block;
}

.main-map-wrap .show_favorite_btn.active g > path {
    stroke: #fa0 !important;
    fill: #fa0 !important;
}

#address_drawer.show{
    max-height: 100%;
    
    border-radius: 0;
}

#address_drawer .address_wrap{
    height: 100%;
}

#address_drawer .drawer-header{
    position: relative;

    min-height: 4.667rem;
    padding: 1.167rem 0;

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

    border-bottom: 1px solid #dddddd;
}

#address_drawer .drawer-header .btn{
    position: absolute;

    top: 50%;
    left: 0;

    transform: translateY(-50%);
}