//공통
.sub-contents-wrap{
    flex:1; 
    overflow:auto; 
    padding:40px 2.9908vw 50px; 
    margin-left:40px; 
    transition:all 0.3s;
    .reset-btn-wrap{//필터초기화
        margin: 20px 0;
        .reset-btn-box{
            text-align: right;
            button{
                width: 92px;
                height: 36px;
                font-weight: 700;
                font-size: 80%;
                color:rgb(var(--bs-white));
                border-radius: 7px;
                background:rgb(var(--bs-red-primary));
            }
        }
    }
}
//-------------------------------------------------통합광고관리-------------------------------------------------//
//통합 광고 관리 페이지 adv-manager
.adv-manager{
    .search-wrap{
        margin-bottom: 25px;
        .search {
            .term {
                label {
                    width:290px;
                }
            }
        }
    } 
    .media-advertiser{
        .d-flex {
            .btn-primary{ //통합광고관리 매체 - 목표수량 버튼
                width: 113px;
                height: 38px;
                margin-left:15px;
                background:rgb(var(--bs-red-primary));
                border-radius: 7px;
                font-size: 14px;
                font-weight: 700;
                color: rgb(var(--bs-white));
            }
        }
    }
    div.dt-button-collection{//통합광고관리 메뉴버튼
        padding:0;    
        .export{display: none;}
        button{text-align: left; font-size:90%; padding:0.3rem 0 0.3rem 0rem; width:100%;         
            &:hover,&.dt-button-active{color:rgb(var(--bs-white)); background-color: rgb(var(--bs-red-primary));
                > span{text-indent: 0.4rem;
                    i.bi::before{animation:sidebarShake 0.3s infinite linear alternate;}
                }            
            }
            span{display: block; padding:0.3rem 0 0.3rem 0.5rem; transition: all 0.4s;}
            span.dt-down-arrow{display:none;}
            &.active span{background-color: rgb(var(--bs-gray-300));
            } 
        } 
        .dt-btn-split-wrapper{ transition:0.2s; }
        .dt-btn-split-wrapper:active:not(.disabled) button{color:rgb(var(--bs-blue-science));}
        .dt-btn-split-wrapper.active:not(.disabled) button{background-color:transparent;color:rgb(var(--bs-red-origin));
            &:hover{background-color:rgb(var(--bs-gray-200));}
            &.dt-btn-split-drop{background-color:transparent;}
        }
        h3{font-size: 1.25em !important;}
    }
    .tab-wrap{
        margin:60px 0 0;
    }
    //캠페인/광고세트/광고 클릭시 보이는 content
    .tab-content{position:relative;padding:0.75rem 0.75rem 1.75rem; border-radius:0 0 10px 10px; border:1px solid rgb(var(--bs-gray-gainsBoro)); border-top:0; background:rgb(var(--bs-white));
        .btn-wrap{margin:0 0 12px;
            .btn{height:27px; padding:0 15px; margin:0 0 5px; font-size:0.813rem; color:rgb(var(--bs-dark-metal)); line-height:27px; border-radius:14px;
                &:hover,
                &.active{color:rgb(var(--bs-white));}
            }
        }
    }
    .carelabs_btn{
        width: 150px;
        height: 43px;
        padding: 2px 7px;
        white-space: normal;
        text-align: left;
        line-height: 1.1;
        border: 1px solid rgb(var(--bs-gray-border));
        border-radius: 5px;
        background: rgb(var(--bs-white));
        overflow-y: hidden;
        font-size: 85%;
    }
    .carelabs_btn.active{
        color: rgb(var(--bs-red-primary));
        border-color: rgb(var(--bs-red-primary));
    }
}

//통합광고관리 - 캠페인,광고세트,광고 tab
.nav-tabs{
    > li{flex:1; margin:0; padding:0;}
    .nav-link{position:relative; width:100%; overflow:hidden; padding:20px 0; font-size:1.250rem; color:rgb(var(--bs-dark-metal)); border:0; border-top-left-radius:10px; border-top-right-radius:10px; background:rgb(var(--bs-silver-aluminium)); display: flex; justify-content: center; align-items: center;
        &:focus,
        &:hover,
        &:active{border:0;}
        &.active{
            padding:19px 0 20px;
            border:1px solid rgb(var(--bs-dark-sea));
            border-bottom:0;
            &:before{
                content:'';
                width:100%;
                height:3px;
                position:absolute;
                top:0;
                left:0;
                background:rgb(var(--bs-red-primary));
            }
        }
        .selected{
            display:none;
            padding:.25em 1.75em;
            margin:0 0 0 0.75em;
            background-color: rgb(var(--bs-blue-biloba-flower));
            border-radius:14px;
            color:rgb(var(--bs-white));
            font-size: 80%;
            transition:0.5s;
        }
    } 
}

//회계관리 - 미수금 관리 - 입금내역
.regi-wrap{margin:0 0 20px; padding:20px; text-align:center; border:1px solid rgb(var(--bs-gray-border)); background:rgb(var(--bs-white));
    input{padding:.375rem .5rem; font-size:13px;
        &:not(:first-child){margin:0 0 0 5px;}
        &.form-control.data-calendar {
            padding:14px 10px;
            width:120px;
        }
    }
    .btn{min-width:100px; font-size:13px;}
}

//회계관리 - 미수금 관리 - 레이아웃
.half{
    .search-wrap{margin:0 0 30px;
        .search{padding:35px 20px;}
    }
    .table-default{min-width:600px;}
}

//통합광고관리 - 광고주/메체/매체별광고주 버튼
.client-list{
    .row{--bs-gutter-x:8px; overflow-y:auto;
        .col{flex:0 0 auto; width:calc(100% / 7); margin:0 0 8px; position:relative;
            & > .inner{position:relative; height:100%; min-height:45px; box-sizing:border-box;border-radius:5px;
                &.active{color:rgb(var(--bs-red-primary)); border-color:rgb(var(--bs-red-primary));}
            }
            button{
                width:100%;
                height:100%;
                position:relative;
                padding:2px 7px;
                white-space:normal;
                text-align:left;
                line-height:1.1;
                background:rgb(var(--bs-white));
                border:1px solid rgb(var(--bs-gray-border));
                overflow:hidden;
                font-size: 85%;
                // &:hover{
                //     background:rgba(var(--bs-red-primary),0.7);
                //     span {position:relative;z-index:1;color:rgb(var(--bs-white));}
                // }
                &.on{//on이 먼저 선언되어야함 그 다음이 active
                    color: rgb(var(--bs-white));
                    background-color:rgb(var(--bs-gray-700));
                    + .progress {
                        .txt {
                            color:rgb(var(--bs-white));
                        }
                    }

                }
                &.active{
                    position:relative;
                    z-index:1;
                    background:rgb(var(--bs-black-cement));
                    border:1px solid rgb(var(--bs-black-cement));
                    box-shadow:0 3px 7px rgb(var(--bs-gray-cloud));
                    color: rgb(var(--bs-white));font-weight:bold;
                    + .progress {
                        .txt {
                            color:rgb(var(--bs-white));
                        }
                    }
                }
                &.alert{margin:0;
                    &::before{position:absolute; top:0; left:0; width:100%; height:3px; content:''; background:rgb(var(--bs-red-primary));}
                }
                span{
                    display: inline-block;
                }
            }
            .progress{position:absolute; bottom:0; left:0; width:100%; height:3px; overflow:visible; border-radius:0; background:none; z-index:1;
                .progress-bar{height:3px; background:rgb(var(--bs-yellow-orange));}
                .txt{position:absolute; right:10px; bottom:3px; font-size:0.6rem;}
            }
        }
    }
    &.biz{
        .row{
            .col{width:160px;}
        }
    }
}

//통합광고관리 - 기타광고관리/자동화관리 - 매체/광고주/이벤트번호/이벤트구분
.section{
    + .section{margin:50px 0 0;}
    // &.custom-margin-box-1{
    //     margin-top:20px;
    // }
    &.media-advertiser{//통합광고관리 - 매체별광고주
        .filter_media_btn .media_account_icon{
            width: 16px;
            height:16px;
            margin-bottom: -2px; 
        }
        .filter_media_btn .media_account_name{
            padding-left: 0.5rem;
            width: 87%;
        }
        .filter_media_btn .facebook{
            // background: url(/img/ico_facebook.png);
            @include bg('ico_facebook.png', 0, 0);//var.scss
            background-size: cover;
        }
        .filter_media_btn .google{
            // background: url(/img/ico_google.png);
            @include bg('ico_google.png', 0, 0);//var.scss
            background-size: cover;
        }
        .filter_media_btn .kakao{
            // background: url(/img/ico_kakao.png);
            @include bg('ico_kakao.png', 0, 0);//var.scss
            background-size: cover;
        }
    }
}

.title-area{display:flex; align-items:center; margin:0 0 20px; 
    .page-title{
        font-size:1.750rem;
        // min-width: 200px; 
        @include bold;//var.scss
    }
    .title-disc{margin:0 0 0 15px;}
}

.content-title{position:relative; display:flex; align-items:center; margin:0 0 18px; font-size:1.250rem; @include bold;//var.scss
    &:after{flex:1; width:100%; height:2px; margin:0 0 0 12px; content:''; background:rgb(var(--bs-gray-gainsBoro));}
    .bi{width:19px; height:19px; margin:0 8px 0 0; font-size:0.750rem; text-align:center; color:rgb(var(--bs-white)); border-radius:50%; background:rgb(var(--bs-red-primary));
        &:before{line-height:19px;}
    }
    &.toggle{cursor:pointer;}
    &.folded{
        + div{display:none !important;}
        .bi{
            &:before{transform:rotate(180deg);}
        }
    }
}

//통합광고관리 - 매체별 광고주
.media-advertiser {
    & > .d-flex {
        width:100%;
        margin-bottom:18px;
        h3{
            margin-bottom: 0;
        }
        &:after{
            content:'';
            flex:1;
            width:100%;
            height:2px;
            margin:16px 0 0 12px; 
            background:rgb(var(--bs-gray-gainsBoro));
        }
    }
    //매체별광고주 하단 버튼
    .media-advertiser-list{
        .col .inner{
            position:relative;
            &.tag_inactive{
                opacity:0.5;
            }
            .status_bar { //default 제한적승인/비승인 표기 없음
                display:none;
            }
            &.approved_limited, &.disapproval {
                .status_bar {
                    display: flex;
                    justify-content: flex-end;
                    width: 10px;
                    height: 100%;
                    position: absolute;
                    top: 0;
                    right: 0;
                    z-index: 2;
                }
            }
            &.approved_limited {
                .approved_limited {
                    width: 5px;
                    height: 100%;
                    background-color: rgb(var(--bs-green-mid));
                }
            }
            &.disapproval {
                .disapproval {
                    width: 5px;
                    height: 100%;
                    background-color: rgb(var(--bs-red-primary));
                }
            }
            .db_ratio{//하단 목표수량 표기
                position:absolute;
                bottom:0;
                left:0;
                width:100%;
                z-index:1;
                & > .inner{
                    p{
                        &.over{
                            color:rgb(var(--bs-red-primary));
                            animation:blink-effect 0.5s ease-in-out infinite alternate;
                        }
                        margin-right:12px;
                        font-size:.6rem;
                        text-align:right;
                        
                    }
                    .bar{
                        height:2px;
                        background-color:rgb(var(--bs-yellow-beer));
                    }
                    
                }
                
            }
            & > .active + .db_ratio { //클릭시
                & > .inner{
                    margin:0 2px 2px;
                    p{
                        color:rgb(var(--bs-white));
                        &.over{
                            color:rgb(var(--bs-yellow-beer));
                            animation:blink-effect 0.5s ease-in-out infinite alternate;
                        }
                    }
                }
            }
            & > .active {
                .media_account_icon{
                    filter: brightness(0.7) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(208deg) brightness(111%) contrast(101%);
                }
            }
        }
    } 
}

//통합광고관리 - 목표수량 설정 모달
.sub-contents-wrap {
    .dt-container{
        table.dataTable{
            &.dbCountTable {
                padding-bottom:0;
                tbody{
                    tr {
                        td{
                            vertical-align: middle;
                        }
                    }
                }
                .canmanage{
                    font-weight: bold;
                }
                .media_box{
                    i{
                        width:15px;height:15px;background-size: cover;
                    }
                    p{
                        &.canmanage{
                            font-weight: bold;   
                        }
                        margin-left: 4px;
                    }
                }
            }
        }
    }
}

.col.half {
    flex:0 0 auto;
    width:50%;
    .search-wrap .search .input{
        input[type="text"]{font-size:90%;}
        .btn-primary{height: 50px;}
        .form-select{padding: .375rem 1.25rem .375rem .75rem;}
    }
}

.search-wrap{
    overflow:hidden;
    margin:0 0 50px;
    border:1px solid rgb(var(--bs-gray-border));
    border-radius:10px 10px 0 0;
    .reportData{
        dl{
            display: inline-block;
            margin-bottom: 15px;
        }
    }
    .search{
        padding:35px 10.4167vw;
        text-align:center;
        background:rgb(var(--bs-white));
        .term{
            flex:1;
            height:50px;
            margin:0 15px 0 0;
            padding:0 10px;
            border-top:2px solid rgb(var(--bs-gray-platinum));
            border-bottom:2px solid rgb(var(--bs-gray-platinum));
            label{
                position:relative;
                width:100%;
                display:flex;
                align-items:center;
            }
            input[type="text"] {
                flex: 1;
                width: 100%;
                border: 0;
                margin-right:10px;
                font-size:.95rem;
            }
            input[data="daterangepicker"] {
                text-align: center;
            }
            span {
                margin: 0 20px;
            }
            button {
                width: 28px;
                color: rgb(var(--bs-red-primary));
            }
            i {
                color: rgb(var(--bs-red-primary));
            }
        }
        .term-small{
            flex:0 0 auto;
            // width:270px;
        }
        .input{
            display:flex;
            flex:1;
            input[type="text"]{
                flex: 1;
                width: 100%;
                height: 50px;
                box-sizing: border-box;
                margin: 0 10px 0 0;
                padding: 0 15px 0 45px;
                border: 1px solid rgb(var(--bs-gray-600));
                border-radius: 25px;
                @include bg('search.svg', 24px, center);//var.scss
                &:focus {
                    border-color: transparent;
                    box-shadow: 0 0 0 0.25rem rgba(var(--bs-red-rose-madder), 0.271);
                    caret-color: rgb(var(--bs-red-origin));
                    &::placeholder {
                        color: rgb(var(--bs-red-origin));
                        text-indent: 0.75rem;
                        transition: text-indent 0.3s;
                    }
                }
            }
            .btn-primary {
                width: 115px;
                height: 52px;
                font-weight: 700;
                color: rgb(var(--bs-white));
                border-radius: 7px;
                background: rgb(var(--bs-red-primary));
            }
            .btn-special {
                width: 115px;
                height: 52px;
                font-weight: 700;
                color: rgb(var(--bs-white));
                border-radius: 7px;
                background: rgb(var(--bs-blue));
            }
        }
        // * + .input{margin:0 0 0 20px;}
    }
    .detail {
        padding: 20px 0;
        text-align: center;
        background: rgb(var(--bs-gray-250));
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        .col {
            flex: 0 0 auto;
            width: auto;
            padding: 0 20px;
            color: rgb(var(--bs-gray-600));
            font-weight: 500;
            display: flex;
            flex-flow: wrap column;
            dt {
                margin: 0 0 5px;
                font-size: 1rem; // 주석 처리된 부분을 확인하세요
                color: rgb(var(--bs-dark-metal));
            }
        }
    }
    select{
        width:20%;
        height:50px; 
    }
    &.type-single {
        .input{
            flex:0 0 auto;
            &.align-center{
                justify-content:center;
            }
        }
        
    }
}



/*
.dataTables_scrollBody{ /*table 스크롤바 안보임
    -ms-overflow-style: none; /* 익스플로러, 앳지
    scrollbar-width: none; /* 파이어폭스

    &::-webkit-scrollbar {
        display: none; /* 크롬, 사파리, 오페라
    }
}
*/

:root {
    --dt-row-selected: 130,190,255;
    --dt-row-selected-text: 0,0,0;
}
.dataTable tfoot .header th{
    background-color:rgb(var(--bs-black)); 
    color:rgb(var(--bs-white));
}
.table-default tfoot .header th:not(:last-child) {
    border-right: 1px dashed rgb(var(--bs-gray-pearl));
}
.inner button.disapproval::after{ 
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: rgb(var(--bs-red-primary));
}
.inner button.tag-inactive{
    opacity: 0.5;
}
.campaign-total td{
    text-align: center !important;
}
.hl-red{
    color: rgb(var(--bs-red-origin));
}
.dt-buttons{
    position: initial !important;
}
.bidamount{
    margin-top:10px;
}
.bidamount_type{
    position: absolute;
    top: 4px;
    left: 50%;
    transform: translate(-50%, 0);
    font-size: 11px;
    color: rgb(var(--bs-white));
    font-weight: bold;
    background: rgb(var(--bs-blue-cobalt));
    height:16px;
    line-height:15px;
    padding:0 10%;
    border-radius: 15px;
}
.bidamount_strategy, .campaign_bidamount{
    font-size: 9px;
}
.modify_tag:hover{
    cursor: pointer;
}
.name_wrap{
    display: flex;
    align-items: flex-start;
}
.name_wrap .name_left_wrap{
    margin-right:10px;
    width:50px;
}
.name_wrap .name_left_wrap img{
    width:100%;
    position:relative;
    z-index: 1;
}
.name_wrap .name_left_wrap img:hover{
    scale: 3;
}
.view_btn{
    position: absolute;
    right:3px;
    top:5px;
    z-index:2;
    &>a { 
        display:block;
        background:rgba(var(--bs-dark-onyx), 0.25);
        padding:1px 5px 0;
        border-radius:4px;
        color:rgb(var(--bs-white));
        font-size:11px;
        .bi-search {
            &:before{
                color:rgb(var(--bs-white));
                font-size:93%;
                vertical-align:middle;
            }
        }
    }
}

/* 20240509 통합광고 관리 tab하단 table
광고탭 클릭 시 (제한적승인/비승인) 스타일 변경 */
.adv-table{
    tbody{
        .mediaName{
            padding-right:20px;
            min-height: 25px;
        }
       
        .memo_count {
            position: absolute;
            right: 0;
            bottom: 0;
            width: 20px;
            height: 20px;
            line-height:20px;
            background-color: rgb(var(--bs-red-primary));
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 12px;
            color: rgb(var(--bs-white));
        }
        tr {
            td:nth-child(2){
                position: relative;
                .btn_box_open{
                    position:absolute;
                    right:0;
                    top:50%;
                    transform:translateY(-50%);
                    display:flex;
                    justify-content:center;
                    align-items:center;
                    flex-flow:column wrap;
                    &.mr-3 {
                        margin-right:-3px;
                    }
                    span{
                        display: block;
                        width:8px;
                        height:8px;
                        background-color: rgb(var(--bs-gray-pastel));
                        border-radius:100%;
                        margin-bottom:5px;
                    }
                    .badge {
                        width:15px;
                        height:15px;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        font-size: 9px;
                        text-indent:-2px;
                    }
                }
            }
            &.disapproval,
            &.approved_limited {
                td:nth-child(2) {
                    &::after {
                        width: auto;
                        position:absolute;
                        left: 0;
                        top: 5px;
                        right:initial;
                        bottom: initial;
                        padding: 0 3%;
                        line-height: 1.5;
                        background:rgba(var(--bs-dark-onyx), 0.25);
                        border-radius:0 50px 50px 0;
                        color: rgb(var(--bs-white));
                        transform: translate(0, 0);
                    }
                }
            }
            &.disapproval td:nth-child(2) {
                background-color:rgb(var(--bs-pink-salmon));
                &::after {
                    content: "비승인";
                    display: block;
                    font-size: 12px;
                    text-align: right;
                }
            }
            &.approved_limited td:nth-child(2) {
                background-color: rgb(var(--bs-pink-limited));

                &::after {
                    content: "제한적 승인";
                    display: block;
                    font-size: 12px;
                    text-align: right;
                }
            }
            &.off {
                &.disapproval td:nth-child(2),
                &.approved_limited td:nth-child(2) {
                    background-color:rgb(var(--bs-gray-600));
                }
                td {
                    background-color: rgb(var(--bs-gray-600)) !important;
                    select.form-select{
                        -webkit-filter: invert(40%);
                        filter: invert(40%);
                    }
                    i {
                        -webkit-filter: invert(40%);
                        filter: invert(40%);
                    }
                    .bi-search {
                        -webkit-filter: none;
                        filter: none;
                    }
                }
            }
            td:nth-child(3){
                position: relative;
                .btn_box{
                    display:none;
                    position:absolute;
                    left:0;
                    top:0px;
                    background-color: rgb(var(--bs-white-snow));
                    width:138px;
                    border:1px solid rgb(var(--bs-gray-pastel));
                    z-index:1;
                    li{
                        padding:6px 0;
                        border-bottom: 1px dashed rgb(var(--bs-gray-pastel));
                        button:hover{
                            color:rgb(var(--bs-red-primary));
                        }
                        &:last-child{
                            border-bottom: none;
                        }
                    }
                }
            }
        }
    }
}

.accountStatModal {
    .dt-length {display:none;}
    input[type="search"] {
        height: 33px;
        box-sizing: border-box;
        margin: 0 10px 0 0;
        padding: 0 15px 0 55px;
        border: 1px solid rgb(var(--bs-gray-600));
        border-radius: 25px;
        background: url(/img/search.svg) no-repeat 24px center;
    }
}
//-------------------------------------------------통합DB-------------------------------------------------//
// 통합DB다운로드 20240617
.db-manage-contaniner {
    form.section {
        .d-flex {
            .form-select {
                width:150px;
                height:48px;
                line-height:48px;
                padding:0 2.25rem 0 .75rem;
            }
            
        }
    }
}

//통합DB db-manage-contaniner
.db-manage-contaniner{
    .search-wrap{
        border-radius: 10px; 
        overflow:auto;
        margin-bottom: 25px;
        .search {
            .term{
                width:290px;
            }
        }
    }
    .dt-search {
        display:flex;
        align-items:center;
        text-align: center;
        label {
            margin:0 10px 0 0;
        }
        input[type="search"] {
            height: 33px;
            box-sizing: border-box;
            margin: 0 10px 0 0;
            padding: 0 15px 0 55px;
            border: 1px solid rgb(var(--bs-gray-600));
            border-radius: 25px;
            background: url(/img/search.svg) no-repeat 24px center;
        }
    }    
    .detail.minWd{//통합DB (인정/중복/성별불량/나이불량/콜불량/번호불량/테스트/이름불량......)
        flex-wrap:wrap;
        min-width:1000px;  
        .col{
            padding:0;
            flex:1 0 auto;
            cursor:pointer;
            &:hover, &.active{
                color:rgb(var(--bs-red-primary));
            }
            dt{
                font-size: 1rem;
            }
            &:hover,&.active{
                dd{
                    font-weight:900;
                }
            }
        }        
    }
}

//통합 DB 다운로드 & 광고주/광고대행사
.form-control{
    width:100%;
    height:100%;
    padding:14px 15px; 
    text-align:left; 
    line-height:1.4; 
    border:1px solid rgb(var(--bs-gray-border)); 
    border-radius:5px; 
    background:rgb(var(--bs-white));
    &.active{
        color:rgb(var(--bs-red-primary)); 
        border-color:rgb(var(--bs-red-primary));
    }
    &.alert{
        margin:0;
        &::before{
            position:absolute; 
            top:0; 
            left:0; 
            width:100%; 
            height:3px; 
            content:''; 
            background:rgb(var(--bs-red-primary));
        }
    }
}


//-------------------------------------------------기타광고관리-------------------------------------------------//
//기타광고관리 - 상단 검색
.etc-contents-wrap {
    .table-responsive {
        position:relative;overflow-x: visible;
        .latestUpdateTime {
            position:absolute;top:8px;right:0;
        }
        .dt-search {
            display:flex;
            align-items:center;
            text-align: center;
            label {
                margin:0 10px 0 0;
            }
            input[type="search"] {
                height: 33px;
                box-sizing: border-box;
                margin: 0 10px 0 0;
                padding: 0 15px 0 55px;
                border: 1px solid rgb(var(--bs-gray-600));
                border-radius: 25px;
                background: url(/img/search.svg) no-repeat 24px center;
            }
        }
    }
    .search-wrap{
        .search {
            .term{
                width:290px;
            }
        }
        
    }
}
//-------------------------------------------------자동화목록-------------------------------------------------//
//자동화 목록 - 상단 검색&버튼
.automationContent {
    .dt-container {
        .search-control-box {
            display:flex;
            justify-content:space-between;
            margin-top:30px;
            .dt-search {
                display:flex;
                align-items:center;
                label {
                    margin:0 10px 0 0;
                }
                input[type="search"] {
                    width:100%;
                    height: 33px;
                    box-sizing: border-box;
                    margin: 0 10px 0 0;
                    padding: 0 15px 0 55px;
                    border: 1px solid rgb(var(--bs-gray-600));
                    border-radius: 25px;
                    background: url(/img/search.svg) no-repeat 24px center;
                }
            }
            .dt-buttons{
                width:auto;
                margin-bottom:0;
                .btn-secondary{
                    all: unset;
                    margin-left:5px;
                    &:first-of-type {
                        margin-left:0;
                    }
                    .btn-outline-danger {
                        // color:rgb(var(--bs-black));
                        &:hover{
                            color:var(--bs-btn-hover-color);
                        }
                    }
                }
            }
        }
    }
    
}



//-------------------------------------------------이벤트관리-------------------------------------------------//
// 이벤트관리 - 팝업 - input radio
.radio-wrap {
    flex-flow:wrap row;
}
.form-check {
    display:flex;
    align-items:center;
    justify-content:center;
    .form-check-input {
        margin:-1px 5px 0 -1.5em;
    }
}

//이벤트관리 - 이벤트 수정 팝업 카카오싱크 input
.kakaosync {
    .desc {
        .form-control{
            display:inline-block;
            width:auto;
            height:30px;
        }
    }
}

/* 업데이트 애니메이션 */
tr.updating td:first-child{
    animation: updating-background 2s linear infinite forwards;
    background-image: linear-gradient(to right, transparent 8%, rgb(var(--bs-gray-ash)) 55%, transparent 80%);
    background-size: 200%;
    box-shadow: none !important;
}
//-------------------------------------------------회원관리-------------------------------------------------//
//회원관리 - 광고주/광고대행사 #search-results 없음. (제니스 확인해보기)
// .adv-show-table .p_name #search-results {position: absolute; background-color: rgb(var(--bs-white));}

//회원관리 - 광고주/광고대행사 팝업
.company-contaniner .modal form.form-search-wrap {
    overflow-x:hidden !important;
    .adaccount-search {
        display: flex;
        align-items: center;
        padding:20px;
        margin-bottom:10px;
        border:1px solid rgb(var(--bs-gray-pearl));
        background:rgb(var(--bs-white-spring));
        h3 {
            margin-right:20px;
            font-size:18px;
        }
        .ada-search-box {
            flex:1;
            input{
                border-radius:50px;
                text-align:left;
            }
        }
    }
}

.ui-widget.ui-widget-content {
    padding:15px 10px;
    border-radius:20px;
    li {
        .ui-menu-item-wrapper {
            padding:1%;
        }
        .ui-state-active,
        .ui-widget-content .ui-state-active,
        .ui-widget-header .ui-state-active,
        a.ui-button:active,
        .ui-button:active,
        .ui-button.ui-state-active:hover {
            border: 1px solid rgb(var(--bs-gray-pearl));
            background: rgb(var(--bs-gray-pearl));
            font-weight: normal;
            color:rgb(var(--bs-dark-dune));
        }
    }
}

//회원관리 - 이름 클릭시 회원관리 팝업
.userGroup {
    & > .inner{
        display:flex;
        flex-flow:wrap row;
        & > .form-check{
            justify-content:flex-start;
            width:23%;
            margin:1%;
        }
    }
    
}
.userPermission {
    .user-title-db {margin:0 0 10px;font-size:15px;}
    & > .inner{
        display:flex;
        flex-flow:wrap row;
        & > .form-check {
            display:block;
            width:23%;
            margin:1%;
        }
    }
}



.form-control, .form-select{
    &:focus{border-color:transparent; box-shadow: 0 0 0 0.25rem rgba(var(--bs-red-rose-madder), 0.271); caret-color:rgb(var(--bs-red-origin));
        &::placeholder{color:rgb(var(--bs-red-origin)); text-indent:0.5rem; transition: text-indent 0.3s;}
    }    
}
.account-container{
    input.form-control{
        &:focus{box-shadow: 0 0 0 0.25rem rgb(var(--bs-blue-powder)); caret-color:rgb(var(--bs-blue-light-steel)); color:rgb(var(--bs-blue-light-steel));
            &::placeholder{color:rgb(var(--bs-blue-light-steel));}
        }
    }
}

input:-internal-autofill-selected {color:rgb(var(--bs-blue-light-steel));}
.none{appearance:none;} //시간차관리 사용


//시간차관리
.dayOff-contanier {
    .row{
        .col:last-of-type {
            .form-control {
                width:80%;
                display:inline-block;
                + .bi-calendar2-week {
                    margin-left:10px;
                    font-size:140%;
                }
            }
            .form-select{
                border:1px solid rgb(var(--bs-gray-border));
                padding:12px 15px;
            }
        }
    }
}
.dayOff-application-table {
    .btn{
        padding: 0.3rem 0.5rem;
        border-radius: 0.25rem;
        border: 1px solid rgb(var(--bs-gray-border));
        font-size:0.813rem;
        &:hover, &:active {
            background: rgb(var(--bs-black));
            color: rgb(var(--bs-white));
            border-color: rgb(var(--bs-black));
        }
    }
}


@keyframes updating-background {
    0% {background-position: 100% 0}
    100% {background-position: -100% 0}
}

@keyframes blink-effect {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@include x-large{//1400px
    .title-area{flex-wrap:wrap;
        .title-disc{width:100%; margin:10px 0 0;}
    }
    .search-wrap{
        .search{padding:35px 30px;}
        .detail{
            .col{flex:0 0 auto; width:25%;
                &:nth-child(n+5){margin-top:15px;}
            }
        }
    }
    .db-manage-contaniner{
        .search-wrap{
            .detail{
                .col{width:auto;
                    &:nth-child(n+5){margin-top:0;}
                }
            }
        }
    }   
    .half + .half{margin-top:40px;}
    .col.half {flex:1;width:auto;}
}

@include large{//1200px
    .client-list{
        .row{flex-wrap:wrap; max-height:250px;
            .col{
                width:25%;
                & > .inner{
                    min-height:40px;
                }
            }
        }
    }
    .adv-table{
        tbody{
            tr{
                td:nth-child(3){
                    .btn_box{
                        li{
                            padding:8px 0;
                            font-size:14px;
                        }
                    } 
                }
            }
        }
    } 
}
@include medium{//1024px
    .search-wrap{
        margin:0 0 20px;
        .search{flex-wrap:wrap; padding:20px;
            .term{flex:0 0 auto;width:100%;height:40px;margin:0;}
            .input{flex:0 0 auto; width:100%; margin:20px 0 0;
                &:first-child{margin:0;}
                input[type="text"]{height:40px;}
                .btn-primary{width:80px; height:40px;}
                .btn-special{width:80px; height:40px;}
            }
            select + .input{width:78%;}
        }

        .detail{padding:15px 0;
            .col{
                dt{font-size:1rem;}
            }
        }
        select{height:40px; margin:20px 0 0 0;width:19%;}
    }
    .half{
        .search-wrap{margin:0 0 20px;
            .search{padding:20px;}
        }
        .table-default{min-width:800px;}
    }
    .nav-tabs{
        .nav-link{padding:10px 0; flex-direction: column; flex-wrap: nowrap; height: 100%;
            &:focus,
            &:hover,
            &:active{border:0;}
            &.active{padding:9px 0 10px; border:1px solid rgb(var(--bs-dark-sea)); border-bottom:0;
                &:before{position:absolute; top:0; left:0; width:100%; height:3px; content:''; background:rgb(var(--bs-red-primary));}
            }
            > span{display: block;}

            .selected{margin: 0.75em auto 0; padding: 0.25em 1.25em; font-size: 0.75em;} 
        }
    }
    .adv-manager{
        .media-advertiser{
            .d-flex{
                .dbCountBtn{
                    height: 30px;
                    // width: 100px;
                    margin-left:0;
                    font-size:13px;
                }
            }
        }
        .search-wrap{
            .search{
                .term {
                    label{
                        width:100%;
                    }
                }
            }
        }
    }
    .adv-table {
        tbody{
            tr{
                td:nth-child(3){
                    .btn_box{
                        width:100px;
                        button{
                            font-size:90%;
                        }
                    }
                }
            }
        }
    } 
    .etc-contents-wrap {
        .search-wrap{
            .search{
                .term{
                    width:100%;
                }
            }
        }
    }
    .db-manage-contaniner{
        .search-wrap{
            .search{
                .term{
                    width:100%;
                }
            }
        }
    }
}
@include small{//768px
    .daterangepicker .drp-calendar.left{clear:none;}
}