/* 공용 */
button {border-radius: 0; border: 0; outline: 0; cursor: pointer; -webkit-appearance: none; }
.clfix:after{content:""; display:table; clear:both;}
#gs_wrap {width: 100%;}
#gs_wrap * {box-sizing: border-box;}
.gs_title span{color:#949494; font-size:15px; line-height:1;}
.gs_title h2 {margin-top:5px; color:#3a3a3a; font-size:22px; line-height:1; font-family: 'Noto-B'; font-weight: normal;}

/* 대분류 전체보기 팝업 */
.gs_all_popup {position: fixed; display: none; bottom: 0; left: 0; width: 100%; max-height:85vh; height:100%; border-radius: 20px 20px 0 0; background-color: #fff; z-index: 100;}
.gs_all_popup::before {content:''; width:100%; height:calc(100% + 15vh); background:rgba(0,0,0,0.6); position:absolute; top:-15vh; left:0; z-index:-1;}
.gs_all_popup .gs_title {padding:30px 20px 20px; border-radius: 20px 20px 0 0; text-align: center; background:#fff; box-sizing: border-box; position:relative;}
.gs_all_popup .gs_title h2 {font-size:20px; font-family:'noto-B'; font-weight: normal; margin:0;}
.gs_all_popup .gs_popup_close {position: absolute; z-index: 1; top:26px; right:15px; width: 24px; height: 24px; background: url('//image5.compuzone.co.kr/img/images/svg_icon/3A3A3A/icon_line_close_24.svg') center center/contain no-repeat;}
.gs_B_popup .gs_btn_wrap {display: flex; flex-wrap: wrap; gap: 8px; padding:20px; background:#fff; box-sizing: border-box; height:calc(100% - 70px); overflow-y:auto;}
.gs_all_popup .gs_B_btn {width: calc(25% - 6px); min-width: 64px;}

@media screen and (min-width: 430px) {
	.gs_all_popup .gs_B_btn {width: calc(20% - 6.4px);}
}
/* 중분류 전체보기 팝업 */
.gs_all_popup.gs_M_popup {position: fixed; display: none; top: 0; left: 0; width: 100%; height: 100%; max-height:100%; padding: 115px 0 0; background:rgba(0,0,0,0.6) ;z-index: 98;}
.gs_all_popup.gs_M_popup::before {display:none;}
.gs_all_popup.gs_M_popup:after {content: ''; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 200px; background-color: #fff;}
.gs_M_popup .gs_title {position: relative; z-index: 1; padding: 0 20px;}
.gs_M_popup .gs_popup_close {top: 0;}
.gs_M_popup .gs_btn_wrap {position: relative; z-index: 1; margin-top: 20px; margin-left: 0; width: 100%; padding: 0 15px; overflow-y: auto; background-color: #fff; border-bottom: 20px solid #fff;}
.gs_all_popup .gs_M_btn {float: left; margin: 5px;}
.gs_all_popup .gs_M_btn > a {background-color: #f7f7f7;}

/* KV 영역 */
.gs_top_wrap {position: relative; width: 100%; height: 550px; background: linear-gradient(to right, #DEFFAB, #9DF6F6)}
.gs_top_wrap * {font-weight: normal;}
.gs_top_wrap::before {content: ''; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 148px; background: linear-gradient(to bottom, transparent, var(--coFF));}
.gs_top_wrap .top_inner {width: 100%; height: 100%; max-width: 750px; margin: 0 auto; padding:40px 0; position: relative;}
.gs_top_wrap .top_txt {position: relative; z-index: 1; text-align: center; margin-bottom:32px;}
.gs_top_wrap .top_txt h2 {margin:4px 0 12px; display: flex; align-items: center; justify-content: center; gap:4px;}
.gs_top_wrap .top_txt h2 i {display:inline-block; width:36px; height:36px;}
.gs_top_wrap .top_txt h2 i img {width:100%; height:100%;}
.gs_top_wrap .top_txt p {color:#949494;}
.gs_top_wrap .top_txt a {display: inline-flex; align-items: center; justify-content: center; height:44px; margin-top:20px; padding:0 44px; background:#000; border-radius: 22px;; color:#fff;}
.gs_top_wrap .top_ani {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.gs_top_wrap .top_ani > span {position: absolute;}
.gs_top_wrap .top_ani > span > img {width: 100%;} 
.gs_top_wrap .top_ani .timer {width: 587px; height: 587px; left: 50%; top: -190px; transform: translateX(-50%);}
.gs_top_wrap .top_ani .timer>img {animation: rotate 12s linear infinite;}
.gs_top_wrap .top_ani .obj1 {width: 146.5px; left: 50%; bottom: 0; transform: translateX(-50%);}
.gs_top_wrap .top_ani .obj2 {width: 452px; left: calc(50% + 10px); bottom: 88px; transform: translateX(-50%);}
.gs_top_wrap .top_ani .obj2>img {transform: translateX(200px); opacity: 0; animation: fadeInRight 0.7s 0.3s ease-in-out forwards;}
.gs_top_wrap .top_ani .arrow1 {left: 0; bottom: 98px; transform: translateX(200px); opacity: 0; animation: fadeInRight 0.7s 0.3s ease-in-out forwards;}
.gs_top_wrap .top_ani .arrow2 {right: -45px; bottom: 55.5px; transform: translateX(200px); opacity: 0; animation: fadeInRight 0.7s 0.5s ease-in-out forwards;}

@keyframes rotate {
	0% {transform: rotate(0);}
	100% {transform: rotate(360deg);}
}

@keyframes fadeInRight {
	0% {transform: translateX(200px); opacity: 0;}
	100% {transform: translateX(0); opacity: 1;}
}

/* 베스트 상품 */
.gs_best_wrap {position:relative; padding:20px 0 25px 20px; border-bottom: 10px solid #f7f7f7; background-color: #fff;}
.gs_best_wrap .ga_best_slide {margin-top:20px; padding-bottom: 25px;}
.gs_best_wrap .ga_best_slide .swiper-slide{width:140px !important;}
.gs_best_wrap .ga_best_slide .gs_best_num {display: inline-block; position: relative; height: 20px; line-height: 20px; font-size: 14px; color: #000; font-family: "spoqa B"; margin-bottom: 8px; letter-spacing: 0;}
.gs_best_wrap .ga_best_slide .gs_best_img {display:block; width:140px; height:140px; position: relative; border-radius: 10px; overflow: hidden;}
.gs_best_wrap .ga_best_slide .gs_best_img::before {content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,0.02);}
.gs_best_wrap .ga_best_slide .gs_best_img::after {content: ''; position: absolute; left: 10px; top: 10px; width: 24px; height: 24px; background: url('//image5.compuzone.co.kr/img/images/svg_icon/ETC/icon_fill_light_timer.svg') center center/24px no-repeat;}
.gs_best_wrap .ga_best_slide .gs_best_img > img{display:block; width:100%; height:100%;}
.gs_best_wrap .ga_best_slide .gs_best_info {margin-top: 10px; }
.gs_best_wrap .ga_best_slide .gs_best_info .pd_tit { width: 100%; height: 32px; margin: 5px 0; font-size:15px; line-height: 16px; color: #1b1b1b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.gs_best_wrap .ga_best_slide .gs_best_info .per { font-size: 16px; line-height: 20px; color: #f14738; margin-right: 4%; font-family: 'spoqa m'; font-weight: bold;}
.gs_best_wrap .ga_best_slide .gs_best_info .price { font-size: 16px; line-height: 20px; color: #3a3a3a; font-family: 'spoqa m'; font-weight: bold;}
.gs_best_wrap .ga_best_slide .gs_best_info .price > em { font-size: 12px; line-height: 20px; color: #3a3a3a; font-family: 'spoqa M'; font-weight: normal;}
.gs_best_wrap .ga_best_slide.swiper-container .swiper-pagination-progressbar{top:inherit; bottom:0; width: calc(100% - 20px); background:#d1d2d4; display: none;}
.gs_best_wrap .swiper-container .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#333;}
.gs_best_wrap .ga_best_slide .gs_best_img .couponBalloon {position: absolute; top: 9px; left: 38px; z-index: 1; display: inline-block; padding: 4px 8px 3px; border: 1px solid; border-radius: 5px 5px 5px 0; font-size: 12px; font-family: 'noto-M'; font-weight: normal; letter-spacing: -0.5px; background: var(--coFF);}
.gs_best_wrap .ga_best_slide .gs_best_img .couponBalloon.green {border-color: var(--co1F); color: var(--co1F);}

/* 대분류 아이콘 버튼 */
.gs_B_btn_slide_wrap {position:relative; padding:30px 0 30px 20px; border-bottom: 10px solid #f7f7f7; background-color: #fff;}
.gs_B_btn_slide_wrap .gs_B_btn_slide {margin-top: 15px;}
.gs_B_btn_slide_wrap .gs_B_btn_slide .swiper-slide{width:70px;}
.gs_B_btn { display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: center; gap: 5px; width: 70px; height: 94px; padding: 10px; background: #f9f9f9; border-radius: 5px; overflow: hidden; box-sizing: border-box;}
.gs_B_btn .gs_btn_icon {display:inline-block; width:100%; height:39px; background-position: center center; background-size: 28px; background-repeat: no-repeat;}
.gs_B_btn .gs_B_btn_tit {font-size: 11px; font-family: 'noto-R'; font-weight: normal; color: #3A3A3A; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.gs_B_btn.on { background: #1C8FED;}
.gs_B_btn.on .gs_B_btn_tit { color:#fff;}


/* 대분류 클릭시 on 추가 */
.gs_B_btn.on .gs_btn_icon > img {display: none;}
/* 대분류 아이콘 */
.gs_B_btn .gs_btn_icon.gs_cateAll {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_all_circle_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate1 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_desktop_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate2 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_notebook_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate4 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_computer_parts_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate8 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_mouse_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate5 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_monitor_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate11 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_printer_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate12 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_wifi_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate9 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_software_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate101 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_tv_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate13 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_washingmachine_24.svg")}
.gs_B_btn .gs_btn_icon.gs_cate110 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_cook_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate107 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_fan_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate87 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_sofa_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate88 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_phone_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate7 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_camera_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate103 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_game_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate105 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_sport_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate14 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_car_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate89 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_box_24.svg");}
.gs_B_btn .gs_btn_icon.gs_cate111 {background-image: url("//image5.compuzone.co.kr/img/images/svg_icon/MIX/icon_line_server_24.svg")}
.gs_B_btn.on .gs_btn_icon {filter: grayscale(1) brightness(10);}


/* 대분류 전체보기 버튼 */
.gs_title .gs_all_btn {color: #999; font-size: 12px; line-height: 1; width: 30px; height: 30px; position: absolute; display: inline-block; right: 20px; top: 46px; background-color: #fff;}
.gs_title .gs_all_btn img{width: 100%;}
/* .gs_title .gs_all_btn:after { content: ""; display: inline-block; vertical-align: top; width: 6px; height: 6px; margin: 2px 0 0 0; border-bottom: 1px solid #999; border-right: 1px solid #999; -webkit-transform: rotate( -45deg ); transform: rotate( -45deg ); } */

/* 중분류 */
.gs_M_wrap {position: relative; width: 100%; background-color: #fff; border-bottom: 10px solid #f7f7f7;}
.gs_M_wrap .gs_M_toggle { position: absolute; top: 0; right: 0; z-index: 2; text-align: right;}
.gs_M_wrap .gs_M_toggle:before { content: ""; position: absolute; top: 50%; left: -30px; z-index: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 30px; height: 100%; background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(66%, #fff)); background-image: linear-gradient(to right, rgba(255, 255, 255, 0), #fff 66%); }
.gs_M_wrap .gs_M_toggle .gs_M_btn { width: 42px; height: 68px; background-color: #fff; display: inline-block; margin: 0; padding: 0; text-align: center; vertical-align: middle; border: none; white-space: nowrap; cursor: pointer; }
.gs_M_wrap .gs_M_toggle .gs_M_btn:before { content: ""; position: absolute; top: 50%; left: 0; z-index: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%); height: 30px; border-right: 1px solid #d8d8d8; }
.gs_M_wrap .gs_M_toggle .gs_M_btn:after { content: ""; display: inline-block; vertical-align: top; width: 8px; height: 8px; margin: 1px 0 0 0; border-bottom: 1px solid #595959; border-right: 1px solid #595959; -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); }
.gs_M_btn_wrap {height: 68px; overflow: hidden; overflow-x: auto; white-space: nowrap;}
.gs_M_btn_wrap > ul { padding: 15px 0 15px 20px; font-size:0;}
.gs_M_btn { display: inline-block; vertical-align: top;}
.gs_M_btn > a { display: block; padding: 0 14px; border-radius: 25px; height: 38px; line-height: 38px; color: #828282; font-size: 14px; letter-spacing: -0.3px; text-align: center;}
.gs_M_btn > a.on { color: #fff; background-color: #000;}
.gs_M_btn_wrap .gs_M_btn:last-child { padding-right: 75px; }

/* 제품 리스트 상단 */
.gs_L_wrap .gs_L_top {background-color: #fff; padding: 10px 20px; display: flex; align-items: center; justify-content: space-between;}
.gs_L_wrap .gs_L_top .total { display: inline-block; font-family: 'Noto-B'; font-size: 14px; letter-spacing: -0px; color: #1a1a1a;}
.gs_L_wrap .gs_L_top .sort_btn {display: flex; align-items: center; gap: 2px; font-size: 14px; height: 20px; color: #1a1a1a; position: relative; background: none; font-family: 'Noto-M'; letter-spacing: -1px; position:relative;}
.gs_L_wrap .gs_L_top .sort_btn img{width: 18px !important; height: 18px !important;}
.gs_L_wrap .gs_L_top.clfix::after {display: none;}
.gs_L_wrap .gs_L_top>ul li {position:relative;}
.gs_L_wrap .gs_L_top>ul li.on .gs_sort_popup {display: block;}
.gs_L_wrap .gs_sort_popup {width:105px; padding:20px 0 20px 20px; position:absolute; top:27px; right:0px; background:#fff; border-radius:20px; box-shadow:3px 3px 10px 0 rgba(0, 0, 0, 0.16); box-sizing: border-box; z-index:3; display: none;}
.gs_L_wrap .gs_sort_popup li {margin-bottom:20px;}
.gs_L_wrap .gs_sort_popup li input {display: none;}
.gs_L_wrap .gs_sort_popup li label {font-family:'noto-R'; font-size:14px;}
.gs_L_wrap .gs_sort_popup li.on label {font-family:'noto-B';}
.gs_L_wrap .gs_sort_popup li:last-child {margin-bottom:0px;}
.gs_L_wrap .gs_L_top .total .gs_sort_popup {right: auto; left: -4px; width: max-content; padding: 20px;}
.gs_L_wrap .gs_L_top .total>li.on .sort_btn > img {transform: rotate(180deg); position: relative; top: 2px;}
.gs_L_wrap .gs_L_mid {width: 100%; padding: 0 20px 10px;}

/* 제품 리스트 // 기존 스타일에서 변형함! common.css 필수 */
.gs_L_wrap #prdlst .list_area {background-color: #fff; display: flex;}
.gs_L_wrap #prdlst .list_prod_box {border: solid #dedede; border-width: 1px 0 0 1px; padding: 0;}
.gs_L_wrap #prdlst .list_prod_box > li { border: solid #dedede; border-width: 0 1px 1px 0; padding: 0; }
.gs_L_wrap #prdlst .list_prod_box > li a { border-bottom: 0; padding: 10px; min-height: calc(50vw + 170px); max-height: calc(50vw + 170px);}
.gs_L_wrap .list_prod_box .icon_box2 { padding: 10px 10px 0; clear: both;}
.gs_L_wrap #prdlst .list_prod_box > li .item { height: 36px; color: #1b1b1b; padding: 0 10px; margin-top: 5px;}
.gs_L_wrap .list_prod_box .prd_price { padding: 10px !important; position: relative; bottom: 0; }
.gs_L_wrap .prd_price .sale { margin-bottom: 2px; }
.gs_L_wrap .prd_price .sale .discount { font-size: 16px; }
.gs_L_wrap .prd_price .sale .under { font-size: 13px; }
.gs_L_wrap .prd_price .won .number { font-size: 18px; }
.gs_L_wrap .prd_price .won>em { font-size: 15px; }
.gs_L_wrap #prdlst .list_prod_box > li .review { position: relative; padding: 0 10px; height: 20px; background-color: #fff; }
.gs_L_wrap #prdlst .list_prod_box > li .attbx { padding: 8px 11px; }
.gs_L_wrap .productBgImg { height: calc(50vw - 21.5px) !important; }
@media screen and (min-width: 768px) {
	.gs_L_wrap #prdlst .list_prod_box > li a{min-height: calc(25vw + 170px); max-height: calc(25vw + 170px);}
	.gs_L_wrap .productBgImg{height: calc(25vw - 21.25px) !important;}
}


/* 페이징*/
.gs_L_wrap #prdlst .bottom_area { background: #fff; margin-top: 0; }
.m_page_area { text-align:center; padding: 30px 0 0;}
.m_page_area > a { width:30px; height:30px; line-height:29px; display:inline-block; background:#fff; border:#d7d7d7 1px solid; vertical-align: top; color:#333 }
.m_page_area > a > span { vertical-align: 2px; }
.m_page_area > a:hover { color:#333;}
.m_page_area > a.selected { background:#3c476e; border:#3c476e 1px solid; color:#fff !important; font-weight:bold; }
.m_page_area > a.prev { margin-right:10px; }
.m_page_area > a.next { margin-left:10px; }
.m_page_area > a.prev .r_arrow {display:inline-block;  width:7px; height:7px; border: solid #d5d5d5; border-width: 0 2px 2px 0; -webkit-transform: rotate(135deg); transform: rotate(135deg);}
.m_page_area > a.prev .is_arrow {border-color: #888888;}
.m_page_area > a.next .l_arrow {display:inline-block;  width:7px; height:7px; border: solid #d5d5d5; border-width: 0 2px 2px 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.m_page_area > a.next .is_arrow {border-color: #888888;}

/* 117902 토요일 공지 수동배너 */
.bnr_bottom_are.todayDeal {max-width: 500px; width: calc(100% - 16px); box-sizing: border-box; padding: 12px 16px; z-index: 96; background:rgba(0,0,0,0.9);}
.bnr_bottom_are.todayDeal a.noa_text{ letter-spacing: -0.5px; width: 100%; display: flex; align-items: center; justify-content: center; gap:4px;}
.bnr_bottom_are .noa_text > span {color: #fff;}
.bnr_bottom_are .noa_text > i {background: url('//image5.compuzone.co.kr/img/images/svg_icon/FFFFFF/icon_line_next_12.svg') center center/cover no-repeat; width: 12px; height: 12px; display: inline-block;}

/* 134808 바로픽업 bnr */
.line-bnr {margin: 0 auto; max-width: 656px; padding: 30px 16px 0; display: block;}
.line-bnr a {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; border-radius: 10px; overflow: hidden;}
.line-bnr img {width: 100%;}