


.main-section {
    margin-bottom: 68px;
}

.breadcrumb {
    overflow-x: auto;
    justify-content: start;
    flex-wrap: nowrap;
    white-space: nowrap;
    background-color: transparent;

    .breadcrumb-item {
        font-size: 0.8rem;

    }
}

@include media-breakpoint-down(sm) {
    .breadcrumb-item + .breadcrumb-item {
        padding-right: 1rem;
    }
}

.has-search .form-control {
    padding-left: 0.75rem;
}

.has-search .form-control-feedback {
    position: absolute;
    right:1rem;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}

.duration-area {
    .modal {
        &.modal-duration {
            .modal-dialog {
                width: 300px;
                position: absolute;
                top: 135px;
                left: 0;
                right: 0;
                margin: auto;
                @include media-breakpoint-up(lg) {
                    right: 10%;
                }   
                @include media-breakpoint-up(xl) {
                    right: 20%;
                }   
            }
        }
    }
    .fade {
        transition: opacity 0s linear;
    }
    .modal.fade .modal-dialog {
        transition: transform 0s ease-out;
        transform: translate(0, 0);
    }
}
.modal-backdrop {
    background-color: transparent;
}

.wide-wrap{
    position:relative;
    margin:0 calc(50% - 50vw);
    overflow:hidden;
}








.drawer-menu {
    background: #fff;
    position: absolute;
    z-index: 10;
    top: 53px;
    left: 0;
    overflow-x: hidden;
    width: 0;
    height: calc(100% -  53px);
    transition: .3s;
    max-width: 350px;
    white-space: nowrap;

    &.open {
        width: 90%;
    }

         
        a {
            text-decoration: none;
            color: black;
        }
         
        ul, ul li {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        dl {
            margin: 0;
        }

        dt {
            border-bottom: 1px solid #ccc;
            padding: 10px 0 10px 30px;
            position: relative;
            font-weight: normal;

        }
         
        .sub-menu-ttl {
            border-bottom: 1px solid #ccc;
            padding: 10px 0 10px 50px;
            margin:0px;
            
            position: relative;
        }
         
        dd {
            margin:0px;
            
        }
         
         
        .drawer-menu3 li {
            padding: 10px 0 10px 70px;
            border-bottom: 1px solid #ccc;
            background: none;

            &:hover {
                background-color: map-get($globalColor,light);
            }

        }

        .menu-link li {
            padding: 10px 0 10px 50px;
            border-bottom: 1px solid #ccc;

            &:hover {
                background-color: map-get($globalColor,light);
            }

        }

                 
        .menu-ttl:after {
            content: "\f054";
            font-family: "Font Awesome 5 Free";
            font-weight: bold;
            position: absolute;
            left: 10px;
            top: 10px;
        }
         
        .menu-ttl.open:after {
            content: "\f078";
            font-family: "Font Awesome 5 Free";
            font-weight: bold;
            position: absolute;
            left: 10px;
            top: 10px;
        }
         
        .sub-menu-ttl:after {
            content: "\f054";
            font-family: "Font Awesome 5 Free";
            font-weight: bold;
            position: absolute;
            left: 30px;
            top: 10px;
        }
         
        .sub-menu-ttl.openAcd:after {
            content: "\f078";
            font-family: "Font Awesome 5 Free";
            font-weight: bold;
            position: absolute;
            left: 30px;
            top: 10px;
        }
         

            
}
         
         
.dropdown-item {
    border-bottom: 1px solid map-get($globalColor,lightgray);
    &:last-child {
        border-bottom: none;
    }
    &.active {
        background-color: inherit;
        color: map-get($globalColor,primary);
        cursor: default;

        &:after {
            content: "\f00c";
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            padding-left: 0.5rem;
        }
    }
}



.overlay {
    left: 0;
    width: 0%;
    top: 53px;
    height: calc(100% -  53px);

    display: block;
    position: absolute;
    background: #000;
    opacity: 0.5;
    z-index: 5;
    transition: .3s;

    &.open {
        width: 100%;
    }

}

