@charset "utf-8";
@import url("../fonts/font.css?22040801");

/* common layout */
body,html{box-sizing:border-box;}
body.amact{overflow-y:hidden;}
html.amact{overflow-y:hidden;padding-right:16px;}

.full_width{position:relative;width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;}
.inner{width:1280px;margin:0 auto;}
.msection{padding-top:100px;}

.area_wrap{position:relative;overflow:hidden;}
.area_wrap .left_area{float:left;}
.area_wrap .right_area{float:right;}

.promotion_bnr{position:relative;}
.promotion_bnr > a.bn_close{position:absolute;top:13px;left:50%;margin-left:600px;}

#skip-to-content a{display:none;}
#skip-to-content a:focus{display:block;}

#hd{position:relative; z-index:10;}

#ft{border-top:1px solid #212523;}
#ft .ft_top{border-bottom:1px solid #ccc;}
#ft .links li{position:relative;float:left;padding:0 20px;}
#ft .links li:first-child{padding-left:0;}
#ft .links li:before{content:'';position:absolute;top:50%;left:0;width:1px;height:10px;margin-top:-5px;background:#ccc;}
#ft .links li:first-child:before{display:none;}
#ft .links li a{height:54px;font-size:15px;line-height:54px;}

#ft .notice > p{display:inline-block;vertical-align:top;height:54px;font-size:14px;line-height:54px;}
#ft .notice > p.tit{width:128px;font-weight:bold;}
#ft .notice > p.text{position:relative;width:340px;padding-right:32px;}
#ft .notice > p.text a.more{position:absolute;top:0;right:0;width:32px;height:54px;background:url('../images/common/ft_icon_plus.png') no-repeat center right;background-size:12px;text-indent:-9999px;}
#ft .notice > p.text a{display:block;}

#ft .ft_mid{padding-top:40px;padding-bottom:40px;}
#ft .ft_mid .inner > div{float:left;}
#ft .ft_mid .inner > div.ft_info{width:780px;font-size:14px;line-height:23px;}
#ft .ft_mid .inner > div.ft_customer{width:380px;}
#ft .ft_mid .inner > div.ft_link{width:120px; font-size: 14px; }

#ft .ft_mid .inner > div.ft_info > .ft_company{font-weight:bold;}
#ft .ft_mid .inner > div.ft_info > address{color:#666;}
#ft .ft_mid .inner > div.ft_info > address > a{margin-left:20px;border-bottom:1px solid #717171;color:#222;font-weight:bold;}
#ft .ft_mid .inner > div.ft_info > address > span{margin-right:20px;}
#ft .ft_mid .inner > div.ft_info > .copy{color:#999;}
#ft .ft_mid .inner > div.ft_info > .ft_mark{margin-top:15px;}
#ft .ft_mid .inner > div.ft_info > .ft_mark li{float:left;margin-right:40px;}

#ft .ft_mid .inner > .ft_customer .num{position:relative; padding-left:30px; font-size:20px; font-weight:bold; line-height:26px;}
#ft .ft_mid .inner > .ft_customer .num > em.call{position:absolute;top:3px;left:0;width:22px;height:20px;background:url('../images/common/ft_icon_call.png') no-repeat 0 0;}
#ft .ft_mid .inner > .ft_customer .num > em.bank{position:absolute;top:5px;left:0;width:22px;height:20px;background:url('../images/common/ft_icon_bank.png') no-repeat 0 0;}
#ft .ft_mid .inner > .ft_customer .num > a{position:absolute; display:block; top:2px; left:138px;}
#ft .ft_mid .inner > .ft_customer .num > span{position:relative;top:-2px;font-size:15px;}
#ft .ft_mid .inner > .ft_customer .text{margin-top:10px;font-size:13px;font-weight: 500;line-height:17px;color:#8a8a8a;}
#ft .ft_mid .inner > .ft_customer .text > span{ margin-bottom: 3px; color:#222;}

#ft .ft_mid .inner > .ft_link ul li{position:relative;margin-bottom:15px;}
#ft .ft_mid .inner > .ft_link ul li > a{display:block;padding-right:8px;}
#ft .ft_mid .inner > .ft_link ul li > a:after{content:'';position:absolute;top:2px;right:0;width:8px;height:12px;background:url('../images/common/ft_arrow_link.png') no-repeat 0 0;}

#ft .ft_bottom{height:50px;background:#000;}
#ft .ft_bottom p{color:#ccc;font-size:13px;line-height:50px;}
#ft .ft_bottom .cooperation li{float:left;padding:15px 0;margin-right:45px;}

#ft .top{position:fixed;bottom:-10px;opacity: 0; visibility: hidden;left:50%;margin-left:580px; z-index:10; transition: all 0.2s;}
#ft .top.btnFixed{bottom: 0;opacity: 1; visibility: visible;}

#nav_right{position:fixed; top:270px; left:50%; width:100px; margin-left:700px; z-index:9;}
#nav_right .right_quick .rq_box_1{margin-bottom:10px}
#nav_right .right_quick .rq_box_2{margin-bottom:10px;}
#nav_right .right_quick .rq_box_3{position: relative; background-color:#fff;box-sizing:border-box;text-align:center;}
#nav_right .right_quick .rq_box_3 a.q_cart{display:block;position: relative; }
#nav_right .right_quick .rq_box_3 .cart_number { position: absolute; top: 62px; right: 2px; display: flex; justify-content: center; width: 22px; height: 15px; background-color: #33703f; border-radius: 20px; font-size: 10px; line-height: 15px; color: #fff; font-weight: 700; letter-spacing: -1px; z-index: 1; }
#nav_right .right_quick .rq_box_4{margin-bottom:10px; padding:10px 0;background-color:#fff;border:1px solid #ccc;text-align:center;}
#nav_right .right_quick .rq_box_4 .history_arrow {position:relative;display:block;padding:10px 0;}
#nav_right .right_quick .rq_box_4 .history_arrow.prev:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:url('../images/common/bg_border_dash.png') repeat-x 0 0;}
#nav_right .right_quick .rq_box_4 .history_arrow.next:after{content:'';position:absolute;top:0;left:0;width:100%;height:1px;background:url('../images/common/bg_border_dash.png') repeat-x 0 0;}
#nav_right .right_quick .rq_box_4 .product_history_list{height:220px;padding:15px 0;overflow:hidden;box-sizing:border-box;}
#nav_right .right_quick .rq_box_5{margin-bottom:10px;}
#nav_right .right_quick .rq_box_6{margin-bottom:10px;}
#nav_right .right_quick .rq_box_7 .sns_bar{width:84px;margin:0 auto;}
#nav_right .right_quick .rq_box_7 .sns_bar li{float:left;font-size:0;margin-left:2px;margin-right:2px; margin-bottom:4px;}
#nav_right .right_quick .rq_box_7 .sns_bar li a{display:block;}
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_facebook{width:24px; height:24px; background:url('../images/common/icon_q_facebook_off.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_instagram{width:24px; height:24px; background:url('../images/common/icon_q_instagram_off.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_kakao{width:24px; height:24px; background:url('../images/common/icon_q_kakao_off.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_cafe{width:24px; height:24px; background:url('../images/common/icon_q_cafe_off.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_ytb{width:24px; height:24px; background:url('../images/common/icon_q_ytb_off.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_nstore{width:24px; height:24px; background:url('../images/common/icon_q_naver_off.png') no-repeat 0 0 / 24px ; }

#nav_right .right_quick .rq_box_7 .sns_bar li a.q_facebook:hover{background:url('../images/common/icon_q_facebook_on.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_instagram:hover{background:url('../images/common/icon_q_instagram_on.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_kakao:hover{background:url('../images/common/icon_q_kakao_on.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_cafe:hover{background:url('../images/common/icon_q_cafe_on.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_ytb:hover{background:url('../images/common/icon_q_ytb_on.png') no-repeat 0 0 / 24px ; }
#nav_right .right_quick .rq_box_7 .sns_bar li a.q_nstore:hover{background:url('../images/common/icon_q_naver_on.png') no-repeat 0 0 / 24px ; }

#nav_left{position:fixed; top:270px; left:50%; width:100px; margin-left:-800px; z-index:9;}
#nav_left .left_quick .rq_box_1{margin-bottom:10px}
#nav_left .left_quick .rq_box_2{margin-bottom:10px;}


/* 띠배너 */
#promotionBanner { position: relative; width: 100%; height: 70px; background-color: #069255; font-size: 0; }
#promotionBanner .popContents { position: relative; max-width: 1920px; margin: auto; }
#promotionBanner .popContents .img_wrap { max-width: 1244px; margin: auto; font-size: 0; }
#promotionBanner .popContents .img_wrap a { display: block; }
#promotionBanner .popContents .img_wrap a img { width: 1244px; }

#promotionBanner .popClose { position: absolute; top: 7px; left: 50%; margin-left: 650px; width: 110px; z-index: 15; text-align: center; }
#promotionBanner .popClose .top { margin-top: 7px; }
#promotionBanner .popClose #chkday + label { margin-left: 6px; font-size: 13px; line-height: 18px; color: rgba(255,255,255,0.7); vertical-align: top; }
#promotionBanner .popClose .bottom img { width: 33px; }
/* 띠배너 end */



/* 레이아웃 리뉴얼 2505 */
#headerLayout * { box-sizing: border-box; }
#headerLayout button { line-height: 1; border: none; background: none; }
#headerLayout .header_top { position: relative; background: url("//img.netpx.co.kr/images/netpx/common/header_bg.png") center no-repeat #33703f; }
#headerLayout .header_top .inner.disflex { height: 38px; justify-content: space-between; align-items: center; }
#headerLayout .header_top .header_event { width: 50%; }
#headerLayout .header_top .header_event a { width: 100% !important; font-size: 14px; color: #fff; text-align: left; }
#headerLayout .header_top .header_event a .bold { font-weight: 800; }
#headerLayout .header_top .header_menu { display: flex; justify-content: space-between; gap: 16px; }
#headerLayout .header_top .header_menu > * { font-size: 14px; color: #e8e8e8; }

#headerLayout .header_bottom { position: relative; height: 90px; }
#headerLayout .header_bottom .inner { height: 90px; justify-content: space-between; align-items: center; }
#headerLayout .header_bottom .header_search { position: relative; width: 440px; height: 50px; border: 1px solid #212121; border-radius: 5px; z-index: 100; }
#headerLayout .header_bottom .header_search.searchLayer_open { border-color: #fff; border-radius: 5px 5px 0 0; }
#headerLayout .header_bottom .header_search .searchLayer { display: none; position: absolute; padding-top: 45px; top: 0; width: 100%; background-color: #fff; box-shadow: 0 2px 10px rgba(0,0,0,0.3); border-radius: 5px; z-index: 50; }
#headerLayout .header_bottom .header_search .searchLayer::before { content: ''; position: absolute; top: 48px; right: 0; left: 0; margin: auto; width: auto; height: 1px; background-color: #ccc; }
#headerLayout .header_bottom .header_search .searchLayer .searchLayer_content { padding: 20px 15px; font-size: 0; text-align: left; }
#headerLayout .header_bottom .header_search .searchLayer .title { display: flex; height: 30px; align-items: center; margin-bottom: 5px; }
#headerLayout .header_bottom .header_search .searchLayer .title .txt { flex: 1 1 auto; font-size: 17px; font-weight: 500; }
#headerLayout .header_bottom .header_search .searchLayer .title .btn { font-size: 13px; font-weight: 400; color: #666; }
#headerLayout .header_bottom .header_search .searchLayer .recent_none { font-size: 13px; color: #666; }
#headerLayout .header_bottom .header_search .searchLayer .keyword_wrap { display: flex; flex-flow: wrap; gap: 6px; }
#headerLayout .header_bottom .header_search .searchLayer .keyword_wrap .keyword { display: inline-flex; flex-wrap: nowrap; padding: 3px 3px 2px 7px; align-items: center; font-size: 13px; border: 1px solid #e1e1e1; overflow: hidden; }
#headerLayout .header_bottom .header_search .searchLayer .keyword_wrap .keyword a { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-break: break-all; }
#headerLayout .header_bottom .header_search .searchLayer .keyword_wrap .keyword .del { flex: 0 0 20px; height: 20px; background: url('//img.netpx.co.kr//front/netpx_v3/skin/images/common/icon_close_w22_black.png') 7px center no-repeat; background-size: 7px; } 

#headerLayout .header_bottom .header_search .searchLayer .popular_word_list .ttl { margin-bottom: 5px; font-size: 17px; font-weight: 500; line-height: 30px; }
#headerLayout .header_bottom .header_search .searchLayer .word_list { display: flex; flex-flow: column wrap; justify-content: flex-start; height: 125px; } 
#headerLayout .header_bottom .header_search .searchLayer .popular_word { display: flex; justify-content: left; flex-wrap: wrap; width: 50%; height: 25px; align-items: center; padding-right: 10px; }

/* 검색 키워드 입력 */
.searchLayer_result { font-size: 0; text-align: left; }
/* .searchLayer_result .result_list { padding: 12px 0; }
.searchLayer_result .result_list:last-child { border-bottom: none; } */
.searchLayer_result .result_list a { display: flex; flex-direction: row; height: 20px; margin: 10px 0; gap: 12px; align-items: center; }
.searchLayer_result .result_list a .circle { flex: 0 0 40px; font-size: 11px; letter-spacing: -0.1em; color: #333; background-color: #f1f1f1; text-align: center; }
.searchLayer_result .result_list a .list_word { flex: 1; display: inline-flex; flex-wrap: nowrap; width: calc(100% - 100px); font-weight: 500; overflow: hidden; }
.searchLayer_result .result_list a .list_word .word { font-size: 14px; line-height: 22px; color: #666; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-break: break-all; }
.searchLayer_result .result_list a .list_word .word_info { font-size: 11px; line-height: 18px; color: #999; }
.searchLayer_result .result_list a .list_info { flex: 0 0 40px; font-size: 12px; color: #777; text-align: right; }

.searchLayer_result em { color: #00b666; }


#headerLayout .header_bottom .header_search .searchLayer .popular_word:nth-child(n+6):nth-child(-n+10) { padding-right: 0; padding-left: 10px; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word a { display: flex; justify-content: space-between; width: 100%; height: 26px; align-items: center; padding-left: 2px; font-size: 12px; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word a > .rank { flex: 0 0 22px; font-weight: 700; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word a > .text { flex: 1; font-size: 14px; color: #666; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word > a:hover > .text { color: #000; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word > a > .state { flex: 0 0 30px; font-size: 11px; font-weight: 500; color: #33703f; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word > a > .state.up { color: #ff4800; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word > a > .state.up em{ display: inline-block; width: 10px; height: 10px; margin-right: 4px; background:url('//img.netpx.co.kr/front/netpx_v3/skin/images/common/arrow_rankup.png') no-repeat 0 4px; }
#headerLayout .header_bottom .header_search .searchLayer .popular_word > a > .state.down{color:#5b5b5b;}
#headerLayout .header_bottom .header_search .searchLayer .popular_word > a > .state.down em { display: inline-block; width: 10px; height: 10px; margin-right: 4px; background:url('//img.netpx.co.kr/front/netpx_v3/skin/images/common/arrow_rankdown.png') no-repeat 0 4px;}
#headerLayout .header_bottom .header_search .search_label { position: relative; align-items: center; z-index: 300; }
#headerLayout .header_bottom .header_search .search_label > input { position: relative; display: inline-block; vertical-align: top; width: 380px; height: 48px; padding-right: 5px; margin-left: 14px; font-size: 16px; font-weight: 400; line-height: 46px; background-color: #fff; }
#headerLayout .header_bottom .header_search .search_label > input::placeholder { color: #ababab; }
#headerLayout .header_bottom .header_search .search_label > .search_btn { width: 35px; text-align: center; line-height: 1; }
#headerLayout .header_bottom .header_search .search_label > .search_btn svg { width: 25px; height: 25px; }
#headerLayout .header_bottom .header_primary { gap: 14px; margin-right: 5px; }
#headerLayout .header_bottom .header_primary .icon { display: flex; line-height: 1; }
#headerLayout .header_bottom .header_primary .icon svg { width: 32px; height: 32px; shape-rendering: geometricPrecision; }
#headerLayout .header_bottom .header_primary .icon .icon_cart .cart_number,
#headerLayout .header_bottom .header_primary .icon .icon_alarm .count { position: absolute; top: 18px; right: -10px; display: flex; justify-content: center; width: 22px; height: 15px; background-color: #33703f; border-radius: 20px; font-size: 10px; line-height: 15px; color: #fff; font-weight: 700; letter-spacing: -1px; }
#headerLayout .header_bottom .header_primary .icon .alarm_message { display: none; position: absolute; top: 40px; right: -4px; padding: 15px; background: #fff; width: 380px; height: 600px; border: 1px solid #ccc; font-size: 12px; text-align: left; z-index: 1000; overflow: hidden; overflow-y: scroll; -ms-overflow-style: none; scrollbar-width: none; }
#headerLayout .header_bottom .icon .alarm_message_title { display: flex; justify-content: space-between; align-items: center; }
#headerLayout .header_bottom .icon .alarm_message_title .ttl { font-size: 17px; font-weight: 600; }
#headerLayout .header_bottom .icon .alarm_message_title .btn_alarm_setting { width: 22px; height: 22px; cursor: pointer; }
/* #headerLayout .header_bottom .header_primary .icon .alarm_message ul li { position: relative; width: 100%; margin-left: 0; line-height: 18px; box-sizing: border-box; }
#headerLayout .header_bottom .header_primary .icon .alarm_message ul li::after { content: ''; position: absolute; bottom: 0; right: 0; left: 0; margin: auto; width: auto; height: 1px; background-color: #ccc; }
#headerLayout .header_bottom .header_primary .icon .alarm_message ul li:last-child::after { display: none; }
#headerLayout .header_bottom .header_primary .icon .alarm_message ul li a {display: block; text-align: left; padding: 5px 10px; }
#headerLayout .header_bottom .header_primary .icon .alarm_message ul li:hover a { background-color: #f0f0f0;} */
.notification_wrap { position: relative; }
.notification_wrap .tab_menu { display: flex; align-items: center; margin: 10px 0 5px; }
.notification_wrap .tab_menu li { flex: 1; display: flex; align-items: center; justify-content: center; height: 30px; font-size: 12px; border-bottom: 1px solid #222; cursor: pointer; }
.notification_wrap .tab_menu li.on { font-weight: bold; color: #000; border: 1px solid #222; border-bottom: 1px solid #fff; }
.notification_wrap .tab_content { display: none; max-height: 450px; padding-bottom: 20px; overflow-y: auto; ::-webkit-scrollbar { display: block; width: 2px; }}
.notification_wrap .tab_content.on { display: block; }
.notification_wrap .tab_content .list { padding: 10px 4px; display: flex; flex-direction: column; gap: 3px; border-bottom: 1px solid #ccc; }
.notification_wrap .tab_content .list .text { font-size: 13px; }
.notification_wrap .tab_content .list .date { font-size: 11px; color: #999; }
.alarm_message_list { position: relative; height: 470px; }
.alarm_message_list .btn_del { position: absolute; bottom: -55px; right: 0; left: 0; margin: auto; display: flex; justify-content: center; align-items: center; width: 100px; height: 26px; font-size: 12px; border: 1px solid #222; border-radius: 3px; }
.alarm_setting { display: none; margin-top: 10px; padding: 0 6px; border-top: 1px solid #222; }
.alarm_setting .section_group { margin-bottom: 14px; border-bottom: 1px solid #eee; }
.alarm_setting .section_subtitle { font-size: 14px; font-weight: 600; color: #555; margin-bottom: 10px; }
.alarm_setting .setting_item { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.alarm_setting .setting_text { font-size: 14px; color: #333; }
.alarm_setting .small_text { font-size: 12px; color: #888; }
.alarm_setting .note { font-size: 11px; color: #aaa; margin-top: 15px; line-height: 1.4; }
.alarm_setting .switch { position: relative; display: inline-block; width: 44px; height: 24px; }
.alarm_setting .switch input { opacity: 0; width: 0; height: 0; }
.alarm_setting .slider { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; border-radius: 34px; transition: .4s; cursor: pointer; }
.alarm_setting .slider:before { content: ""; position: absolute; width: 18px; height: 18px; bottom: 3px; left: 3px; background-color: white; border-radius: 50%; transition: .4s; }
.alarm_setting input:checked + .slider { background-color: #317234; }
.alarm_setting input:checked + .slider:before { transform: translateX(20px); }
#toast { position: fixed; left: 50%; bottom: 30px; min-width: 250px; padding: 12px; font-size: 14px; color: #fff; line-height: 1.4; text-align: center; background-color: #333; border-radius: 8px; transform: translateX(-50%);  opacity: 0; transition: opacity 0.5s, bottom 0.5s; visibility: hidden; z-index: 99999; }
#toast.show { visibility: visible; opacity: 1; bottom: 50px; }
#toast .toast-message { font-size: 12px; color: #ccc; display: block; margin-bottom: 4px; }
#navLayout .nav_primary .icon .alarm_message_title { display: flex; justify-content: space-between; align-items: center; }
#navLayout .nav_primary .icon .alarm_message_title .ttl { font-size: 18px; font-weight: 700; }
#navLayout .nav_primary .icon .alarm_message_title .btn_alarm_setting { width: 22px; height: 22px; }


#navLayout { background-color: #fff; transition: none; }
#navLayout * { box-sizing: border-box; }
#navLayout.nav_line { border-bottom: 1px solid #f1f1f1; }
#navLayout button { line-height: 1; border: none; background: none; }
#navLayout .fixed_logo { display: none; position: absolute; top: 5px; left: 15px; width: 100px; }
#navLayout .fixed_logo img { max-width: 100%; }
#navLayout .nav_fix_mypage { display: none; }
#navLayout .inner.disflex { height: 30px; justify-content: space-between; align-items: center; }
#navLayout .nav_category a { align-items: center; flex: 0 0 110px; }
#navLayout .nav_category svg { width: 26px; height: 26px; }
#navLayout .nav_category span { padding: 0 12px 0 6px; font-size: 16px; font-weight: 600; color: #212121; line-height: 26px; }
#navLayout .nav_gnb { display: flex; font-size: 16px; color: #212121; gap: 20px; }
#navLayout .nav_gnb a { position: relative; padding: 0 10px; font-weight: 500; }#navLayout .nav_gnb a:hover { font-weight: 700; color: #33703f; }
#navLayout .nav_button { height: 38px; align-items: center; gap: 10px; }
#navLayout .nav_button .btn { display: block; position: relative; width: 130px; font-size: 12px; font-weight: 700; color: #33703f; text-align: center; line-height: 36px; text-transform: uppercase; border: 1px solid #d1d1d1; background: #fff; border-radius: 18px; letter-spacing: 0.1em; overflow: hidden; transition: all 0.6s ease; }
#navLayout .nav_button .btn:hover { border-color: #33703f; letter-spacing: .2em; }
#navLayout .nav_button .btn:before { position: absolute; content: ''; display: inline-block; top: -180px; left: 0; width: 30px; height: 100%; background-color: #fff; animation: shiny-btn1 4s ease-in-out infinite; }
@-webkit-keyframes shiny-btn1 {
  0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
#navLayout .nav_button .fix_search { line-height: 1; display: none; }
#navLayout .nav_button .fix_search svg { width: 30px; height: 30px; }

#navLayout .nav_primary { display: none; gap: 14px; margin-right: 5px; }
#navLayout .nav_primary .icon { display: flex; line-height: 1; }
#navLayout .nav_primary .icon svg { width: 32px; height: 32px; shape-rendering: geometricPrecision; }
#navLayout .nav_primary .icon .icon_cart .cart_number,
#navLayout .nav_primary .icon .icon_alarm .count { position: absolute; top: 18px; right: -8px; display: flex; justify-content: center; width: 22px; height: 15px; background-color: #33703f; border-radius: 20px; font-size: 10px; line-height: 15px; color: #fff; font-weight: 700; letter-spacing: -1px; }
#navLayout .nav_primary .icon .icon_alarm .count { position: absolute; top: 18px; right: -10px; display: flex; justify-content: center; width: 22px; height: 15px; background-color: #33703f; border-radius: 20px; font-size: 10px; line-height: 15px; color: #fff; font-weight: 700; letter-spacing: -1px; }
#navLayout .nav_primary .icon .alarm_message { display: none; position: absolute; top: 40px; right: -4px; padding: 15px; background: #fff; width: 380px; height: 600px; border: 1px solid #ccc; font-size: 12px; text-align: left; z-index: 1000; overflow: hidden; overflow-y: scroll; }
/* #navLayout .nav_primary .icon .alarm_message ul li { position: relative; width: 100%; margin-left: 0; line-height: 18px; box-sizing: border-box; }
#navLayout .nav_primary .icon .alarm_message ul li::after { content: ''; position: absolute; bottom: 0; right: 0; left: 0; margin: auto; width: auto; height: 1px; background-color: #ccc; }
#navLayout .nav_primary .icon .alarm_message ul li:last-child::after { display: none; }
#navLayout .nav_primary .icon .alarm_message ul li a {display: block; text-align: left; padding: 5px 10px; }
#navLayout .nav_primary .icon .alarm_message ul li:hover a { background-color: #f0f0f0;} */

#navLayout.navFixed.noneFixed { position: relative !important; padding-top: 0; } 
#navLayout.navFixed { position: fixed; display: flex; gap: 30px; height: 30px; padding: 20px 30px 0; inset: 0; box-shadow: 0 2px 6px rgba(0,0,0,0.1); z-index: 100; transition: padding-top 0.3s; }
#navLayout.navFixed .fixed_logo { display: block; }
@media screen and (max-width:1630px) {
  #navLayout.navFixed .fixed_logo { display: none; }
}
#navLayout.navFixed .nav_button .fix_search { display: block; }
#navLayout.navFixed .nav_button .btn { display: none; }
#navLayout.navFixed .nav_primary { display: flex; }

.layer_notification { display: none; position: fixed; bottom: 10px; right: 50%; transform: translateX(50%); max-width: 80%; background-color: rgba(0,0,0,0.6); color: #fff; font-size: 13px; text-align: center; border-radius: 4px; box-sizing: border-box; z-index: 10000; padding: 14px 20px; backdrop-filter: blur(4px); border: 1px solid #d5d5d5; }

/* 서브메뉴 레이어 스타일 */
.exh_category { position: fixed; top: 500px; left: 50%; transform: translate(-50%, -50%); width: 800px; height: 700px; background-color: #fff; border-radius: 10px; z-index: 9999; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.15); display: none; }
.exh_category.open { display: block; }
.exh_category .category_hd { display: flex; justify-content: flex-start; align-items: center; gap: 20px; padding: 15px 20px; border-bottom: 1px solid #eee; }
.exh_category .category_hd .title { font-size: 18px; font-weight: bold; }
.exh_category .category_hd .close_category { border: none; background: none; font-size: 24px; cursor: pointer; color: #666; }
.exh_category .category_hd .category_login { display: flex; gap: 8px; margin-right: auto; margin-left: 15px; }
.exh_category .category_hd .category_login a { padding: 6px; font-size: 13px; border-radius: 4px; text-decoration: none; text-align: center; display: inline-block; }
.exh_category .category_content { display: flex; height: calc(100% - 56px); /* 헤더 높이를 뺀 높이 */ overflow: hidden; }
.exh_category .category_content .category_list { width: 25%; min-width: 110px; background-color: #f9f9f9; border-right: 1px solid #eee; overflow-y: auto; }
.exh_category .category_content .category_list .category_tab { font-size:15px; }
.exh_category .category_content .category_list .category_tab li { padding: 10px 9px; margin-left: 3px; cursor: pointer; border-bottom: 1px solid #eee; font-weight: 500; transition: background-color 0.3s; }
.exh_category .category_content .category_list .category_tab li.active { background-color: #fff; color: #0D7239; font-weight: bold; border-left: 3px solid #0D7239; }
.exh_category .category_content .category_list .category_tab li:hover:not(.active) { background-color: #f0f0f0; }

.exh_category .category_details { position: relative; flex: 1; padding: 15px 0; overflow-y: auto; -webkit-overflow-scrolling: touch; touch-action: auto; overscroll-behavior: contain; }
.exh_category .category_details .category_item { display: block; padding: 0 25px; }
/* .exh_category .category_details .category_item.active { display: block; } */
.exh_category .category_details .category_item .category_title { font-size: 16px; font-weight: bold; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid #eee; color: #0D7239; }
.exh_category .category_details .category_item .category_title { padding-top: 100px; }
.exh_category .category_details .category_item:last-child .item_list { height: 550px; }

/* .exh_category .category_details .category_item .item_list ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; } */
.exh_category .category_details .category_item .item_list ul { display: block; }
.exh_category .category_details .category_item .item_list li { margin-bottom: 0; }
.exh_category .category_details .category_item .item_list a { display: block; font-size: 15px; color: #666; padding: 6px 0 6px 5px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.exh_category .category_details .category_item .item_list a:hover { color: #0D7239; }

/* 오버레이 레이어 스타일 */
body.scroll-lock { touch-action: none; overscroll-behavior: none; }
.category_overlay { position: fixed; inset: 0; width: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 200; opacity: 0; transition: opacity 0.3s ease; pointer-events: none; overscroll-behavior: contain; }
.category_overlay.open { opacity: 1; pointer-events: auto; }

/* fixed search */
.fullscreen_search.hidden { display: none; }
.fullscreen_search { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 9999; }
.fullscreen_search .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); }
.fullscreen_search .search_panel { position: relative; width: 100%; height: 640px; padding: 60px 0 100px; background: #fff; top: 0; z-index: 1; box-sizing: border-box; }
.fullscreen_search .search_panel .inner { position: relative; max-width: 1440px; margin: auto; }
.fullscreen_search .search_panel .inner_find { max-width: 700px; margin: auto; }
.fullscreen_search .search_panel input { width: 100%; border-bottom: 2px solid #212121; font-size: 18px; }
.close_panel { position: absolute; right: 0; top: -40px; background: none; border: none; font-size: 1.5rem; cursor: pointer; }
.close_panel svg { width: 30px; height: 30px; }

.fullscreen_search .search_panel .search_history { display: flex; width: 100%; height: 300px; gap: 90px; }
.fullscreen_search .search_panel .search_history .title { display: flex; justify-content: space-between; height: 30px; align-items: center; margin-bottom: 5px; }
.fullscreen_search .search_panel .search_history .title .txt { font-size: 17px; font-weight: 500; }
.fullscreen_search .search_panel .search_history .keyword_wrap { display: flex; flex-flow: wrap; gap: 6px; }
.fullscreen_search .search_panel .search_history .keyword_wrap .keyword { display: inline-flex; flex-wrap: nowrap; padding: 3px 3px 2px 7px; align-items: center; font-size: 13px; border: 1px solid #e1e1e1; overflow: hidden; }
.fullscreen_search .search_panel .search_history .keyword_wrap .keyword a { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-break: break-all; }
.fullscreen_search .search_panel .search_history .keyword_wrap .keyword .del { flex: 0 0 20px; height: 20px; background: url('//img.netpx.co.kr//front/netpx_v3/skin/images/common/icon_close_w22_black.png') 7px center no-repeat; background-size: 7px; border: none; line-height: 1; } 
.fullscreen_search .search_history .history { width: 350px; }
.fullscreen_search .search_history .history .del { font-size: 13px; font-weight: 500; color: #666; }
.fullscreen_search .search_history .popular_word { width: 260px; }
.fullscreen_search .search_history .popular_word a {  display: flex; justify-content: space-between; width: 100%; height: 26px; align-items: center; padding-left: 2px; font-size: 12px; }
.fullscreen_search .search_history .popular_word a .rank { flex: 0 0 22px; font-weight: 700; }
.fullscreen_search .search_history .popular_word a .text { flex: 1; font-size: 14px; color: #666; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; word-break: break-all; }
.fullscreen_search .search_history .popular_word a:hover .text { color: #000; }
.fullscreen_search .search_history .popular_word a .state { flex: 0 0 30px; font-size: 12px; font-weight: 500; color: #33703f; }
.fullscreen_search .search_history .popular_word a .state.up{color:#ff4800;}
.fullscreen_search .search_history .popular_word a .state.up em{display: inline-block; width: 10px; height: 10px; margin-right: 4px; background:url('//img.netpx.co.kr/front/netpx_v3/skin/images/common/arrow_rankup.png') no-repeat 0 4px;}
.fullscreen_search .search_history .popular_word a .state.down{color:#5b5b5b;}
.fullscreen_search .search_history .popular_word a .state.down em{display: inline-block; width: 10px; height: 10px; margin-right: 4px; background:url('//img.netpx.co.kr/front/netpx_v3/skin/images/common/arrow_rankdown.png') no-repeat 0 4px;}