/* 22. 12. 10. 이미지 검색 */
.img-search-resultContainer {
    margin-top: 20px;
    border: 1px solid #ccc;
}
.img-search-resultContainer .img-search-resultBox {
    width: 100%;
    height: 300px;
}
.img-search-resultContainer .img-search-resultBox:after {
    content: "";
    display: block;
    clear: both;
}
.img-search-resultContainer .img-search-resultBox dt,
.img-search-resultContainer .img-search-resultBox dd {
    width: calc(100% / 3);
    height: 100%;
    float: left;
    padding: 20px;
    box-sizing: border-box;
}
.img-search-resultContainer .img-search-resultBox dt .img-search-result {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.img-search-resultContainer .img-search-resultBox dd {
    border-left: 1px solid #ccc;
}
.img-search-resultContainer .img-search-resultBox dd.scroll-contents {
    overflow-y: scroll;
}
.img-search-resultContainer {
    margin-top: 20px;
    border: 1px solid #ccc
}

.img-search-resultContainer .img-search-resultBox {
    width: 100%;
    height: 320px
}

.detailCont_list li .Progress_titBox:after,.detailCont_list:after,.img-search-resultContainer .img-search-resultBox:after {
    content: "";
    display: block;
    clear: both
}

.img-search-resultContainer .img-search-resultBox dd,.img-search-resultContainer .img-search-resultBox dt {
    width: calc(100%/3);
    height: 100%;
    float: left;
    padding: 20px;
    box-sizing: border-box
}

.img-search-resultContainer .img-search-resultBox dd {
    border-left: 1px solid #ccc
}

.img-search-resultContainer .img-search-resultBox dd.scroll-contents {
    overflow-y: scroll
}

.result-categoryBox {
    margin-top: 20px
}

.detailCont_list li:first-child,.result-categoryBox:first-child {
    margin-top: 0
}

.result-tit {
    font-size: 18px;
    color: #ef7d00;
    font-weight: 500;
    margin-bottom: 10px
}

.dot-list li {
    padding-left: 12px;
    position: relative;
    font-size: 16px;
    color: #000;
    margin-top: 5px
}

.dot-list li:before {
    content: "";
    width: 4px;
    height: 4px;
    background: #000;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%)
}

.detailCont_list {
    width: 100%;
    height: 100%
}

.detailCont_list li {
    width: 100%;
    margin-top: 20px
}

.detailCont_list li .Progress_titBox {
    width: 100%;
    position: relative;
    z-index: 2
}

.detailCont_list li .Progress_titBox .tit {
    float: left;
    font-size: 15px;
    color: #000;
    font-weight: 700
}

.detailCont_list li .Progress_titBox .value_tit {
    float: right;
    color: #f58220;
    font-weight: 700
}

.Progress_bar {
    width: 100%;
    height: 10px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    border-radius: 50px
}

.Progress_bar::-webkit-progress-bar {
    background-color: #efefef;
    border-radius: 50px
}

.Progress_bar::-webkit-progress-value {
    background-color: #f58220;
    border-radius: 50px
}

.meter {
    margin-top: 10px
}

.meter .bar {
    background: #f58220;
    height: 10px
}

.color-container {
    height: 170px;
    margin-top: 10px
}

.artist-btnBox2:after,.color-container:after {
    content: "";
    display: block;
    clear: both
}

.color-container .color {
    height: 100%;
    float: left
}

.color-tit {
    color: #000;
    font-weight: 500;
    float: left
}

.color-block {
    margin-top: 10px
}

@media screen and (max-width: 1024px) {

        .img-search-resultContainer .img-search-resultBox dt {
            max-width: 300px;
            width: 100%;
            float: none;
            margin: 0 auto
        }


    .coupon-list li .coupon,.img-search-resultContainer .img-search-resultBox {
        height: inherit
    }

    .coupon-list li .coupon:before {
        border-left: 1px solid rgba(0,0,0,.1)
    }

    .coupon-list li .coupon .dataBox,.coupon-list li .coupon .tit-box {
        float: none;
        width: 100%;
        padding: 20px;
        height: inherit;
        min-height: 112px
    }

    .coupon-list li .coupon .dataBox .data-psBox {
        padding-right: 0
    }

    .coupon-list li .coupon .dataBox .use-type {
        top: -83px
    }

    .point-result {
        padding-left: 0
    }

    .point-result dd,.point-result dt {
        float: none;
        padding: 10px
    }

    .point-result dt {
        width: 100%;
        position: relative;
        top: 0;
        left: 0;
        transform: none;
        font-size: 16px
    }

    .point-result dd {
        border-top: 1px dashed #c2c2c2;
        border-left: none
    }

    .point-result dd .txt-box {
        width: 100%;
        padding-right: 0;
        box-sizing: border-box;
        text-align: center
    }

    .point-result dd .point-box p,.point-result dd .txt-box .tit {
        font-size: 16px
    }

    .point-result dd .point-box {
        position: relative;
        right: 0;
        top: 0;
        transform: none;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid #c2c2c2;
        text-align: right
    }

    .img-search-resultContainer .img-search-resultBox dd {
        width: 100%;
        float: none;
        border-left: none
    }

    .artist_visual_hoverBox {
        padding-bottom: 80px
    }

    .artist_visualSlide_container {
        height: 300px
    }

    .artist_visualSlide-controlor {
        opacity: 0;
        top: auto;
        bottom: 0;
        max-width: 300px;
        height: 50px;
        transform: translateX(-50%)
    }

    .artist_visualSlide_container.swiper-initialized+.artist_visualSlide-controlor {
        opacity: 1
    }

    .artist_visualSlide-controlor .rel-box {
        height: 100%
    }

    .artist_visualSlide-controlor .artist_visualSlide-pager {
        width: inherit;
        display: block;
        position: absolute;
        left: 50%;
        bottom: 50%;
        transform: translate(-50%,50%)
    }

    .artist_visualSlide-controlor .artist_visualSlide-pager .current {
        font-size: 20px;
        color: #000;
        font-weight: 600
    }

    .artist_visualSlide-controlor .artist_visualSlide-pager i {
        font-style: normal;
        font-size: 18px;
        margin: 0 5px
    }

    .artist_visualSlide-controlor .artist_visualSlide-pager .total {
        font-size: 14px;
        font-weight: 600
    }

    .artist_visualSlide-controlor .artist_visualSlide-btn.prev {
        left: calc(50% - 100px)
    }

    .artist_visualSlide-controlor .artist_visualSlide-btn.next {
        right: calc(50% - 100px)
    }

    .bg-fixed-layout {
        height: 250px
    }

    .artist-vh-container .swiper-slide {
        height: calc(100%/2)!important
    }

    .artist-vh-container .swiper-slide .at-txtBox .age {
        font-size: 14px
    }

    .artist-vh-container .swiper-slide .at-txtBox .at-name {
        font-size: 30px
    }
}