﻿.Main_banner {
    /*height: fit-content;*/
    min-height:141px;    
    overflow: hidden;
}

    .Main_banner img {
        display: none;
        width: 100%;
        height: auto;
        transition: all 0.3s ease;
        object-fit: cover !important
    }

@media (min-width: 961px) {
    .Main_banner_desktop {
        display: block !important;
    }
}

@media (min-width: 601px) and (max-width: 960px) {
    .Main_banner_tablet {
        display: block !important;
    }
}

@media (max-width: 600px) {
    .Main_banner_mobile {
        display: block !important;        
    }
}

.Main_Small_banner {
    height: 100%;
    overflow: hidden;
}

    .Main_Small_banner img {
        display: none; 
        width: 100%;
        height: 100%; 
        transition: all 0.3s ease;
    }

@media (min-width: 1280px) {
    .Main_Small_banner_desktop {
        display: block !important;
    }
}

@media (max-width: 1280px) {
    .Main_Small_banner_tablet {
        display: block !important;
    }
}



/*메인 랭킹 상품 박스*/
.ProdBox, .VideoBox {
    background-color: inherit;
    color: var(--mud-palette-white) !important;
}

.ProdBox {
    transition: .3s cubic-bezier(0.25, 0.8, 0.5, 1);
}

    .ProdBox .ProdBox_Img {
        position: relative;
        display: flex;
        box-sizing: content-box;
        width: 100%;
        aspect-ratio: 1 / 1;
        background-color: #00000023;
        border-radius: var(--brd-15);
    }

        .ProdBox .ProdBox_Img > img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            max-width:300px;
            transition: .3s cubic-bezier(0.25, 0.8, 0.5, 1);
            border-radius: var(--brd-15);
            padding: 0;
            margin: 0;
        }
/*박스19*/
.Box-19 {
    width: 100%!important;
    height: 100%!important;
    max-width: 300px;
    transition: .3s cubic-bezier(0.25, 0.8, 0.5, 1);
    border-radius: var(--brd-15);
}

.Box-19-Inner {
    font-size: 1.5rem;
    min-width: 50px;
}
.BigBox-19 .Box-19-Inner {
    border-width: 4px!important;
    font-size: 3rem;
    min-width: 90px;
}
/*상품아이콘*/
.ProdBox .ProdBox_Img .Corner_Icon {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 35px;
    aspect-ratio: var(--ratio1);
    display: flex;
    justify-content: center;
    align-items:center;
}

            .ProdBox .ProdBox_Img .Corner_Icon img {
                width: 35px;
                aspect-ratio: var(--ratio1);
                padding: 0;
                margin: 0;
            }
    /*2,3등 이미지 사이즈 작게*/
    .ProdBox:not(.ProdBoxGold) {
        justify-content: flex-end !important;
    }

        .ProdBox:not(.ProdBoxGold) .ProdBox_Img {
            transform: scale(0.915)!important;
            transform-origin: bottom right;
        }


/*비디오박스*/
.VideoBox {
    justify-content: center
}

    .VideoBox .VideoBox_Img {
        overflow:hidden;
        position: relative;
        width: 100%;
        aspect-ratio: 16 / 9;
        padding: 0;
    }

        .VideoBox .VideoBox_Img img {
            object-fit: cover;/* contain원본비율*/
            width: 100%;
            border-radius: var(--brd-15);
            border: var(--border-op01);
            padding: 0;
            margin: 0;
        }
        .VideoBox .VideoBox_Img > .mud-paper {
            border-radius: var(--brd-15);
            border: var(--border-op01);
        }
/* 아바타박스*/
.AvatarBox {
    justify-content: center
}

    .AvatarBox .AvatarBox_Img {
        position: relative;
        width: 70px;
        height: 70px;
        padding: 0;
    }

        .AvatarBox .AvatarBox_Img img {
            object-fit: cover;
            width: 100%;
            height: 100%;
            border-radius: var(--brd-50);
            border: var(--border-op01);
            padding: 0;
            margin: 0;
        }

.ProdBox .ProdBox_Tit,
.VideoBox .VideoBox_Tit {
    width: 85% !important;
}

    .VideoBox .VideoBox_Tit .txt-over-line {
        word-break: break-word;
    }

.AvatarBox .AvatarBox_Tit {
    margin-right: 10px;
}

/* 검색 다이얼로그 상품*/
.ProdBox.DiaProdBox {
    justify-content:center!important;
    align-self:flex-start!important
}
    .ProdBox.DiaProdBox .ProdBox_Img {
        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
        transform: scale(1) !important;
        
    }
    .ProdBox.DiaProdBox:hover .ProdBox_Img img {
        border-color: var(--mud-palette-primary) !important;
        box-shadow: 0 3px 0px rgba(135, 72, 255, 0.10);
        transform:translateY(-3px)
    }
.ProdBox.DiaProdBox .ProdBox_Tit {
    width: 100% !important;
    text-align:center
}

        /* 마우스오버 이미지, 텍스트 */
        a: hover .ProdBox .ProdBox_Img > img:not(.Corner_Icon) {
        /*filter: brightness(1.1);*/
        transform: scale(1.025) translateY(-3px);
    }

a:hover .ProdBox [class*='Box_Tit'] p.mud-typography-subtitle1 {
    background: #00ff90;
    background: linear-gradient(var(--grd-direction-r), #00ff90 0%, #bdff89 50%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 0px transparent;
    color: transparent;
}

/*모바일★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★*/
@media (min-width: 1280px) and (max-width: 1620px) {
    .ProdBox .ProdBox_Tit, .VideoBox .VideoBox_Tit, .AvatarBox .AvatarBox_Tit {
        width: 90%;
    }
}

@media (min-width:1280px) {
    /*메인리뷰박스*/
    .MainReview-responsive-height {
        max-height:300px;
    }
}

@media (min-width: 960px) and (max-width: 1280px) {
    /*메인리뷰박스*/
    .MainReview-responsive-height {
        max-height: 400px;
    }
}

@media (min-width: 600px) and (max-width: 960px) {
    /*메인리뷰박스*/
    .MainReview-responsive-height {
        max-height: 400px;
    }

    .ProdBox .ProdBox_Img {
    }
}

@media (max-width: 600px) {
    /*메인리뷰박스*/
    .MainReview-responsive-height {
        max-height: 350px;
    }

    /*2,3등 이미지 사이즈 작게*/
    .ProdBox:not(.ProdBoxGold) {
        justify-content: center !important;
        transform: scale(1);
        transform-origin: unset;
    }
    .ProdBox {
        width: 100% !important;
    }
    .ProdBox .ProdBox_Img {
        width: 32.5% !important;
        height: 32.5% !important;
    }

    .ProdBox:not(.ProdBoxGold) .ProdBox_Img {
        transform: scale(0.90);
    }

    .ProdBox .ProdBox_Tit {
        width: 67.5% !important;
    }
    /*박스19*/
    .Box-19-Inner {
        font-size: 1rem;
        min-width: 30px;
    }
    .BigBox-19 .Box-19-Inner {
        border-width: 2px !important;
        font-size: 1.5rem;
        min-width: 50px;
    }
    /*비디오박스*/
    .VideoBox {
        justify-content: flex-start
    }

        .VideoBox .VideoBox_Img {
            width: 32.5%;
        }
            .VideoBox .VideoBox_Img img {
                border-radius: var(--brd-10);
            }
        .VideoBox .VideoBox_Tit {
            width: 62.5%!important
        }


    /*상품아이콘*/
    .ProdBox .ProdBox_Img .Corner_Icon {
        width: 32px;
    }

    /* 검색 다이얼로그 상품*/
    .ProdBox.DiaProdBox .ProdBox_Tit p {
        text-align:left
    }
}

/*효과●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●●*/
