/* BASIC css start */
/* ============================================================
	피시위즈 모바일 리뉴얼 — 메인 CSS v2.0 (2026-07)
	KREAM풍 미니멀 : 상품 섹션 가로 스크롤 캐러셀
============================================================ */

/* 롤링배너 */
#event .MS_img-wrap { position:relative; width:100%; overflow:hidden; }
#event .event-imgs { position:relative; }
#event .MS_img-area { float:left; }
#event .MS_img-area:not(:first-child) { display:none; }
#event .MS_img-area img { width:100%; }
#event .pagination { position:relative; height:0; top:-20px; left:0; text-align:center; width:100%; padding:0; margin:0; font-size:0; }
#event .pagination .swiper-pagination-switch { display:inline-block; margin:0 3px; text-indent:-9999px; background:rgba(255,255,255,.7); width:7px; height:7px; vertical-align:top; border-radius:50%; border:0; }
#event .pagination .swiper-active-switch { background:#222; width:18px; border-radius:4px; }

/* 섹션 공통 타이틀 — KREAM풍 플레인 블랙 */
.main .mainTitle {font-size:17px; font-weight:800; color:#222; padding:0 0 4px;}
.main .mainTitle em {font-style:normal; color:#222;}
.main .mainSub {font-size:12px; color:#999; padding-bottom:12px;}

/* HOT NEWS */
.main .mainNotice {height:36px; border-bottom:1px solid #F5F5F5; padding:0 12px;}
.main .mainNotice ul {display:flex; align-items:center; height:36px;}
.main .mainNotice .noticeLabel {flex:0 0 auto; font-size:11px; font-weight:800; color:#fff; background:#222; border-radius:4px; padding:2px 7px; margin-right:8px;}
.main .mainNotice .noticeSubject {flex:1; overflow:hidden;}
.main .mainNotice .noticeSubject a {display:block; font-size:12px; color:#666; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:36px;}
.main .mainNotice .notice_more {flex:0 0 auto;}
.main .mainNotice .notice_more a {font-size:16px; color:#AAA; padding-left:8px;}

/* 카테고리 아이콘 그리드 — KREAM풍 숏컷 */
.main .mainCate {display:flex; flex-wrap:wrap; padding:16px 8px 4px;}
.main .mainCate a {width:20%; display:flex; flex-direction:column; align-items:center; gap:6px; margin-bottom:14px; font-size:11px; font-weight:600; color:#222; text-align:center;}
.main .mainCate .cate-ico {width:54px; height:54px; border-radius:18px; background:#F4F4F4; border:0; display:flex; align-items:center; justify-content:center; font-size:23px;}
.main .mainCate .cate-all .cate-ico {background:#222;}
.main .mainCate .cate-all span:last-child {color:#222; font-weight:800;}

/* ---------- 상품 섹션 : 가로 스크롤 캐러셀 (3개 노출 × 기본 2줄 × 가로 20개 = 40개) ----------
   grid-auto-flow:column 방식 — 줄 수는 고정, 상품이 많아지면 옆으로 늘어남.
   더보기 클릭 시 JS가 줄 수를 1줄씩 늘림(2줄→3줄...) (가로 스크롤 유지). main.html 참조 */
.main .mainSection {padding:18px 0 4px;}
.main .mainSection .mainTitle {padding:0 12px 12px;}
.main .mainSection .list_shopping3x ul {display:grid; grid-template-rows:repeat(2, auto); grid-auto-flow:column; grid-auto-columns:31%; column-gap:8px; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:0 12px; scrollbar-width:none;}
.main .mainSection .list_shopping3x ul::-webkit-scrollbar {display:none;}
.main .mainSection .list_shopping3x ul:after {content:none;}
.main .mainSection .list_shopping3x li {width:auto; float:none; margin:0 0 14px;}
.main .mainSection .list_shopping3x li:nth-child(odd) {clear:none;}
.main .mainSection .list_shopping3x li a {margin:0;}
.main .mainSection .list_shopping3x .listName {font-size:12px;}
.main .mainSection .list_shopping3x .listPrice {font-size:13px;}

/* BASIC css end */