.scrollLock{overflow: hidden;} .recently-gray-filter{ filter: opacity(0.87) drop-shadow(0 0 0 #808080); } /*MO 시작*/ /*MO 시작*/ /*MO 시작*/ /*MO 시작*/ /*MO 시작*/ @media screen and (max-width : 1159px) { .pc-only{display:none!important;} .mo-only{display:inline-block!important;} .dark-mode{position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.15); z-index: 1002; width: 100%; height: 100%; z-index: 200; display: none;} /*비교하기 팝업창*/ .compare-popup{padding: 13px 20px 24px; background-color: #FFF; position: fixed; bottom: 55px; z-index: 1003; width: 100%; display: none;} .compare-popup .mo-only{width: 100%;} .compare-popup .title-wrap{margin-bottom: 13px; display: flex; justify-content: center; align-items: center;} .compare-popup .title-wrap .title{background-color: #4A4C58; font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.6px; color: #FFF; display: flex; justify-content: center; align-items: center; padding: 7px 0px; border-radius: 5px; width: 100%;} .compare-popup .title-wrap .close-icon{width: 24px; height: 24px; margin-left: 10px;} .compare-popup .title-wrap .close-icon img{width: 100%; height: 100%;} .compare-popup .product-compare-area .title-area{margin-bottom: 15px; position: relative; width: 100%;} .compare-popup .product-compare-area .title-area .product-on{display: flex; align-items: center; position: relative; width: 100%;} .compare-popup .product-compare-area .title-area .product-on .title .normal{font-family: "Roboto"; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.6px; color: #4A4C58; margin-left: 9px; margin-top: 4px;} .compare-popup .product-compare-area .title-area .product-on .title .reset{font-family: "Roboto"; font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: -0.6px; color: #4A4C58; margin-left: 9px; display: none;} .compare-popup .product-compare-area .title-area .product-on .category-list{margin-left: 10px;display: flex; align-items: center; justify-content: center;} .compare-popup .product-compare-area .title-area .product-on .category-list .text{ font-family: "Noto Sans KR"; font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: -0.6px; color: #4A4C58; width: 70%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word; word-break: keep-all;} .compare-popup .product-compare-area .title-area .product-on .category-list > span{font-size: 14px; line-height: 20px; margin-left: 3px;} .compare-popup .product-compare-area .title-area .product-on .category-list img{width: 12px; height: 12px; margin-left: 4px;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list{width: 175px; min-width: 175px; position: absolute; top: 25px; right: 28px; background-color: #FFF; z-index: 10; border: 1px solid #D9DADB; box-shadow: 0px 4px 8px rgba(74, 76, 88, 0.2); border-radius: 4px; display: none; max-height: 122px; overflow-y: scroll;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list::-webkit-scrollbar{display: none;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list{font-family: "Roboto"; font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; margin-bottom: 20px; padding-left: 12px; color: #767676; display: flex; align-items: center;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list:first-child{margin-top: 12px;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list:last-child{margin-bottom: 16px;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .active{font-family: "Noto Sans KR"; font-weight: 500; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; color: #4A4C58; text-decoration: underline;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list .product-number{font-family: "Noto Sans KR"; margin-left: 2px;} .compare-popup .product-compare-area .title-area .product-on .reset-icon{position: absolute; right: 0; display: flex; justify-content: center; align-items: center;} .compare-popup .product-compare-area .title-area .product-on .reset-icon .reset-img{width: 24px; height: 24px;} .compare-popup .product-compare-area .title-area .product-on .reset-icon .reset-text{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 24px; letter-spacing: -0.6px; color: #4A4C58; margin-left: 2px;} .compare-popup .product-compare-list .grid {grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; display: grid; gap : 0 19px; width: 100%; justify-content: center; /*padding-left: 20px;*/} .compare-popup .product-compare-list .grid > *:nth-child(n + 3){display: none;} .compare-popup .product-compare-list .grid .grid-item{border: 1px solid #D9DADB; border-radius: 4px; position: relative; min-width: 158px;} .compare-popup .product-compare-list .grid .grid-item .product-area-on .img-area{width: 90px; height: 77px; margin: 0 auto; /*padding: 0 39px;*/} .compare-popup .product-compare-list .grid .grid-item .product-area-on .img-area img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .product-compare-list .grid .grid-item .product-area-on .product-info-area{padding: 0 10px;} .compare-popup .product-compare-list .grid .grid-item .product-area-on .product-info-area .product-name{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; text-align: center; margin-bottom: 3px; height: 18px; max-height: 18px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word; word-break: keep-all;} .compare-popup .product-compare-list .grid .grid-item .product-area-on .product-info-area .product-number{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; color: #767676;margin-bottom: 12px; text-align: center;} .compare-popup .product-compare-list .grid .grid-item .product-area-on .close-icon{width: 15px; height: 15px; position: absolute; top: 10px; right: 10px; display: flex; justify-content: center;} .compare-popup .product-compare-list .grid .grid-item .product-area-on .close-icon img{width: 100%; height: 100%;} .compare-add-text{background-color: rgba(0, 0, 0, 0.7); width: max-content; border-radius: 27.5px; position: fixed; bottom: 108px; left: 50%; transform: translate(-50%); color: #FFF; z-index: 100001; display: none;} .compare-add-text .compare-add-wrap{display: flex; justify-content: center; align-items: center; position: relative;} .compare-add-text .compare-add-wrap .add-text{font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.6px; padding: 18px 67px 18px 67px;} .compare-add-text .compare-add-wrap .text-close-icon{width: 16px; height: 16px; margin-left: 47px; position: absolute; right: 19px;} .compare-add-text .compare-add-wrap .text-close-icon img{width: 100%; height: 100%; object-fit: contain;} /*상품이 없을때*/ .compare-popup .product-compare-list .grid .product-off{border: 1px dashed #D9DADB;} .compare-popup .product-compare-area .title-area .product-off{display: flex; align-items: center; position: relative; width: 100%;} .compare-popup .product-compare-area .title-area .product-off .title{font-family: "Roboto"; font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: -0.6px; color: #4A4C58; margin-left: 9px;} .compare-popup .product-compare-area .title-area .product-off .reset-icon{position: absolute; right: 0; display: flex; justify-content: center; align-items: center;} .compare-popup .product-compare-area .title-area .product-off .reset-icon .reset-img{width: 24px; height: 24px;} .compare-popup .product-compare-area .title-area .product-off .reset-icon .reset-text{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 24px; letter-spacing: -0.6px; color: #4A4C58; margin-left: 2px;} .compare-popup .product-compare-list .grid .off-area{border: 1px dashed #D9DADB; min-width: 158px;} .compare-popup .product-compare-list .grid .grid-item .product-area-off .img-area{padding: 24px 39px 0; margin-bottom: 5px;} .compare-popup .product-compare-list .grid .grid-item .product-area-off .img-area .compare-icon{width: 24px; height: 24px; margin: 0 auto;} .compare-popup .product-compare-list .grid .grid-item .product-area-off .img-area .compare-icon img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .product-compare-list .grid .grid-item .product-area-off .img-area .compare-text{font-family: "Noto Sans KR"; font-weight: 500; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #A9A9A9; text-align: center;} .compare-popup .product-compare-list .grid .grid-item .product-area-off .text-area{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; text-align: center; color: #A9A9A9; margin-bottom: 24px;} /*최근 본 상품*/ .recently-popup{padding: 29px 20px 35px; position: fixed; z-index: 1001; background-color: #fff; width: 100%; height: 100%; display: none; top: 48px; /* overflow-y: scroll;*/} .recently-popup::-webkit-scrollbar{display: none;} .recently-popup .title-area{position: relative; margin-bottom: 25px;} .recently-popup .title-area .title-text{font-family: "Noto Sans KR"; font-weight: 500; font-size: 20px; line-height: 29px; letter-spacing: -0.6px;} .recently-popup .title-area .close-icon{width: 24px; height: 24px; position: absolute; top: 0px; right: 0px;} .recently-popup .title-area .close-icon img{width: 100%; height: 100%; object-fit: contain;} .recently-popup .product-area{height: 90%; overflow: scroll;/* padding-bottom: 35px;*/} .recently-popup .product-area::-webkit-scrollbar{display: none;} .recently-popup .product-area .lately-product-list{position: relative; margin-bottom: 35px;} .recently-popup .product-area .lately-product-list .product-type{font-family: "Noto Sans KR"; font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: -0.6px; display: flex; justify-content: flex-start; align-items: baseline; color: #767676; margin-bottom: 8px;} .recently-popup .product-area .lately-product-list .product-type > span{font-family: "Roboto"; margin-left: 3px;} .recently-popup .product-area .lately-product-list .product-card{display: flex; justify-content: flex-start; margin-bottom: 16px; position: relative;} .recently-popup .product-area .lately-product-list .product-card .img-area{width: 100px; min-width: 100px; height: 85px; background-color: #F0F0F0;} .recently-popup .product-area .lately-product-list .product-card .img-area img{width: 100%; height: 100%; object-fit: contain;} .recently-popup .product-area .lately-product-list .product-card .product-data-area{margin-left: 10px; padding-top: 7px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .brand-name{font-family: "Noto Sans KR"; font-weight: 700; font-size: 12px; line-height: 18px; letter-spacing: -0.6px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .product-name{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-wrap: break-word; word-break: keep-all; margin-bottom: 10px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .cost-area{display: flex; align-items: baseline; font-family: "Roboto"; font-weight: 700; font-size: 16px; line-height: 24px; letter-spacing: -0.6px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .cost-area > span{font-family: "Noto Sans KR"; font-weight: 400; font-size: 12px; line-height: 18px; letter-spacing: -0.6px;} .recently-popup .product-area .lately-product-list .product-card .compare-area{display: flex; justify-content: flex-end; align-items: center; position: absolute; right: 0px; bottom: 0px; z-index: 100; width: 30%;} .recently-popup .product-area .lately-product-list .product-card .compare-area .compare-icon{width: 24px; height: 24px;} .recently-popup .product-area .lately-product-list .product-card .compare-area .compare-icon img{width: 100%; height: 100%; object-fit: contain;} .recently-popup .product-area .lately-product-list .product-card .compare-area .compare-text{margin-left: 2px; font-family: "Noto Sans KR"; font-weight: 500; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; color: #767676;} /*스크롤 버튼*/ .scroll-button-area{position: fixed; right: 15px; z-index: 200;} .scroll-button-area:not(.open){ bottom: 120px; } .scroll-button-area.open{ bottom: 167px; } .scroll-button-area .compare-button{width: 47px; height: 47px; margin-bottom: 8px; background-color: #FFFFFF; box-shadow: 0px 2px 4px rgba(74, 76, 88, 0.2); border-radius: 50%; display: flex; justify-content: center; align-items: center; border: 1px solid #D9DaDB; padding: 12px 12px; position: relative; box-shadow: 0px 2px 4px rgba(74, 76, 88, 0.2);} .scroll-button-area .compare-button img{width: 100%; height: 100%;} .scroll-button-area .compare-button .compare-number{width: 20px; height: 20px; border-radius: 50%; background-color: #ED174D; color: #FFFFFF; font-family: "Roboto"; font-weight: 500; font-size: 14px; line-height: 24px; text-align: center; position: absolute; right: 0; top: -5px; display: flex; justify-content: center; align-items: center;} .scroll-button-area .product-button{width: 47px; height: 47px; margin-bottom: 8px; background-color: #F0F0F0; border-radius: 50%; display: flex; justify-content: center; align-items: center; padding: 9px 6px; box-shadow: 0px 4px 8px rgba(74, 76, 88, 0.2); position: relative;} .scroll-button-area .product-button img{width: 100%; height: 100%;} .scroll-button-area .product-button .compare-number{width: 20px; height: 20px; border-radius: 50%; background-color: #ED174D; color: #FFFFFF; font-family: "Roboto"; font-weight: 500; font-size: 14px; line-height: 24px; text-align: center; position: absolute; right: 0; top: -5px; display: flex; justify-content: center; align-items: center;} } /*PC 시작*/ /*PC 시작*/ /*PC 시작*/ /*PC 시작*/ /*PC 시작*/ @media screen and (min-width : 1160px) { .pc-only{display:inline-block!important;} .mo-only{display:none!important;} .dark-mode{position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.15); z-index: 99; width: 100%; height: 100%; z-index: 10000; display: none;} .scrollLock{overflow: hidden;} /*비교 팝업창*/ .compare-popup{width: 380px; height: 100vh; background-color: #FFF; box-shadow: -7px 5px 15px rgba(0, 0, 0, 0.1); position: fixed; top: 0px; right: -50%; z-index: 10002; padding: 0 32px;} .compare-popup .pc-only{width: 100%;} .compare-popup .title-wrap{display: flex; justify-content: flex-start; align-items: center; margin-top: 38px; position: relative; margin-bottom: 20px;} .compare-popup .title-wrap .title{font-family: "Noto Sans KR"; font-weight: 500; font-size: 20px; line-height: 30px; letter-spacing: -0.6px;} .compare-popup .title-wrap .close-icon{width: 24px; height: 24px; position: absolute; top: 0px; right: 0px; cursor: pointer;} .compare-popup .title-wrap .close-icon img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .product-compare-area .title-area{margin-bottom: 16px;} .compare-popup .product-compare-area .title-area .product-on{display: flex; justify-content: flex-start; align-items: baseline; position: relative;} .compare-popup .product-compare-area .title-area .product-on .title .normal{font-family: "Noto Sans KR"; font-weight: 500; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #4A4C58;} .compare-popup .product-compare-area .title-area .product-on .title .reset{font-family: "Roboto"; font-weight: 300; font-size: 16px; line-height: 26px; letter-spacing: -0.6px; color: #4A4C58; display: none;} .compare-popup .product-compare-area .title-area .product-on .category-list{margin-left: 10px; font-family: "Roboto"; font-weight: 300; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #4A4C58; display: flex; align-items: center;} .compare-popup .product-compare-area .title-area .product-on .category-list img{width: 12px; height: 12px; object-fit: contain; margin-left: 4px;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list{position: absolute; background-color: #FFF; border: 1px solid #D9DADB; box-shadow: 0px 4px 8px rgba(74, 76, 88, 0.2); border-radius: 4px; top: 30px; left: 50%; padding: 16px; display: none; z-index: 100; transform: translate(-50%);} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list{font-family: "Noto Sans KR"; font-weight: 300; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #767676; display: flex; align-items: baseline;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .active{font-family: "Noto Sans KR"; font-weight: 500; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #4A4C58; text-decoration: underline; white-space: nowrap;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list .text{white-space: nowrap;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list .product-number{font-family: "Roboto"; margin-left: 3px;} .compare-popup .product-compare-area .title-area .product-on .category-sub-list .sub-list:not(:last-child){margin-bottom: 10px;} .compare-popup .product-compare-area .title-area .product-off .title{font-family: "Roboto"; font-weight: 300; font-size: 16px; line-height: 26px; letter-spacing: -0.6px; color: #4A4C58;} .compare-popup .product-compare-area .product-compare-list .grid{grid-template-columns: repeat(1, 1fr); grid-auto-rows: auto; display: grid; gap : 0 19px; width: 100%; justify-content: center; /*padding-left: 20px;*/} .compare-popup .product-compare-area .product-compare-list .grid .grid-item{display: flex; justify-content: flex-start; align-items: center; border: 1px solid #D9DADB; border-radius: 5px; margin-bottom: 20px;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on{position: relative; width: 100%; display: flex; align-items: center;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .img-area{min-width: 110px; width: 110px; height: 93px; margin: 14px 0px 14px 4px;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .img-area img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .product-info-area{margin-left: 14px; width: 100%;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .product-info-area .brand-name{font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; text-align: left;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .product-info-area .product-name{font-family: "Noto Sans KR"; font-weight: 300; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; min-height: 24px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-wrap: break-word; word-break: keep-all; text-align: left; width: 162px;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .product-info-area .cost-area{font-family: 'Roboto'; font-weight: 700; font-size: 20px; line-height: 30px; letter-spacing: -0.6px; display: flex; justify-content: flex-start; align-items: center;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .product-info-area .cost-area > span{font-family: "Noto Sans KR"; font-weight: 300; font-size: 14px; line-height: 24px; letter-spacing: -0.6px;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .close-icon{width: 16px; height: 16px; position: absolute; top: 10px; right: 10px; cursor: pointer;} .compare-popup .product-compare-area .product-compare-list .grid .grid-item .product-area-on .close-icon img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .product-compare-area .product-compare-list .grid .off-area{border: 1px dashed #D9DADB; border-radius: 5px;} .compare-popup .product-compare-area .product-compare-list .grid .off-area .product-area-off{position: relative; width: 100%; height: 121px;} .compare-popup .product-compare-area .product-compare-list .grid .off-area .product-area-off .img-area{display: flex; justify-content: center; align-items: center; margin-top: 34px;} .compare-popup .product-compare-area .product-compare-list .grid .off-area .product-area-off .img-area .compare-icon{width: 24px; height: 24px;} .compare-popup .product-compare-area .product-compare-list .grid .off-area .product-area-off .img-area .compare-icon img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .product-compare-area .product-compare-list .grid .off-area .product-area-off .img-area .compare-text{margin-left: 4px; font-family: "Noto Sans KR"; font-weight: 500; font-size: 16px; line-height: 24px; letter-spacing: -0.6px; color: #A9A9A9;} .compare-popup .product-compare-area .product-compare-list .grid .off-area .product-area-off .text-area{font-family: "Noto Sans KR"; font-weight: 300; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #A9A9A9; margin: 5px auto 33px; text-align: center;} .compare-popup .compare-button-area{display: flex; justify-content: flex-start; align-items: center;} .compare-popup .compare-button-area .reset-area{display: flex; justify-content: center; align-items: center; cursor: pointer;} .compare-popup .compare-button-area .reset-area .reset-icon{width: 24px; height: 24px;} .compare-popup .compare-button-area .reset-area .reser-icon img{width: 100%; height: 100%; object-fit: contain;} .compare-popup .compare-button-area .reset-area .reset-text{font-family: "Noto Sans KR"; font-weight: 300; font-size: 14px; line-height: 24px; letter-spacing: -0.6px; color: #4A4C58; margin-left: 4px;} .compare-popup .compare-button-area .compare-button{font-family: "Noto Sans KR"; font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: -0.6px; color: #FFF; padding: 10px 87px; background-color: #4A4C58; border-radius: 4px; margin-left: 20px;} .compare-popup .compare-button-area .compare-button:hover{background-color: #000;} .compare-popup .compare-add-text{background-color: rgba(0, 0, 0, 0.7); width: max-content; padding: 18px 20px 18px 80px; display: flex; justify-content: center; align-items: center; border-radius: 27.5px; position: absolute; bottom: 108px; margin-left: 5px; color: #FFF; display: none;} .compare-popup .compare-add-text .compare-add-wrap{display: flex;} .compare-popup .compare-add-text .compare-add-wrap .add-text{font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.6px;} .compare-popup .compare-add-text .compare-add-wrap .text-close-icon{width: 16px; height: 16px; margin-left: 47px;} .compare-popup .compare-add-text .compare-add-wrap .text-close-icon img{width: 100%; height: 100%; object-fit: contain;} /*최근 본 상품*/ .recently-popup{position: fixed; right: -100%; top: 0; background-color: #FFF; width: 380px; height: 100vh; padding: 32px; z-index: 10001; box-shadow: -7px 5px 15px rgba(0, 0, 0, 0.1); /*overflow-y: scroll;*/} .recently-popup::-webkit-scrollbar{display: none;} .recently-popup .title-area{display: flex; align-items: center; position: relative; margin-bottom: 24px;} .recently-popup .title-area .title-text{font-family: "Noto Sans KR"; font-weight: 500; font-size: 20px; line-height: 30px; letter-spacing: -0.6px;} .recently-popup .title-area .close-icon{width: 24px; height: 24px; position: absolute; right: 0; cursor: pointer;} .recently-popup .title-area .close-icon img{width: 100%; height: 100%; object-fit: contain;} .recently-popup .product-area{height: 100%; overflow-y: scroll;} .recently-popup .product-area::-webkit-scrollbar{display: none;} .recently-popup .product-area .lately-product-list{margin-bottom: 32px;} .recently-popup .product-area .lately-product-list .product-type{font-family: "Noto Sans KR"; font-weight: 500; font-size: 16px; line-height: 26px; letter-spacing: -0.6px; display: flex; align-items: baseline; color: #767676; margin-bottom: 8px;} .recently-popup .product-area .lately-product-list .product-type .product-number{font-family: "Roboto"; font-weight: 300; color: #767676; margin-left: 4px;} .recently-popup .product-area .lately-product-list .product-card{display: flex; align-items: center; height: 85px; position: relative; margin-bottom: 16px;} .recently-popup .product-area .lately-product-list .product-card .img-area{min-width: 100px; width: 100px; height: 85px; background-color: #F0F0F0;} .recently-popup .product-area .lately-product-list .product-card .img-area img{width: 100%; height: 100%; object-fit: contain;} .recently-popup .product-area .lately-product-list .product-card .product-data-area{margin-left: 10px; text-align: left; } .recently-popup .product-area .lately-product-list .product-card .product-data-area .brand-name{font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; line-height: 24px; letter-spacing: -0.6px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .product-name{font-family: "Noto Sans KR"; font-weight: 300; font-size: 12px; line-height: 20px; letter-spacing: -0.6px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-wrap: break-word; word-break: keep-all; margin-bottom: 10px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .cost-area{display: flex; align-items: baseline; font-family: "Roboto"; font-weight: 700; font-size: 16px; line-height: 30px; letter-spacing: -0.6px;} .recently-popup .product-area .lately-product-list .product-card .product-data-area .cost-area > span{font-family: "Noto Sans KR"; font-weight: 300; font-size: 12px; line-height: 16px; letter-spacing: -0.6px;} .recently-popup .product-area .lately-product-list .product-card .compare-area{position: absolute; display: flex; justify-content: flex-end; align-items: baseline; right: 0px; bottom: 8px; cursor: pointer; width: 25%;} .recently-popup .product-area .lately-product-list .product-card .compare-area .compare-icon{width: 24px; height: 24px;} .recently-popup .product-area .lately-product-list .product-card .compare-area .compare-icon img{width: 100%; height: 100%; object-fit: contain;} .recently-popup .product-area .lately-product-list .product-card .compare-area .compare-text{font-family: "Noto Sans KR"; font-weight: 500; font-size: 12px; line-height: 18px; letter-spacing: -0.6px; margin-left: 2px; color: #767676;} .compare-add-text{background-color: rgba(0, 0, 0, 0.7); width: max-content; padding: 18px 20px 18px 80px; border-radius: 27.5px; position: fixed; bottom: 117px; left: 50%; margin-left: 5px; color: #FFF; transform: translate(-50%); z-index: 100005; display: none; } .compare-add-text .compare-add-wrap{display: flex; justify-content: center; align-items: center;} .compare-add-text .compare-add-wrap .add-text{font-family: "Noto Sans KR"; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.6px;} .compare-add-text .compare-add-wrap .text-close-icon{width: 16px; height: 16px; margin-left: 47px;} .compare-add-text .compare-add-wrap .text-close-icon img{width: 100%; height: 100%; object-fit: contain;} /*스크롤 버튼*/ .scroll-button-area{position: fixed; bottom: 160px; /*left: 50%;*/ z-index: 9998; margin-left: 670px; /*right: 230px;*/ right: 64px;} #btn-totop{left: unset; /*right: 230px;*/ right: 64px;} .scroll-button-area .compare-button{width: 50px; height: 50px; margin-bottom: 8px; background-color: #FFFFFF; box-shadow: 0px 2px 4px rgba(74, 76, 88, 0.2); border-radius: 50%; display: flex; justify-content: center; align-items: center; position: relative;} .scroll-button-area .compare-button img{width: 24px; height: 24px;} .scroll-button-area .compare-button .compare-number{width: 20px; height: 20px; border-radius: 50%; background-color: #ED174D; color: #FFFFFF; font-family: "Roboto"; font-weight: 500; font-size: 14px; line-height: 24px; text-align: center; position: absolute; right: 0; top: -5px; display: flex; justify-content: center; align-items: center; padding-right: 1px; padding-top: 1px;} .scroll-button-area .compare-button .compare-number2{width: 22px; height: 22px; top: -7px; padding-left: 1px;} .scroll-button-area .product-button{width: 50px; height: 50px; margin-bottom: 8px; background-color: #F0F0F0; border-radius: 50%; display: flex; justify-content: center; align-items: center; padding: 9px 6px; position: relative;} .scroll-button-area .product-button img{width: 100%; height: 100%;} .scroll-button-area .product-button .compare-number{width: 20px; height: 20px; border-radius: 50%; background-color: #ED174D; color: #FFFFFF; font-family: "Roboto"; font-weight: 500; font-size: 14px; line-height: 24px; text-align: center; position: absolute; right: 0; top: -5px; display: flex; justify-content: center; align-items: center; padding-right: 1px; padding-top: 1px;} } /* .button-wrap{position: relative; z-index: 2000;} */ .button-wrap .compare-button{background-color: saddlebrown; padding: 10px 20px; margin-bottom: 10px;} .button-wrap .lately-button{background-color: thistle; padding: 10px 20px; } @media screen and (max-width : 320px) { .recently-popup .product-area .lately-product-list .product-card .product-data-area .product-name{max-width: 170px;} }