/* ============================================================================
   nexamemory 전용 반응형 보정   2026-08-26 정희찬(PRO4)

   왜 : 이 몰은 카테고리명이 영문 장문(Workstation Memory 등)이라
        rroys 공용 규칙(1300 고정폭 해제 / 767 이하 4칸 격자)만으로는
        · 768~1023 에서 헤더 카테고리 줄이 화면 밖으로 55px 넘치고(문서폭 823 > 768)
        · 767 이하 4칸 격자에서 «Workstation Memo» 처럼 글자가 잘렸다.
        rroys 는 한글 짧은 이름이라 해당이 없어 공용 파일이 아니라 여기서만 손본다.

   쓰는 곳 : /main/rroys_responsive_inc.asp (PC 메인) · /common/inc/shop_rroys_responsive.asp (서브)
   되돌리기 : 두 곳의 link 한 줄씩만 지우면 된다.
   ============================================================================ */

/* --- 768~1023 (태블릿) : 한 줄에 다 들어가도록 좁힌다 --- */
@media all and (max-width:1023px) {
	.rr-header-category { padding:0 16px; }
	#rr-header-category-menu .icon_tit_list { flex-wrap:nowrap; justify-content:flex-start; }
	#rr-header-category-menu .icon_tit_list > li { flex:0 0 auto; }
	#rr-header-category-menu .icon_tit_list > li > a.menutitle { padding:0 9px; font-size:13px; }
}

@media all and (max-width:860px) {
	#rr-header-category-menu .icon_tit_list > li > a.menutitle { padding:0 6px; font-size:12px; }
}

/* --- 767 이하 (폰) : 공용 규칙은 4칸 격자 + 한 줄 고정이라 영문 장문이 잘린다.
       3칸으로 넓히고 두 줄까지 허용한다. --- */
@media all and (max-width:767px) {
	#rr-header-category-menu .icon_tit_list { grid-template-columns:repeat(3, minmax(0, 1fr)); }
	#rr-header-category-menu .icon_tit_list > li > a.menutitle {
		height:auto;
		min-height:44px;
		padding:7px 6px;
		font-size:12px;
		line-height:1.25;
		text-align:center;
		white-space:normal;
		word-break:keep-all;
		overflow-wrap:anywhere;
	}
	#rr-header-category-menu .icon_tit_list > li:nth-child(4n) > a.menutitle { border-right:1px solid #eee; }
	#rr-header-category-menu .icon_tit_list > li:nth-child(3n) > a.menutitle { border-right:0; }
}

/* --- 767 이하 : 서브페이지 하단 카피라이트를 «메인과 똑같이» 보여준다.
       rroys 공용 CSS(shop_rroys_responsive.css)는 폰 서브에서 푸터를 통째로 감춘다.
       그건 rroys 의 결정이고, nexamemory 는 «하단 카피라이트를 서브하단관리에
       반응형으로» 라는 지시라 여기서 되살린다.
       ★이 파일이 공용 CSS 보다 «뒤» 에 링크되므로 같은 특이도에서 이긴다.
       하단 탭바에 가리지 않도록 .wrap_body 아래 여백은 공용 CSS 가 이미 잡아 둔다. --- */
@media all and (max-width:767px) {
	html body #footer,
	html body footer.footer { display:block !important; }
}
