/* BASIC css start */
/* 비주얼 */
    .visualSwiper{position: relative;}
    .visualSwiper .swiper-slide{position: relative; height: 400px;}
    .visualSwiper .thumb{position: absolute; top:0; left:0; width: 100%; height: 100%;}
    .visualSwiper .thumb img{width: 100%; height: 100%; object-fit: cover;}
    .visualSwiper .txt_wrap{z-index: 5;color: var(--point-white);display: flex;align-items: flex-start;flex-direction: column;height: 100%;justify-content: center; padding-bottom: 7px;}
    .visualSwiper .txt_wrap h2{font-size: 56px; font-weight: 600; line-height: 1.2;}
    .visualSwiper .txt_wrap h6{font-size: 20px;}
        .visualSwiper .txt_wrap h6 + h2{margin-top: 10px;}
    .visualSwiper .txt_wrap h6 em{display: inline-block;background: var(--point-grad01);background-clip: text;-webkit-background-clip: text;color: var(--trans-color);font-weight: bold;}
    .visualSwiper .txtAni{opacity: 0; transform: translateX(70px); transition: all 1.2s; transition-delay: 0.2s;}
        .visualSwiper .swiper-slide-active .txtAni{opacity: 1; transform: translate(0);}
        .visualSwiper .txtAni:nth-child(2){transition-delay: 0.4s;}
        .visualSwiper .txtAni:nth-child(3){transition-delay: 0.6s;}
        .visualSwiper .txtAni:nth-child(4){transition-delay: 0.8s;}
    .visualSwiper .tag_list{display: flex;flex-wrap: wrap;gap: 20px;margin-top: 7px;}
    .visualSwiper .tag_list > li{font-size: 18px;font-weight: 300;opacity: 0.8;}
    .visualSwiper .more{position: relative;display: flex;width: 160px;height: 40px;box-shadow: inset 0 0 0 1px var(--point-white);box-sizing: border-box;font-size: 14px;font-weight: 600;padding: 0 17px;align-items: center;margin-top: 44px; color: var(--black-color03); line-height: 1;}
        .visualSwiper .more:before{position: absolute; content:''; top:0; left:0; width: 0; height: 100%; background: var(--point-white);  transition: all 0.4s;}
    .visualSwiper .more span{position: relative;display: flex;justify-content: space-between;align-items: center;width: 100%; transition: all 0.4s; filter: var(--filter-white); transition: all 0.4s;}
    .visualSwiper .more span:after{display:inline-flex; content:''; width: 20px; height: 6px; background: url('/design/mach611/da_image/main_visual_arw.png') no-repeat center / 100% auto; }
    .visualSwiper .swiper_arw{position: absolute;top:50%;left:50%;margin: 0 0 0 -740px;background: none;width: 45px;height: 45px;transform: translateY(-50%);opacity: 0.2; transition: all 0.4s;}
        .visualSwiper .swiper_arw:before{position: absolute;content:'';width: 100%;height: 100%;border: 2px solid var(--trans-color);border-top-color: var(--point-white);border-left-color: var(--point-white);top:50%;left:50%;transform: translate(-50%, -50%) rotate(-45deg);border-radius: 2px;}
        .visualSwiper .swiper_arw:after{display: none;}
        .visualSwiper .swiper_arw.swiper-button-next{margin-left: 690px;transform: translateY(-50%) scale(-1,-1);}

        /* over */
            .visualSwiper .more:hover:before{width: 100%;}
            .visualSwiper .more:hover span{filter:none;}
            .visualSwiper .swiper_arw:hover{opacity: 1;}

/* 링크 */
    .main_link{background: var(--point-color03);padding: 30px 0 27px;}
    .main_link .brand_list{display: flex; justify-content: center; flex-wrap: wrap; gap: 40px 80px;}
    .main_link .brand_list > li{position: relative;}
    .main_link .brand_list .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
    .main_link .brand_list .desc{text-align: center;}
    .main_link .brand_list .desc dt a{display: flex; align-items: center; justify-content: center; width: 90px; height: 90px; background: var(--point-white); border-radius: 100%; border:1px solid var(--trans-color); transition: all 0.4s;}
        .main_link .brand_list .desc dt + dd{margin-top: 10px;}
    .main_link .brand_list .desc dd{font-size: 16px; font-weight: 400; color: var(--black-color02);}

    /* over */ 
        .main_link .brand_list > li:hover .desc dt a{border-color: var(--point-color01);}


/* 공통 */
    .main_title{position: relative;padding: 91px 0 37px;box-sizing: border-box;}
    .main_title.cen{text-align: center;}
    .main_title h3{font-size: 38px;font-weight: 700;color: var(--black-color03);line-height: 1.3;}
    .main_sec{position: relative; padding-bottom: 120px; box-sizing: border-box;}

/* 베스트 */
    .main_best .shopbrand_item_wrap{display: grid;border: 1px solid var(--border-color04);grid-template-columns:29% auto auto;gap: 0; counter-reset: rank;}
    .main_best .item_list{width: auto; padding: 30px;}
        .main_best .item_list:first-child{grid-row: 1 / 3;grid-column: 1 / 2; display: block;}
    .main_best .item_list .thumb:before{position: absolute; content: counter(rank, decimal-leading-zero); counter-increment: rank; top:0; left:0; width:35px; height: 35px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 14px; font-weight: 400; color: var(--point-white); background: var(--point-grad02); padding:0 5px; box-sizing: border-box; line-height: 1; z-index: 5; pointer-events: none;}
        .main_best .item_list:first-child .thumb:before{width: 50px; height: 50px; font-size: 20px;}
    .main_best .item_list:not(:first-child){display: flex;align-items: center;border-left: 1px solid var(--border-color04);}
    .main_best .item_list:not(:first-child) .thumb{width: 46.4%;}
    .main_best .item_list:not(:first-child) .info .prdname{font-size: 18px; line-height:1.44;}
    .main_best .item_list:not(:first-child) .info .prdprice .sale_per{font-size: 18px;}
    .main_best .item_list:not(:first-child) .info .prdprice .price strong{font-size: 112.5%;}
    .main_best .item_list:not(:first-child) .info .prdprice strike{width: 100%; font-size: 14px;}
    .main_best .item_list:not(:first-child) .info{width: 53.6%;padding: 0 0 0 24px;}
    .main_best .item_list:nth-child(n+3){border-top: 1px solid var(--border-color04);}

/* 엠디 */
    .main_md{background: var(--gray-bg01); padding-top: 17px;}
    .main_md .tab_list{display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; margin:-10px 0 60px;}
    .main_md .tab_list > li{display: flex; align-items: center; justify-content: center; height: 40px; font-size: 18px; font-weight: 400; color: var(--black-color08); padding: 0 15px; background: var(--point-white); box-sizing: border-box; cursor: pointer; transition: all 0.4s;}
    .main_md .tab_list > li span{transition: all 0.4s;}
        .main_md .tab_list > li.on{background: var(--point-color01);}
        .main_md .tab_list > li.on span{filter: var(--filter-white);}
    .main_md .tab_conts > .item{height: 0; opacity: 0; overflow: hidden; transition: all 0.4s;}
        .main_md .tab_conts > .item.on{height: auto; opacity: 1;}
    .main_md .cont_list{display: flex; gap: 40px;}
    .main_md .cont_list > li{width: calc(100% / 3 - 26.67px); box-sizing: border-box;}
    .main_md .bnr .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
    .main_md .bnr{position: relative; width: 100%; padding-bottom: 100%; overflow: hidden;}
    .main_md .bnr a{position: absolute; top:0; left:0; width: 100%; height: 100%;}
    .main_md .bnr img{position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: cover;}
    .main_md .shopbrand_item_wrap{padding:25px; gap: 24px; background: var(--point-white);}
    .main_md .item_list{width: 100%; display: flex; align-items: center;}
    .main_md .item_list + .item_list{border-top: 1px solid var(--border-color01); padding-top: 24px;}
    .main_md .item_list .thumb{width: 28.6%;}
    .main_md .item_list .info{width: 71.4%;padding: 0 0 0 20px;}
    .main_md .item_list .info .prdname{font-size: 18px; -webkit-line-clamp:1;}
    .main_md .item_list .info .prdprice{margin-top: 10px;}
    .main_md .item_list .info .prdprice .sale_per{font-size: 18px;}
    .main_md .item_list .info .prdprice .price strong{font-size: 112.5%;}
    .main_md .item_list .info .prdprice strike{width: 100%; font-size: 14px;}

        /* over */
            .main_md .tab_list > li:hover{background: var(--point-color01);}
            .main_md .tab_list > li:hover span{filter: var(--filter-white);}
/* 신상품 */
    .main_new{padding-top:12px;}
    
/* 리뷰 */  
    .main_review .main_title{padding-top: 5px;}
    .main_review .slide_wrap{position: relative;margin-top: 12px;}
    .main_review .reviewSwiper{position: relative; overflow: hidden; box-sizing: border-box;}
    .main_review .reviewSwiper .swiper-slide{border: 1px solid var(--border-color01); box-sizing: border-box; box-sizing: border-box; height: auto;}
    .main_review .reviewSwiper .link{position: absolute; top:0; left:0; width: 100%; height: 100%; z-index: 5;}
    .main_review .reviewSwiper .thumb{position: relative; font-size: 0; padding-bottom: 100%; overflow: hidden;}
    .main_review .reviewSwiper .thumb img{position: absolute; top:0; left:0; width: 100%; height: calc(100% + 20px); max-height: none; object-fit: cover;}
    .main_review .reviewSwiper .cont{border-top: 1px solid var(--border-color01); padding:24px 20px 20px; box-sizing: border-box;}
    .main_review .reviewSwiper .score{display: block;font-size: 0;margin-bottom: 5px;}
    .main_review .reviewSwiper .score span{font-size: 16px; font-weight: 400;}
    .main_review .reviewSwiper .desc{position: relative;}
    .main_review .reviewSwiper .desc dt{font-size: 18px;font-weight: 300;color: var(--black-color06);line-height: 1.44;white-space:normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;height: 52px;}
        .main_review .reviewSwiper .desc dt + dd{margin-top: 30px;}
    .main_review .reviewSwiper .desc dd{font-size: 15px;font-weight: 300;color: var(--black-color08);display: flex;flex-wrap: wrap;align-items: center;}
    .main_review .reviewSwiper .desc dd > span:not(:last-child):after{display: inline-flex; content:''; width: 1px; height: 10px; background: var(--border-color01); margin:0 10px;}
    .main_review .reviewSwiper .prod_desc{display: flex;align-items: center;margin-top: 16px;padding-top: 16px;border-top: 1px solid var(--border-color01);}
    .main_review .reviewSwiper .prod_desc dt{width: 40px; height: 40px; border:1px solid var(--border-color01); box-sizing: border-box;}
    .main_review .reviewSwiper .prod_desc dt img{width: 100%; height: 100%; object-fit: cover;}
    .main_review .reviewSwiper .prod_desc dd{width: calc(100% - 40px);padding-left:12px;box-sizing: border-box;font-size: 16px;font-weight: 300;color: var(--black-color06);white-space:normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
    .main_review .swiper_arw{position: absolute;top:50%;left:auto;right: calc(100% + 50px);margin: 0;background: none;width: 45px;height: 45px;transform: translateY(-50%);opacity: 0.25;transition: all 0.4s;}
    .main_review .swiper_arw:before{position: absolute;content:'';width: 100%;height: 100%;border: 2px solid var(--trans-color);border-top-color: var(--black-color03);border-left-color: var(--black-color03);top:50%;left:50%;transform: translate(-50%, -50%) rotate(-45deg);border-radius: 2px;}
    .main_review .swiper_arw:after{display: none;}
    .main_review .swiper_arw.swiper-button-next{right:auto;left: calc(100% + 50px);transform: translateY(-50%) scale(-1,-1);}

    /* over */
        .main_review .swiper_arw:hover{opacity: 1;}


/* BASIC css end */

