/* ============================================================
   eb4_shop_022 커스텀 스타일 — 심플 쇼핑몰 리디자인 (v3)
   ------------------------------------------------------------
   디자인 방향: 흰 바탕 + 카드/그림자/회색박스 제거 + 깔끔한 상품그리드
   이 파일 하나만으로 전체 스타일이 바뀌며, 원본 기능은 그대로입니다.
   ============================================================ */

/* ---------- 0. 컬러 토큰 ---------- */
:root {
	--primary-color: #ff2f69;			/* 메인 포인트 (핑크) */
	--primary-color-dark: #d91f54;
	--primary-color-light: #ff7ba0;
	--dm-dark: #222;
	--dm-red: #c92b2b;
	--dm-sale: #f43d3d;
	--dm-bar: #555;
	--dm-btn: #333;
	--border-color: #ddd;				/* 테두리 연하게 */
}

/* ============================================================
   1. 전체 레이아웃 — 회색 배경/라운드 박스 제거
   ============================================================ */
body {background-color: #fff;}
.section-inner {border-radius: 0 !important;}
.section-bgc-gray {background-color: transparent !important;}
.section-m-tb {margin: 2rem 0;}
.section-p-tb {padding: 2rem 0;}
@media (max-width:991px) {
	.section-m-tb {margin: 1.5rem 0;}
	.section-p-tb {padding: 1.5rem 0;}
}

/* ============================================================
   2. 헤더 — 화이트 + 얇은 하단선
   ============================================================ */
.header {background-color: #fff;border-bottom: 1px solid #eee;}
#header-fixed.header.header-shadow {box-shadow: none;border-bottom: 1px solid #eee;}
.top-bar .top-bar-list li a,
.top-bar .top-bar-list li button {background-color: transparent;border-radius: 8px !important;}
.top-bar .top-bar-list li a:hover {background-color: #f5f5f5;}
.top-bar .top-bar-list li.login-btn a {font-weight: 700;color: var(--dm-dark);}
.top-bar .top-bar-list li.btn-cart a span {background-color: var(--primary-color);}
@media (max-width:991px) {
	.top-bar .top-bar-list li.login-btn,
	.top-bar .top-bar-list li.top-bar-btn-adm,
	.top-bar .top-bar-list li.btn-cart,
	.top-bar .top-bar-list li.btn-search {display: none;}
	.header {padding: 0 12px;}
	.header-logo {padding: 13px 0;}
	.header-logo a img {height: 26px;}
	.top-bar .top-bar-list {padding: 13px 0;}
	.top-bar .top-bar-list li {margin-left: 3px;}
	.top-bar .top-bar-list li a,
	.top-bar .top-bar-list li button {height: 34px;padding: 0 7px;}
	.top-bar .top-bar-list li img {width: 22px;}
}

/* ============================================================
   3. 섹션 타이틀 — 심플한 중앙 타이틀
   ============================================================ */
.main-heading h2 {margin-bottom: 20px;font-weight: 700;color: var(--dm-dark);}
.main-heading h2 small {margin-top: 6px;font-size: 12px;font-weight: 400;color: #999;}
@media (max-width:991px) {
	.main-heading h2 {margin-bottom: 16px;font-size: 17px;}
}

/* ============================================================
   4. 상품 카드 (메인 main.10 + 목록 list.10 공통)
   - 카드 배경/패딩/그림자 제거, 이미지+텍스트만 남김
   ============================================================ */
.product-main-10 .item-main-10,
.product-list-10 .item-list {padding: 0 !important;background-color: #fff !important;border-radius: 0 !important;box-shadow: none !important;}
.product-main-10 .product-img-in,
.product-list-10 .product-img-in {border-radius: 6px;}
.product-main-10 .product-img-in img,
.product-list-10 .product-img-in img {aspect-ratio: 1 / 1;object-fit: cover;}
.product-main-10 .item-main-10 a.nw-wn,
.product-list-10 .item-list a.nw-wn {display: none;}

/* 상품명: 깔끔하게 1~2줄 */
.product-main-10 .product-description .product-description-in,
.product-list-10 .product-description .product-description-in {padding: 10px 2px 0;background-color: #fff !important;}
.product-main-10 .product-description .product-name,
.product-list-10 .product-description .product-name {margin-bottom: 4px;}
.product-main-10 .product-description .product-name a,
.product-list-10 .product-description .product-name a {display: -webkit-box;overflow: hidden;font-size: 13px;font-weight: 400;line-height: 1.45;color: var(--dm-dark);-webkit-line-clamp: 2;-webkit-box-orient: vertical;text-overflow: ellipsis;}

/* 상품 기본설명(서브문구) 숨김 — 심플하게 */
.product-main-10 .product-description .product-info,
.product-list-10 .product-description .product-info {display: none;}
.product-main-10 .product-description .product-info:before,
.product-list-10 .product-description .product-info:before {display: none;}

/* 가격: 회색 취소선 + 빨간 할인율 + 굵은 판매가 */
.product-main-10 .product-description .product-price,
.product-list-10 .product-description .product-price {line-height: 1.5;}
.product-main-10 .product-description .line-through,
.product-list-10 .product-description .line-through {font-size: 12px;font-weight: 400;color: #b3b3b3;}
.product-main-10 .product-description .title-price,
.product-list-10 .product-description .title-price {display: flex;flex-wrap: wrap;align-items: baseline;font-size: 15px;font-weight: 700;color: var(--dm-dark);}
.product-main-10 .product-description .title-price .title-price-discount,
.product-list-10 .product-description .title-price .title-price-discount {margin-left: 0;margin-right: 5px;font-size: 15px;font-weight: 700;color: var(--dm-sale);}

/* SNS 공유/별점/리뷰보기 행 숨김 — 목록을 심플하게 */
.product-main-10 .product-description .row.m-t-15,
.product-list-10 .product-description .row.m-t-15 {display: none;}

/* 상품 유형 배지 (BEST/HIT 등) 작게 */
.product-main-10 .rgba-banner-area,
.product-list-10 .rgba-banner-area {top: 6px;right: 6px;}
.product-main-10 .rgba-banner,
.product-list-10 .rgba-banner {width: 24px;height: 24px;line-height: 24px;font-size: 9px;}

@media (max-width:991px) {
	.product-main-10,
	.product-list-10 {margin: 0 -5px;}
	.product-main-10 > [class*="col-"],
	.product-list-10 > [class*="col-"] {padding: 0 5px;margin-bottom: 14px;}
	.product-main-10 .product-description .product-description-in,
	.product-list-10 .product-description .product-description-in {padding: 8px 2px 0;}
	.product-main-10 .product-description .product-name a,
	.product-list-10 .product-description .product-name a {font-size: 12px;white-space: nowrap;-webkit-line-clamp: 1;}
	.product-main-10 .product-description .line-through,
	.product-list-10 .product-description .line-through {font-size: 11px;}
	.product-main-10 .product-description .title-price,
	.product-list-10 .product-description .title-price,
	.product-main-10 .product-description .title-price .title-price-discount,
	.product-list-10 .product-description .title-price .title-price-discount {font-size: 14px;}
}

/* ============================================================
   5. 버튼 — 심플한 아웃라인 스타일
   ============================================================ */
.btn-more a {padding: 0 28px;line-height: 36px;color: var(--dm-dark);background-color: #fff;border: 1px solid #ddd;border-radius: 20px;}
.btn-more a:before {display: none;}
.btn-more a:hover {padding: 0 28px;color: var(--primary-color);border-color: var(--primary-color);}

/* ============================================================
   6. 사용후기 슬라이더 — 장식 최소화
   ============================================================ */
.review-slider-inner .item-image a {border-radius: 6px;}
.review-slider-inner .item-content {padding: 12px 5px 0;}
.review-slider-inner .item-content-in {padding-left: 0;border-left: 0 none;}
.review-slider-inner .item-content .item-num {display: none;}

/* ============================================================
   7. 푸터 — 플랫 & 컴팩트
   ============================================================ */
.footer {padding: 0;}
.footer-inner {padding: 28px 0 22px;background-color: #fff;border-radius: 0;border-top: 1px solid #eee;}
.footer-top .footer-top-inner {padding-bottom: 18px;margin-bottom: 18px;}
.footer-inner .footer-btm-item h4 {font-size: 13px;}
.footer-inner .footer-btm-item.footer-address address {margin-top: 10px;font-size: 12px;line-height: 1.8;}
@media (max-width:991px) {
	.footer-inner {padding: 24px 0 18px;}
	.footer-copyright {padding: 14px 0 76px !important;font-size: 12px !important;}
}

/* ============================================================
   8. 모바일 측면 슬라이드 메뉴
   ============================================================ */
@media (max-width:991px) {
	.gnb-wrap .gnb {width: 86%;max-width: 360px;background:#fff;}
	.gnb-wrap .gnb .mobile-box {padding: 0;}

	/* 로그인 상태바 */
	.mb-side-status {display: flex;align-items: center;min-height: 50px;padding: 10px 15px;background-color: var(--dm-bar);}
	.mb-side-status i {font-size: 18px;color: #bdbdbd;}
	.mb-side-status p {padding-left: 10px;font-size: 12px;color: #eee;}
	.mb-side-status p strong {color: #fff;font-weight: 700;}

	/* 로그인/회원가입 등 2열 버튼 */
	.mb-side-btns {display: flex;flex-wrap: wrap;width: 100%;margin: 0;padding: 0;list-style: none;background-color: var(--dm-btn);}
	.mb-side-btns li {width: 50%;margin: 0;}
	.mb-side-btns li a {display: block;line-height: 44px;font-size: 13px;font-weight: 700;color: #fff;text-align: center;transition: .2s;}
	.mb-side-btns li a:hover {color: #fff;opacity: .85;}
	.mb-side-btns li:nth-child(odd) a {border-right: 1px solid #666;}
	.mb-side-btns li.mb-btn-red a {background-color: var(--dm-red);}
	.mb-side-btns li.mb-btn-point a {background-color: var(--primary-color);}

	/* 메뉴 리스트 */
	.gnb-wrap .gnb .gnb-nav {padding: 0 15px;}
	.gnb-wrap .gnb .gnb-nav > li {border-bottom: 1px solid #f0f0f0;}
	.gnb-wrap .gnb .gnb-nav > li > a {position: relative;padding: 13px 5px;font-size: 13px;font-weight: 500;color: var(--dm-dark);}
	.gnb-wrap .gnb .gnb-nav > li > a:not(.cate-dropdown-open):after {content: "\f054";display: block;position: absolute;top: 50%;right: 8px;transform: translateY(-50%);font-family: 'Font Awesome\ 5 Free';font-weight: 900;font-size: 11px;color: #bbb;}
	.gnb-wrap .gnb .gnb-nav > li.active > a {color: var(--primary-color);}
	.gnb-wrap .gnb .category-nav {margin-top: 15px;padding: 0 15px 20px;}

	/* 검색창 (폴더 메뉴 안) */
	.mb-side-search {padding: 15px;background-color: #fff;border-bottom: 1px solid #f0f0f0;}
	.mb-side-search .input-button {position: relative;}
	.mb-side-search input[type="text"] {width: 100%;height: 42px;padding: 0 44px 0 12px;font-size: 13px;color: var(--dm-dark);background-color: #f6f6f6;border: 1px solid #eee;border-radius: 21px;outline: none;}
	.mb-side-search input[type="text"]:focus {background-color: #fff;border-color: var(--primary-color);}
	.mb-side-search .button {position: absolute;top: 0;right: 0;width: 42px;height: 42px;}
	.mb-side-search .button input[type="submit"] {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;cursor: pointer;}
	.mb-side-search .button img {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 16px;pointer-events: none;}
}

/* ============================================================
   9. 모바일 하단 빠른메뉴 (홈/카테고리/검색/장바구니/마이)
   ============================================================ */
.mobile-quick-nav {display: none;}
@media (max-width:991px) {
	.wrapper-inner {padding-bottom: 62px;}
	.mobile-quick-nav {display: block;position: fixed;left: 0;bottom: 0;z-index: 1020;width: 100%;background-color: #fff;border-top: 1px solid #e8e8e8;box-shadow: 0 -2px 8px rgba(0,0,0,.05);padding-bottom: env(safe-area-inset-bottom);}
	.mobile-quick-nav ul {display: flex;margin: 0;padding: 0;list-style: none;}
	.mobile-quick-nav ul li {flex: 1 1 0;}
	.mobile-quick-nav ul li a,
	.mobile-quick-nav ul li button {display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;height: 56px;margin: 0;padding: 4px 0;border: 0 none;background: none;font-size: 10px;color: var(--dm-dark);transition: .2s;}
	.mobile-quick-nav ul li a:hover,
	.mobile-quick-nav ul li button:hover {color: var(--primary-color);}
	.mobile-quick-nav ul li i {font-size: 18px;margin-bottom: 3px;}
	.mobile-quick-nav ul li span {line-height: 1;}
	.mobile-quick-nav .mqn-cart {position: relative;}
	.mobile-quick-nav .mqn-count {position: absolute;top: 4px;left: 50%;margin-left: 4px;min-width: 16px;height: 16px;line-height: 16px;padding: 0 4px;font-size: 10px;font-style: normal;font-weight: 700;color: #fff;text-align: center;background-color: var(--primary-color);border-radius: 8px;}
	.eb-backtotop {bottom: 76px !important;}
	.counsel-btn {bottom: 140px !important;}
}

/* ============================================================
   10. 검색창/폼 — 테두리 심플하게
   ============================================================ */
.theme-offcanvas .search-contents .input-button input[type="text"] {border: 1px solid #ddd !important;}
.theme-offcanvas .search-contents .input-button input[type="text"]:focus {border-color: var(--primary-color) !important;}

/* ============================================================
   11. 메인 슬라이더 — 모바일 라운드 배너
   ============================================================ */
@media (max-width:991px) {
	.section.section-1 {padding: 0 10px;}
	.main-slider-inner,
	.main-slider-list,
	.main-slider-list .item {border-radius: 10px;overflow: hidden;}
}

/* ============================================================
   12. 회원가입 — 생년월일 선택 (년/월/일)
   ============================================================ */
.register-form .register-box {border: 0 none;}
.register-form .eyoom-form header {background: #fff;border-bottom: 2px solid var(--dm-dark);}
.register-form .birth-selects {display: flex;gap: 6px;}
.register-form .birth-selects .select {flex: 1 1 0;}
.register-form .birth-selects select {width: 100%;height: 40px;padding: 0 8px;font-size: 14px;color: var(--text-color);background-color: #fff;border: 1px solid var(--border-color-light);border-radius: 4px;}
.register-form .birth-selects select:focus {border-color: var(--primary-color);outline: none;}
@media (max-width:991px) {
	.register-form .eyoom-form fieldset {padding: 15px 10px;}
}