@charset "utf-8";

html {font-size: 17px;}
body {font-size: 1rem;line-height: 1.6;overflow-x: hidden;}
/* select 공통 */
select {border:1px solid #ccc; padding: 8px 36px 8px 12px;background-color: #fff; background-image: url('data:image/svg+xml;charset=UTF-8,<svg fill="%23666" height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>'); background-repeat: no-repeat; background-position: right 3px center; background-size:20px 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; }
select option {padding: 8px;}

#wrap {position: relative;width: 100%;height: 100%;padding-top:205px;} /* 상단고정바 높이만큼 패딩값 적용 */
#wrap-fixed-bar {position: relative;width: 100%;height:100%;padding:0;padding-top:205px;}

/* 위로가기 버튼 */
.topBtn {display:scroll;position:fixed;bottom:15px;right:20px;z-index:200;}
.topBtn:hover {opacity: 0.7;  /* 마우스를 올렸을 때 버튼의 투명도를 살짝 줄여서 효과를 줌 */}
.topBtn > img {width:60px;height:60px;}

/* 헤더 */
header {position: relative;width:100%;border-bottom:1px solid #eee;}
.top-fixed {position: fixed;top: 0;left: 0;width: 100%;z-index: 900;background: #fff;border-bottom: 1px solid #fff;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);}
.top-fixed.scrolled {border-bottom: 1px solid #e5e5e5;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);}
.topmenu-wrap {width:100%;height:42px;border-bottom:1px solid #e5e5e5;}
.topmenu-wrap > .topmenu {width:1300px;margin:0 auto;}
.topmenu-wrap > .topmenu > ul {display:flex;justify-content: flex-end;}
.topmenu-wrap > .topmenu > ul li {padding:0 8px;line-height:42px;font-size:0.76rem;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.topmenu-wrap > .topmenu > ul li:last-child {padding:0 0 0 8px;}
.topmenu-wrap > .topmenu > ul li a {color:#666;}
.m-area {width:1300px;height:100px;margin:0 auto;display:flex;justify-content:space-between;}
.m-area > .logobox {width:20%;}
.m-area > .logobox a {margin-top:34px;width:140px;height:35px;display:block;background: url("../img/logo.jpg") no-repeat left top;background-size:140px 35px;cursor: pointer;color: transparent;text-indent: -9999px;}
.m-area > .searchbox {width:55%;}
.m-area > .rbanbox {width:20%;text-align:right;margin-top:21px;}
.menu {width:1300px;margin:0 auto 20px;}
.menu ul {display:flex;flex-direction: row;}
.menu ul li a {position: relative;display:inline-block;font-size:0.96rem;line-height:1;padding:12px 20px;background-color:#f7f7f7;margin-right:12px;border-radius: 999px;}
.menu ul li a:hover {background-color: #faf2f3;}
.menu ul li img {width:18px;height:18px;margin-right:5px;}
.search-container {border: 2px solid #e60012; border-radius: 999px;/* 완전한 둥근 모서리 */display: flex;align-items: center;padding: 6px 12px 6px 22px;width: 520px;margin:27px auto 0;}
.search-container input[type="text"] {border: none;outline: none;flex: 1;font-size:1rem;color: #000;}
.search-container input::placeholder {color: #8e8f93;font-weight:300;font-size:0.9rem;letter-spacing:-0.5px;}
.search-container button {background: none;border: none;cursor: pointer;padding:2px;}
.search-container button img {width:24px;height:24px;}
.icon-hit {position:absolute;right:-10px;top:-5px;}
.icon-hit > img {width:24px !important;height:24px !important;}
/* 모바일 비노출 */
.mheader-logo {display:none;}
.mheader-search {display:none;}
.mobile-menu-wrapper {display:none;}
.sidenav {display:none;}
.mask {display:none;}
.mtop-fixed {display:none;}
.modal {display:none;}

/* 푸터 */
.mobile-bmenu-wrapper {display:none;}
.bmenu-wrap {width:100%;height:42px;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;}
.bmenu-wrap > .bmenu {width:1300px;margin:0 auto;display:flex;justify-content: space-between;flex-wrap: nowrap;}
.bmenu-wrap > .bmenu > .leftarea {width:60%;}
.bmenu-wrap > .bmenu > .leftarea > ul {display:flex;justify-content:row;}
.bmenu-wrap > .bmenu > .leftarea > ul li {padding:0 8px;line-height:42px;font-size:0.76rem;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.bmenu-wrap > .bmenu > .leftarea > ul li:first-child {padding:0 8px 0 0;}
.bmenu-wrap > .bmenu > .leftarea > ul li a {color:#666;}
.bmenu-wrap > .bmenu > .rightarea {width:30%;}
.bmenu-wrap > .bmenu > .rightarea > ul {display:flex;justify-content: flex-end;}
.bmenu-wrap > .bmenu > .rightarea > ul li {padding:0 8px;line-height:42px;font-size:0.76rem;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.bmenu-wrap > .bmenu > .rightarea > ul li:last-child {padding:0 0 0 8px;}
.bmenu-wrap > .bmenu > .rightarea > ul li a {color:#666;}
.footer-inner {width:1300px;margin:50px auto 0;display:flex;justify-content: space-between;}
.footer-inner > .cominfo {width:65%;padding-bottom:50px;display:flex;justify-content:row;}
.footer-inner > .cominfo > .logobox {width:30%;}
.footer-inner > .cominfo > .logobox a {width:140px;height:35px;display:block;background: url("../img/logo.jpg") no-repeat left top;background-size:140px 35px;cursor: pointer;color: transparent;text-indent: -9999px;}
.footer-inner > .cominfo > .info {width:70%;}
.footer-inner > .cominfo > .info li {font-size:0.9rem;}
.footer-inner > .n-order {width:30%;text-align:right;}
.footer-inner > .n-order > button {background:#208b58;color:#fff;letter-spacing:-0.5px;text-align:center;padding:15px 50px;line-height:1;border-radius: 4px;cursor: pointer;}

/* 롤링배너 */
:root {--slide-gap: 10px;}
.slider-wrapper {width: 100%;margin-top:20px;overflow: hidden;position: relative; /* 터치 스크롤 시 깜빡임 방지 (iOS) */ -webkit-overflow-scrolling: touch;}
.slider-track {display: flex;transition: transform 0.5s ease;}
.slide {width:428px;margin-right: var(--slide-gap);flex-shrink: 0;}
.slide img {width: 100%;height: auto; /* 이미지 비율 유지 */border-radius: 6px;display: block;}
.controls {text-align:center;margin: 20px 0;display:flex;justify-content: center;}
.controls button {background:#fff;border:1px solid #e1e1e1;text-align:center;padding:6px 8px;line-height:1;margin: 0 2px;border-radius: 4px;cursor: pointer;}
.arrow img {width:16px;height:16px;}
.pagination {text-align:center;min-width:60px;padding:0 10px;color: #555;line-height:31px;font-size:0.9rem;}
#toggleAutoButton {background-image: url('../img/play.png');background-size:16px 16px;background-repeat:no-repeat;background-position:center;
text-indent: -9999px;background-color: transparent;border:1px solid #e1e1e1;padding:6px 15px;line-height:1;border-radius: 4px;cursor: pointer;}
#toggleAutoButton.playing {background-image: url('../img/stop.png');}

/* 배너3 */
.ban-area {width:1300px;margin:30px auto 0;display:flex;justify-content: space-between;flex-wrap: nowrap;}
.ban-area > .banbox {width:32.8%;}
.ban-area > .banbox img {width:100%;object-fit:cover;border-radius:6px;}

/* 상품목록 */
.goods {width:1300px;margin:100px auto 0;}
.goods > .tit {font-size:1.85rem;font-weight:600;letter-spacing:-1px;padding-bottom:40px;text-align:center;}
.goods > .tit > span {font-family:'Tahoma', sans-serif;}
.goods-inner {width:100%;display:flex;justify-content: space-between;flex-wrap: wrap;}
.goods-inner::after {content: ""; /* 가상 요소 생성 */width:23.7%; /* 아이템과 동일한 너비 지정 */}
.goods-inner > .gbox {position: relative;width:23.7%;padding:0 0 80px 0;}
.goods-inner > .gbox img {width:100%;object-fit:cover;}
.goods-inner > .gbox ul {padding-top:20px;}
.goods-inner > .gbox ul li.gtit {line-height:1.3;}
.goods-inner > .gbox ul li.gtit > strong {font-weight:600;}
.goods-inner > .gbox ul li.info {padding-top:5px;font-size:0.76rem;line-height:1.4;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.goods-inner > .gbox ul li.costprice {padding-top:15px;font-size:0.9rem;color:#969696;text-decoration:line-through;line-height:1;}
.goods-inner > .gbox ul li.price {padding-top:5px;font-size:1rem;font-weight:600;line-height:1;}
.goods-inner-100 {width:100%;display:flex;justify-content: space-between;flex-wrap: wrap;}
.goods-inner-100::after {content: ""; /* 가상 요소 생성 */width:23.7%; /* 아이템과 동일한 너비 지정 */}
.goods-inner-100 > .gbox {position: relative;width:23.7%;padding:0 0 80px 0;}
.goods-inner-100 > .gbox img {width:100%;object-fit:cover;border-radius:30px;}
.goods-inner-100 > .gbox ul {padding-top:20px;}
.goods-inner-100 > .gbox ul li.gtit {line-height:1.3;}
.goods-inner-100 > .gbox ul li.gtit > strong {font-weight:600;}
.goods-inner-100 > .gbox ul li.info {padding-top:5px;font-size:0.76rem;line-height:1.4;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.goods-inner-100 > .gbox ul li.costprice {padding-top:15px;font-size:0.9rem;color:#969696;text-decoration:line-through;line-height:1;}
.goods-inner-100 > .gbox ul li.price {padding-top:5px;font-size:1rem;font-weight:600;line-height:1;}
.btn-best-more {margin:20px auto 0;width:40%;display:block;background:#fff;border:1px solid #e1e1e1;font-weight:400;letter-spacing:-0.5px;text-align:center;padding:25px 0;line-height:1;border-radius: 4px;cursor: pointer;transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, transform 0.2s ease-out;}
.btn-best-more:hover {background:#f5f5f5;border:1px solid #f5f5f5;}
.btn-best-more img {width:12px;height:12px;margin:1px 0 0 10px;}
.btn-more {margin:20px auto 0;width:40%;display:block;background:#fff;border:1px solid #e1e1e1;font-weight:400;letter-spacing:-0.5px;text-align:center;padding:25px 0;line-height:1;border-radius: 4px;cursor: pointer;transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, transform 0.2s ease-out;}
.btn-more:hover {background:#f5f5f5;border:1px solid #f5f5f5;}
.btn-more img {width:12px;height:12px;margin:1px 0 0 10px;}

/* 메인하단 */
.main-footer {width:100%;margin-top:120px;background-color:#f5f5f5;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;}
.main-footer-inner {width:1300px;margin:0 auto;padding:70px 0;display:flex;justify-content: space-between;flex-wrap: wrap;}
.main-footer-inner > .notice {position: relative;width:55%;}
.main-footer-inner > .notice > .tit {font-size:1.45rem;font-weight:600;letter-spacing:-1px;padding-bottom:12px;}
.main-footer-inner > .notice > .n-more {position:absolute;right:0;top:6px;background:url('../img/underline.png') repeat-x left bottom;padding:0;}
.main-footer-inner > .notice > .row {width:100%;display:flex;justify-content: space-between;flex-wrap: nowrap;}
.main-footer-inner > .notice > .row > .txt {width:75%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size:0.96rem;line-height:1;padding:7px 0;}
.main-footer-inner > .notice > .row > .txt a {color:#222;}
.main-footer-inner > .notice > .row > .date {width:20%;font-size:0.9rem;line-height:1;padding:7px 0;text-align:right;}
.main-footer-inner > .cs {width:35%;}
.main-footer-inner > .cs > .tit {font-size:1.45rem;font-weight:600;letter-spacing:-1px;padding-bottom:12px;}
.main-footer-inner > .cs > .call {color:#e20403;font-size:1.8rem;font-weight:600;line-height:1;}
.main-footer-inner > .cs > ul {margin-top:10px;}
.main-footer-inner > .cs > ul li {font-size:0.9rem;line-height:1.4;}
.main-footer-bank {width:1300px;margin:0 auto;padding:40px 0;display:flex;flex-direction: row;}
.main-footer-bank > .tit {font-size:1.25rem;font-weight:600;letter-spacing:-1px;padding-right:40px;line-height:28px;}
.main-footer-bank > .bnum {padding-right:20px;line-height:28px;font-size:1.1rem;font-weight:500;}
.main-footer-bank > .bnum img {width:94px;height:26px;margin-right:10px;}
.main-footer-bank > .bname {line-height:28px;font-size:1.1rem;font-weight:500;}

/* 페이징 */
.pagination-container {display: flex;justify-content: center;margin-top: 30px;margin-bottom: 30px;}
.pagination {display: flex; /* 페이지 번호들을 한 줄로 정렬 */gap: 5px; /* 각 페이지 번호 사이의 간격 */}
.pagination li {}
.pagination .page-link {display: block;padding:10px 10px;border: 1px solid #ddd;border-radius: 4px;background-color: #fff;transition: all 0.2s ease-in-out;font-size: 0.8rem;letter-spacing:-1px;min-width:40px;text-align: center;line-height:1;}
.pagination .page-link.active {background-color: #555; /* 활성 페이지 배경색 */color: #fff;border-color: #555; cursor: default; /* 활성 페이지는 클릭 안되게 */}
.pagination .page-link.prev,
.pagination .page-link.next {padding: 10px 10px;font-weight: 500;}
.pagination .page-link:not(.active):hover {background-color:#f0f0f0;border-color: #bbb;color:#222;}

/* 서브상단 */
.sub-top-ban {width:1300px;margin:30px auto 0;display:flex;justify-content: space-between;flex-wrap: nowrap;overflow:hidden;}
.sub-top-ban > .banbox {width:32.8%;}
.sub-top-ban > .banbox img {width:100%;object-fit:cover;border-radius:6px;}
.sub-top {width: 100%;text-align: center;margin-bottom:80px;}
.sub-top-title {font-size:2rem;margin-bottom:10px;text-align: center;font-weight:600;}
.sub-menu-nav {width: 100%;display: flex;justify-content: center;}
.sub-menu-list {display: flex; /* 항목들을 가로로 정렬 */gap:25px; /* 각 서브메뉴 항목 사이의 간격 */}
.sub-menu-list li {display: block;padding:10px 5px;font-size: 1rem;transition: color 0.3s ease-in-out;}
.sub-menu-list li:hover {color: #e30303;}
.sub-menu-list li.current-page {color: #e30303;font-weight:500;border-bottom: 2px solid #e30303; }
.sub-menu-list li:not(.current-page):hover {color: #e30303;}/* 호버 효과 (현재 페이지가 아닐 때만 적용되도록 수정) */

/* 서브하단배너 */
.sub-bottom-ban {width:100%;margin:80px 0 100px 0;width:1300px;height:200px;display:block;background: url("../img/ban_sb.jpg") no-repeat left top;background-size:1300px 200px;cursor: pointer;color: transparent;text-indent: -9999px;}

/* 서브페이지공통 */
.sub-page {width:1300px;margin:30px auto 100px;}

/* ------------상세페이지----------- */
.mb-menubar {display:none;}/* 모바일전용 하단메뉴바 비노출 */
.option-slide {display:none;}/* 모바일전용 옵션슬라이드창 비노출 */
/* 현재위치 */
.location {width: 100%;display: flex;flex-direction: row;padding-bottom:10px;}
.location ul {display: flex;gap:3px;}
.location ul li { display: block; font-size: 0.8rem; color: #666;position: relative;padding-right:20px;font-family: "Nanum Gothic", sans-serif;}
.location ul li::after { content: '>'; position: absolute; right: 5px; top: 50%; transform: translateY(-50%); color: #929292;} 
.location ul li:last-child::after {content: none;}
/* 상품정보 */
.product-detail-top {width:100%;display:flex;justify-content: space-between;}
.product-detail-top > .pimg {width:50%;}
.product-detail-top > .pimg img {width:100%;object-fit:cover;}
.product-detail-top > .pinfo {position: relative;width:44%;}
.product-detail-top > .pinfo > h1 {width:86%;font-size:1.7rem;font-weight:300;line-height:1.3;}
.product-detail-top > .pinfo > h1 > strong {font-weight:600;}
.product-detail-top > .pinfo > h2 {padding-top:15px;font-size:0.9rem;font-weight:300;color:#666;letter-spacing:-0.5px;line-height:1.4;font-family: "Nanum Gothic", sans-serif;}
.product-detail-top > .pinfo > .share-container {position:absolute;right:0;top:-4px;display: inline-block;}
.product-detail-top > .pinfo > .share-container > .btn-share {display:block;width:40px;height:40px;background:#fff url('../img/share.png') no-repeat center center;background-size:24px 24px;color:#222;cursor: pointer;text-indent: -9999px;}
.product-detail-top > .pinfo > .pricebox {padding:10px 0;margin-top:20px;border-top:1px solid #eee;border-bottom:1px solid #eee;}
.product-detail-top > .pinfo > .pricebox > .costprice {color:#e30303;font-weight:500;letter-spacing:-1px;padding-left:2px;}
.product-detail-top > .pinfo > .pricebox > .costprice span {margin-right:8px;font-size:1.2rem;color:#a1a1a1;font-weight:300 !important;letter-spacing:0;text-decoration:line-through;text-decoration-color:#e30303;text-decoration-thickness:1px;}
.product-detail-top > .pinfo > .pricebox > .saleprice {font-size:1.1rem;font-weight:500;line-height:1.3;letter-spacing:-0.5px;}
.product-detail-top > .pinfo > .pricebox > .saleprice img {width:36px;height:36px;margin:5px 4px 0 0;}
.product-detail-top > .pinfo > .pricebox > .saleprice > .promo-price {padding-left:5px;color:#e30303;font-size:2rem;font-weight:600;}
.product-detail-top > .pinfo > .pricebox > .saleprice > .won {font-weight:400 !important;}
/* 버튼-할인쿠폰 */
.btn-coupon {margin:20px auto 0;width:56%;display:block;background:#131c40;color:#fff;font-size:1rem;font-weight:300;letter-spacing:-0.5px;text-align:center;padding:18px 0;line-height:1;border-radius: 4px;cursor: pointer;}
.btn-coupon img {width:16px;height:16px;margin:0 0 0 10px;}
.btn-coupon strong {color:#ffeb00;font-weight:400;}
/* 옵션/갯수/금액/버튼 한개로 묶음 */
.buy-wrap {display:block;}
/* 구매하기 슬라이드창 */
#initial-bar {display:none;}
#purchase-panel {display:none;}
.panel-bar {display: none;}
/* 옵션선택 */
.product-option {padding:20px 0 0 0;}
.product-option > select {width:100%;font-size:0.9rem;font-weight:300;padding:10px 36px 10px 12px;}
.product-option > select > option {font-weight:300;padding:10px;}
/* 갯수선택 */
.product-count {padding:15px 0 0 0;}
.product-count > p {}
.product-count-inner {width:100%;padding-top:5px;display:flex;justify-content: space-between;}
.counter-wrapper {display:inline-flex;border: 1px solid #ccc;overflow:hidden;}
.counter-button { width:32px; height:32px; border: none;background-color: #fff; font-size:0.9rem;cursor: pointer; transition: background-color 0.2s; }
.counter-button:hover { background-color: #f0f0f0; }
.counter-value { width: 50px; height: 32px; text-align: center; line-height: 32px; font-size:0.9rem;border-left: 1px solid #ccc; border-right: 1px solid #ccc; background-color: #fff; }
.counter-wrapper * { user-select: none; }
.counter-price {width:40%;display:flex;justify-content: flex-end;}
.counter-price > .price-item {padding-right:20px;font-size:1.1rem;}
.counter-price > .price-item > strong {font-weight:600;}
.counter-price > .delete {}
.close-button {display: flex; justify-content: center; align-items: center; width:28px; height:28px; cursor: pointer; border: none; background-color: transparent; padding: 0; }
.close-button svg { width: 100%; height: 100%; stroke: #888; stroke-width:1; fill: none; stroke-linecap: round; stroke-linejoin: round; }
/* 총 상품 금액 */
.total-price {width:100%;padding:15px 0 0 0;margin-top:20px;border-top:1px solid #eee;display:flex;justify-content: space-between;}
.total-price > .tit {width:30%;height:40px;line-height:48px;font-weight:500;}
.total-price > .price-item {width:60%;height:40px;display:flex;justify-content: flex-end;}
.total-price > .price-item > .total {color:#666;padding-right:50px;line-height:48px;}
.total-price > .price-item > .price-all {line-height:48px;}
.total-price > .price-item > .price-all > strong {color:#e30303;font-size:1.8rem;font-weight:600;line-height:40px;padding-right:3px;}
/* 버튼 */
.btn-buy {margin:18px auto 0;width:100%;display:block;background:#e30303;color:#fff;font-size:1.1rem;font-weight:400;letter-spacing:-0.5px;text-align:center;padding:20px 0;line-height:1;border-radius: 4px;cursor: pointer;}
.btn-b-wrap {width:100%;padding:11px 0 0 0;display: flex;justify-content: space-between;}
.btn-b-wrap > button {width:49%;display:block;background:#f4f4f4;border:1px solid #dedede;color:#222;font-size:1rem;font-weight:400;letter-spacing:-0.5px;text-align:center;padding:19px 0;line-height:1;border-radius: 4px;cursor: pointer;}
/* 공유하기 창 */
.sns-icons-window {display: none;position: absolute;top: 100%; /* 버튼 바로 아래 */left: -70px;background-color:#fff;border: 1px solid #dadada;border-radius:4px;padding: 12px;box-shadow: 0 4px 8px rgba(0,0,0,0.1);margin-top: 8px;z-index: 1000; /* 아래 display: flex는 .show 클래스에서 제어합니다. */gap: 12px;}
.sns-icons-window.show {display: flex; /* <<-- 중요: 이 클래스가 JS에 의해 추가되면 보여짐 */}
.sns-icon {width: 30px;height: 30px;border-radius: 50%;background-color: #f0f0f0;display: flex;justify-content: center;align-items: center;cursor: pointer;overflow: hidden;}
.sns-icon img {width: 100%;height: auto;}
.sns-icon:hover {opacity: 0.8;}
/* 구매후기 */
.reviews-container {width:100%;margin:60px auto;}
.reviews-header {display: flex;justify-content: space-between;}
.reviews-header > .tit {font-size:1.5rem;font-weight:600;}
.reviews-header > .tit > span {font-size:0.96rem;font-weight:300;color:#666;}
.reviews-header > .tit > span > strong {font-weight:400;padding:0 1px;color:#222;}
.reviews-header a {text-decoration: none;color: #555;font-size:0.86rem;font-family: "Nanum Gothic", sans-serif;}
.reviews-header a:hover {text-decoration: underline;}
.reviews-grid {width:100%;display: flex; justify-content: space-between;flex-wrap: wrap;}
.review-card {width: 48%;display: flex; justify-content: space-between;margin-top:20px;}
.review-image {width: 20%;}
.review-image img {width: 100%; object-fit:cover;}
.review-content {width: 76%; display: flex;flex-direction: column;}
.review-content > .tit {width: 90%; margin-bottom: 8px; font-size: 1rem; font-weight:600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.review-content > p {width: 90%; margin-bottom: 10px; font-size: 0.86rem; color: #555; font-family: "Nanum Gothic", sans-serif;}
.review-author {font-size: 0.76rem; color: #888; margin-top: auto; font-family: "Nanum Gothic", sans-serif;}
.review-author > span {color:#ccc;padding:0 8px;}
/* 탭메뉴 */
html { scroll-behavior: smooth; }
.tab-menu {padding-top:10px;width:100%;border-bottom: 1px solid #dedede; box-shadow: 0 2px 3px rgba(0,0,0,0.1); }
.tab-menu ul {display: flex;}
.tab-menu li { flex: 1; text-align: center;padding:15px 0;font-size:1rem; border-right: 1px solid #dedede; background: #f4f4f4; transition: background 0.3s ease, color 0.3s ease; }
.tab-menu li a { display: block; text-decoration: none; color: #333; }
.tab-menu li span {font-size:0.9rem;font-weight:300;}
.tab-menu li span > strong {font-weight:400;padding:0 1px;}
.tab-menu li:hover a { color: #131c40; }
.tab-menu li:hover { background: #e6e6e6; }
.tab-menu li.active { background: #131c40; font-weight:500; }
.tab-menu li.active a { color: #fff; }
.tab-menu li:last-child { border-right: none; }
.tab-section {padding:50px 0; border-bottom:1px solid #eee;scroll-margin-top: 70px; }
.tab-section > h3 {padding:50px 0;font-size:1.8rem;font-weight:600;text-align:center;}
.tab-section > .tit {font-size:1.26rem;font-weight:600;letter-spacing:-0.5px;}
.tab-section > .sub-tit {padding:40px 0 5px 0;font-size:1rem;font-weight:600;}
.tab-section > .sub-tit > .btn-receive {display: inline-block;margin-left:10px;padding:7px 17px 6px 17px;font-size:0.76rem;line-height:1;color:#fff;background-color: #0099ff;border-radius: 3px;}
.tab-section > .dtxtbox {font-size:0.9rem;font-family: "Nanum Gothic", sans-serif;color:#666;line-height:1.5;}
.tab-section > .imgbox {text-align:center;padding:30px 0;}
.tab-section > .imgbox img {}
.tab-section > .imgbox-de {text-align:center;padding:30px 0;}
.tab-section > .imgbox-de img {width:768px;height:512px;}
/* 탭영역 구매후기 */
.tab-reviews-grid {width:100%;}
.tab-review-card {width:100%;display: flex; justify-content: space-between;margin-top:20px;}
.tab-review-image {width:15%;}
.tab-review-image img {width: 100%; object-fit: cover;}
.tab-review-content {width:83%;display: flex; flex-direction: column;padding:15px 0;}
.tab-review-content > .tit {width: 90%; margin-bottom: 8px; font-size: 1rem; font-weight: 600;}
.tab-review-content > p {width: 90%; margin-bottom: 10px; font-size: 0.86rem; color: #555; font-family: "Nanum Gothic", sans-serif;}

/* ------------ 주문하기 ----------- */
.subpage-tit {text-align:center;font-size:1.8rem;font-weight:400;}
.section-title1 { font-size:1.2rem; font-weight:600;margin-top:30px; margin-bottom: 10px; border-bottom: 2px solid black; padding-bottom:10px; }
.section-title2 { font-size:1.2rem; font-weight:600;margin-top:80px;border-bottom: 2px solid black; padding-bottom:10px; }
.description-text1 { font-size: 0.9rem;margin-bottom:40px;letter-spacing:-0.5px;}
.description-text1 > span {color:#e30303;}
.description-text2 {display:block;width:100%;font-size: 0.8rem;color:#888;font-family: "Nanum Gothic", sans-serif;padding-top:10px;margin-left:200px;}
.description-text3 {display:block;width:100%;font-size: 0.8rem;color:#888;font-family: "Nanum Gothic", sans-serif;padding:15px 0 10px 0;margin-left:200px;}
.description-text3 > span {color:#e30303;}
.checkbox-container {display: flex; align-items: center; margin-bottom: 15px; }
.checkbox-container input[type="checkbox"] { margin-right: 5px; margin-left:200px;width:20px;height:20px;}
.checkbox-container label {font-size:0.9rem;}
.input-group {width:100%;display: flex; justify-content:row;padding:15px 0;border-bottom:1px solid #e0e0e0;}
.input-group label {width:200px;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.input-group input[type="text"] { width: 300px;height:36px;padding: 8px;border:1px solid #e0e0e0;font-size:1rem;font-weight:400;line-height:36px;}
.input-group input::placeholder {font-weight:300;font-size:0.9rem;letter-spacing:-0.3px;color:#222;}
.email-group {width:100%;display: flex;justify-content:row;flex-wrap: wrap;padding:15px 0;border-bottom:1px solid #e0e0e0;}
.email-group label {width:200px;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.email-group input[type="text"] {width: 300px;height:36px;padding: 8px;border:1px solid #e0e0e0;font-size:1rem;font-weight:400;line-height:36px;}
.email-group span { margin: 0 5px; }
.address-search-group {width:100%;display: flex; justify-content:row;padding:15px 0 0 0;}
.address-search-group label {width:200px;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.address-search-group input[type="text"] { width:120px;height:36px;padding: 8px;border:1px solid #e0e0e0;border-right:none;font-size:1rem;font-weight:400;line-height:36px;}
.address-search-group button {height:36px;line-height:36px;font-size:0.86rem;padding:0 10px;letter-spacing:-0.5px;text-align:center;background-color:#f0f0f0; border: 1px solid #ccc;cursor: pointer;}
.address-search-group2 {width:100%;display: flex;flex-direction: column;padding:0 0 15px 0;border-bottom:1px solid #e0e0e0;}
.address-search-group2 input[type="text"] { width: 626px;margin-left:200px;margin-top:6px;height:36px;padding: 8px;border:1px solid #e0e0e0;font-size:1rem;font-weight:400;line-height:36px;}
.address-search-group2 input::placeholder {font-weight:300;font-size:0.9rem;letter-spacing:-0.3px;color:#888;}
.code-group {width:100%;display: flex; justify-content:row;flex-wrap: wrap;padding:15px 0;border-bottom:1px solid #e0e0e0;}
.code-group label {width:200px;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.code-group input[type="text"] { width:250px;height:36px;padding: 8px;border:1px solid #e0e0e0;border-right:none;font-size:1rem;font-weight:400;line-height:36px;}
.code-group button {height:36px;line-height:36px;font-size:0.86rem;padding:0 15px;letter-spacing:-0.5px;text-align:center;background-color: #007bff;color:#fff;border: 1px solid #007bff;cursor: pointer;}
.save-next {display:block;width:100%;height:36px;display: flex;align-items: center;margin-left:200px;}
.save-next input[type="checkbox"] { margin-right:5px; width:20px;height:20px;}
.save-next label {font-size:0.9rem;font-weight:300;line-height:36px;}
/* 주문상품목록 */
.t_base {clear:both;width:100%;}
.t_base:after {content: "."; display: block; font-size: 0; height: 0px; line-height: 0; clear: both;}
.t_base tbody th {padding: 8px 0;font-size:0.86rem;background:#f9f9f9;border-bottom: 1px solid #ddd;}
.t_base tbody td {padding: 15px 0;text-align: center;border-bottom: 1px solid #ddd;}
.t_base tbody td a {color:#222;}
.t_base tbody td.ptit {display: flex; justify-content:row;padding:15px 5px;}
.t_base tbody td.ptit > img {width:70px;height:70px;margin-right:12px;}
.t_base tbody td.ptit > .pinfo {width:100%;display: flex;flex-direction: column;text-align:left;}
.t_base tbody td.ptit > .pinfo > .name {font-size:0.96rem;}
.t_base tbody td.ptit > .pinfo > .name strong {font-weight:500;}
.t_base tbody td.ptit > .pinfo > .option {padding-top:5px;font-size:0.8rem;color:#888;font-family: "Nanum Gothic", sans-serif;}
.t_base tbody td.order-price > strong {font-size:1.1rem;font-weight:600;}
.t_base tfoot td {padding: 10px 5px;text-align: center;}
.t_base tfoot td.d-txt {text-align:left;font-size:0.96rem;}
.t_base tfoot td.d-txt > strong {font-weight:600;margin-right:15px;}
.t_base tfoot td.d-price > strong {font-size:1.1rem;font-weight:600;}
/* 배너 */
.ban-txt-wrap {width:500px;height:70px;margin:20px auto;background:#ffd304;color:#000;text-align:center;font-size:1.2rem;line-height:70px;font-weight:600;}
/* 할인 */
.discount-wrap1 {display: flex;justify-content: space-between;padding:15px;background-color: #f9f9f9; border:1px solid #eee;border-top:none;}
.discount-wrap1 > .discount {width:50%;}
.discount-wrap1 > .discount > .dis-item {width:100%;display: flex;justify-content:row;margin-bottom:5px;}
.discount-wrap1 > .discount > .dis-item label {width:25%;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.discount-wrap1 > .discount > .dis-item input[type="text"] { width:230px;height:36px;padding: 8px;border:1px solid #e0e0e0;font-size:1rem;font-weight:400;line-height:36px;}
.discount-wrap1 > .discount > .dis-item > select {width:230px;height:36px;padding: 8px 32px 8px 12px;border:1px solid #e0e0e0;font-size:0.9rem;font-weight:400;border-radius:0;}
.discount-wrap1 > .discount > .dis-item > select > option {font-weight:300;padding:10px;}
.discount-wrap1 > .discount > .dis-item button {height:36px;line-height:36px;margin-left:5px;font-size:0.86rem;padding:0 15px;letter-spacing:-0.5px;text-align:center;background-color: #0caeaa;color:#fff;border: 1px solid #0caeaa;cursor: pointer;}
.discount-wrap1 > .total-dis {margin-top:auto;font-weight:400;}
.discount-wrap1 > .total-dis > strong {font-size:1.1rem;font-weight:600;color:#e30303;margin-left:20px;}
.discount-wrap2 {text-align:right;padding:10px 15px;font-weight:400;font-size:1.1rem;}
.discount-wrap2 > strong {font-size:1.15rem;font-weight:600;color:#e30303;margin-left:20px;}
/* 결제 */
.payment-wrap { display: flex; gap: 30px;}
.radio-option { display: flex; align-items: center;cursor: pointer;padding:20px 15px;font-size:1rem;}
.radio-option input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 24px; height: 24px; border: 2px solid #ccc; border-radius: 50%; margin-right: 10px; outline: none; position: relative; cursor: pointer; }
.radio-option input[type="radio"]:checked { border-color: #0075ff; }
.radio-option input[type="radio"]:checked::before { content: ''; display: block; width: 14px; height: 14px; background-color: #0075ff; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.account-info { display: flex;justify-content:row;flex-wrap: wrap;background-color: #f9f9f9; border: 1px solid #eee;padding:15px;}
.account-info p {padding-right:80px;font-size:0.9rem;}
.account-info p > strong {font-weight:500;padding-right:10px;}
.input-name {width:100%;display: flex; align-items: center; gap: 15px; margin-top: 15px; }
.input-name label {font-size:0.9rem;font-weight:500;}
.input-name input[type="text"] {width:230px;height:36px;padding: 8px;border:1px solid #e0e0e0;font-size:1rem;font-weight:400;line-height:36px;}
.btn-pay {display: block;margin:40px auto;width:500px;height:70px;background:#e30303;color:#fff;text-align:center;font-size:1.2rem;line-height:70px;font-weight:600;}

/* ------------ 회원가입 ----------- */
.join-wrap {width:45%;margin:80px auto;display:block;}
.join-title {font-size:1.8rem;font-weight:400;text-align:center;margin-top:30px;margin-bottom: 30px; border-bottom: 2px solid black; padding-bottom:10px; }
.join-wrap > .des-txt { font-size: 0.96rem;margin-bottom:40px;text-align:center;color:#e30303}
.join-wrap > .join-item1 {width:80%;margin:0 auto;display:flex;justify-content:row;padding:4px 0;}
.join-wrap > .join-item1 label {width:35%;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.join-wrap > .join-item1 input[type="text"] { width:45%;height:36px;padding: 8px;border:1px solid #ccc;border-right:none;font-size:1rem;font-weight:400;line-height:36px;}
.join-wrap > .join-item1 button {width:20%;height:36px;line-height:36px;font-size:0.86rem;padding:0 15px;letter-spacing:-0.5px;text-align:center;background-color: #3f4251;color:#fff;border: 1px solid #3f4251;cursor: pointer;}
.join-wrap > .join-item2 {width:80%;margin:0 auto;display:flex;justify-content:row;padding:4px 0;}
.join-wrap > .join-item2 label {width:35%;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.join-wrap > .join-item2 input[type="text"] { width:65%;height:36px;padding: 8px;border:1px solid #ccc;font-size:1rem;font-weight:400;line-height:36px;}
.join-wrap > .join-email {width:80%;margin:0 auto;display:flex;justify-content:row;padding:4px 0;}
.join-wrap > .join-email label {width:35%;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.join-wrap > .join-email input[type="text"] {width:30%;height:36px;padding: 8px;border:1px solid #ccc;font-size:1rem;font-weight:400;line-height:36px;}
.join-wrap > .join-email span {width:5%;text-align:center;display: flex;align-items:center;justify-content: center;font-size:0.9rem;}
.join-wrap > .term-wrap {margin-top:30px;padding:20px 0;border-top:1px solid #e0e0e0;}
.agreement-item {position: relative;width:56%;margin:0 auto;display: flex;align-items: center;margin-bottom: 15px;}
.btn-term-more {position:absolute;right:0;top:0;height:26px;background-color: #f7f7f7;border:1px solid #ccc;padding:0 10px;cursor: pointer;font-size:0.8rem;line-height:26px;}
.agreement-item input[type="checkbox"] {display: none;}
.agreement-item input[type="checkbox"] + label::before {content: '';display: inline-block;width: 24px;height: 24px;border: 1px solid #ccc;margin-right: 10px;vertical-align: middle;background-color: #fff;background-repeat: no-repeat;background-position: center;background-size: 80%; /* 아이콘 크기 조절 */}
.agreement-item input[type="checkbox"]:checked + label::before {background-color: #fff;border-color: #e30303;
/* SVG 아이콘을 base64로 인코딩하여 직접 삽입 */
/* 또는 외부에 저장된 SVG 파일 경로를 사용할 수 있습니다. */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e30303'%3E%3Cpath d='M9.5 17.5L4.5 12.5L3.08 13.92L9.5 20.34L20.92 8.92L19.5 7.5L9.5 17.5Z'/%3E%3C/svg%3E");
/* 참고: %231a5198는 #1a5198 색상의 URL 인코딩 값*/}
.agreement-item label {font-size:0.96rem;color: #333;cursor: pointer;display: flex;align-items: center;}
.agreement-text-label { margin-right: 15px;}
.btn-join {display: block;margin:10px auto;width:80%;height:70px;background:#e30303;color:#fff;text-align:center;font-size:1.2rem;line-height:70px;font-weight:600;}

/* 로그인폼 공통 */
.form-wrap {width:34%;margin:80px auto;display:block;}
.form-title {font-size:1.8rem;font-weight:400;text-align:center;margin-top:30px;margin-bottom: 30px; border-bottom: 2px solid black; padding-bottom:10px; }
.form-wrap > .form-row {width:70%;margin:0 auto;display:flex;justify-content:row;padding:4px 0;}
.form-wrap > .form-row label {width:35%;font-weight:500;font-size:0.9rem;display: flex;align-items:center;}
.form-wrap > .form-row input[type="text"] { width:65%;height:36px;padding: 8px;border:1px solid #ccc;font-size:1rem;font-weight:400;line-height:36px;}
.form-wrap > .bottom-wrap {margin-top:30px;padding:20px 0;border-top:1px solid #e0e0e0;}
.btn-login {display: block;margin:20px auto 0;width:70%;height:60px;background:#e30303;color:#fff;text-align:center;font-size:1.1rem;line-height:60px;font-weight:600;}
.btn-nm-order {display: block;margin:10px auto 0;width:70%;height:46px;background-color: #eee;text-align:center;font-size:0.9rem;line-height:45px;font-weight:400;}
.btn-join-3s {display: block;margin:10px auto;width:70%;height:60px;background:#3f4251;color:#fff;text-align:center;font-size:1.1rem;line-height:60px;font-weight:600;}
.login-menu-wrapper { width: 100%; display: block;padding: 10px 0; }
.login-menu-wrapper > ul {width:100%;display: flex; justify-content: center; flex-wrap: wrap; align-items: center;}
.login-menu-wrapper > ul li { line-height:22px; font-size: 0.86rem; letter-spacing: -0.5px;text-align: center; padding: 0 15px; position: relative; cursor:pointer;}
.login-menu-wrapper > ul li a { color: #222; white-space: nowrap;}
.login-menu-wrapper > ul li:not(:last-child)::after { content: '|'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); color: #ccc; font-size: 0.6rem; }



/***************************************************************************/
/*					                      모바일 (최대 479px)			                             /
/***************************************************************************/
@media (max-width: 479px) {

html {font-size: 15px;}
body {font-size: 1rem;line-height: 1.6;/* 모바일메뉴창적용 - padding-right와 관련된 스타일 제거 *//* transition: padding-right var(--sidenav-animation-duration) ease-out; */}
/* 사이드 메뉴가 열렸을 때 body 스타일 */
body.sidenav-open {overflow: hidden;/* 메뉴 열렸을 때 body 스크롤 방지 */position: fixed;/* body의 가로 스크롤 방지 및 너비 고정 */width: 100%;/* body의 너비를 고정 */height: 100%;/* body의 높이를 고정 (iOS 스크롤 문제 방지) */}
a {outline: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
#wrap {position: relative;width: 100%;height: 100%;padding-top:105px;}
#wrap-fixed-bar {position: relative;width: 100%;height: auto;padding-bottom:56px;padding-top:105px;}

/* 위로가기 버튼 */
.topBtn {display: scroll;position: fixed;bottom: 60px;right: 0;z-index: 200;}
.topBtn:hover {opacity: 0.7;}
.topBtn >img {width: 30px;height: 30px;}

/* 헤더 */
header {position: relative;width:100%;border-bottom:1px solid #e0e0e0;}
.mtop-fixed {display: block;position: fixed;top: 0;left: 0;width: 100%;z-index: 900;background: #fff;transition: box-shadow 0.3s ease-in-out; /* 기존 그림자 transition 유지 */}
.mtop-fixed::after {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 1px;background-color: #d6d6d6;opacity: 0;transform-origin: left;}
.mtop-fixed.scrolled::after {opacity: 1;transform: scaleX(1);box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);}

/* 데스크탑 비노출 */
.top-fixed {display:none;}

/* 상단메뉴영역 */
.m-topmenu {width:100%;display:block;height:42px;border-bottom:1px solid #eee;background:#f9f9f9;padding:0 10px;}
.m-topmenu > ul {display:flex;justify-content: flex-end;}
.m-topmenu > ul li {position: relative;padding:0 8px;line-height:42px;font-size:0.9rem;letter-spacing:-0.5px;color:#222;font-family:"Inter", sans-serif;}
.m-topmenu > ul li:last-child {padding:0 0 0 7px;}
.m-topmenu > ul li a {color:#222;white-space: nowrap;}
.m-topmenu > ul li.allmenu {text-indent: -9999px;cursor: pointer;display: flex;align-items: center;-webkit-tap-highlight-color: transparent;/* 모바일 클릭 시 잔상(탭 하이라이트) 제거 */
-webkit-touch-callout: none;/* iOS에서 길게 눌렀을 때 팝업 메뉴 방지 (선택 사항) */-webkit-user-select: none;/* 텍스트 선택 방지 (선택 사항) */}
.m-topmenu > ul li.allmenu img {width:22px;height: 22px;}
.m-topmenu > ul li:not(:last-child)::after { content: '|'; position: absolute; right: 0; top: 55%; transform: translateY(-55%); color: #ccc; font-size: 0.7rem; }
.m-topmenu > ul li.no-pipe::after {content: none; /* 이 특정 li 뒤의 | 를 숨김 */}
/* 로고/검색바 */
.m-topwrap {width:100%;display:block;padding:12px 10px 12px 15px;display: flex;justify-content: space-between;}
.m-topwrap > .m-logobox {width:30%;}
.m-topwrap > .m-logobox a {width:100px;height: 25px;display: block;margin-top:7px;background: url("../img/logo.jpg") no-repeat left top;background-size: 100px 25px;cursor: pointer;color: transparent;text-indent: -9999px;}
.m-topwrap > .m-searchbox {width:64%;height:38px;display:flex;justify-content: flex-end;}
.m-search-container {width:100%;border: none;background: #fff;border: 2px solid #e60012;border-radius: 999px;display: flex;justify-content: space-between;padding:2px 2px 2px 20px;margin: 0 !important;}
.m-search-container > input[type="text"] {width:80%;border: none;outline: none;font-size: 1.2rem;color: #000;background: #fff;}
.m-search-container > input::placeholder {color: #888;font-weight: 300;font-size: 1rem;letter-spacing: -0.5px;}
.m-search-container > button {width:20%;background: none;border: none;cursor: pointer;padding: 3px 0 0 2px;}
.m-search-container > button img {width: 20px;height: 20px;}
/* 메뉴영역 */
.mobile-menu-wrapper { width: 100%;display:block;padding:0 13px 10px 13px;}
.mobile-menu-wrapper ul {width:100%;display: flex;justify-content: space-between;flex-wrap: wrap;}
.mobile-menu-wrapper li {width:24%;display: block;font-size:0.9rem;transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out;border: 1px solid #ddd; border-radius: 20px; background-color: #f9f9f9; white-space: nowrap;margin:2px 0;letter-spacing: -0.8px;font-weight:400;line-height:1;padding:10px 0;text-align:center;z-index:10;}
.mobile-menu-wrapper li a {position: relative;display: block; /* a 태그가 기본적으로 inline이라서 width/height가 안 먹을 수 있으니 block으로 변경 */}
.mobile-menu-wrapper li a .icon-hit {position: absolute;top:-12px;right: -5px;z-index: 11;}
.mobile-menu-wrapper li a .icon-hit img {width:20px !important;height:20px !important;}
.mobile-menu-wrapper li:hover { color: #fff; background-color: #e30303; border-color: #e30303; }
.mobile-menu-wrapper li.current-page { color: #fff; font-weight: 500; border-bottom: none; background-color: #e30303; border-color: #e30303; }
.mobile-menu-wrapper li:not(.current-page):hover { color: #fff; background-color: #e30303; border-color: #e30303; }

/* 햄버거메뉴 */
:root { --sidenav-actual-width: 300px; --sidenav-animation-duration: 0.3s; }
.sidenav { height: 100%; width: var(--sidenav-actual-width); position: fixed; z-index: 1000; top: 0;right: 0; transform: translateX(var(--sidenav-actual-width)); transition: transform var(--sidenav-animation-duration) ease-out; overflow-y: auto; overflow-x: hidden; display: none; background-color: #fff; }
.sidenav.open { transform: translateX(0); display: block; }
.sidenav.closing { transition: none; }
.mask { display: none; position: fixed; z-index: 999; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); transition: opacity var(--sidenav-animation-duration) ease-out; opacity: 0; }
.mask.active { display: block; opacity: 1; }
.mask.closing { transition: none; }
.closebtn { position: absolute; top: -5px; right: 15px; font-size: 2.5rem; color: #333; text-decoration: none; outline: none; -webkit-tap-highlight-color: transparent; background-color: transparent; border: none; }
.closebtn:hover { color: #333; }
.closebtn:active, .closebtn:focus { color: #333; background-color: transparent; outline: none; }
.sidenav-content { width: 100%; padding: 60px 0 0 0; opacity: 1; box-sizing: border-box; }

/* 햄버거 메뉴창 컨텐츠 */
.top-buttons1 { width: 100%; display: flex; justify-content: center; }
.top-buttons1 button { width: 38%; padding: 9px 0; border: none; cursor: pointer; font-size: 0.94rem; font-weight: 500; }
.top-buttons1 .login-btn { background-color: #e60012; color: white; border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
.top-buttons1 .signup-btn { background-color: #fff; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border: 1px solid #ccc; border-left: none; }
.top-buttons2 { width: 100%; display: flex; justify-content: center; }
.top-buttons2 button { width: 30%; padding: 9px 0; border: none; cursor: pointer; font-size: 0.94rem; font-weight: 500; }
.top-buttons2 .my-btn { background-color: #e60012; color: white; border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
.top-buttons2 .cart-btn { background-color: #fff; border: 1px solid #ccc; border-left: none; }
.top-buttons2 .order-btn { background-color: #fff; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border: 1px solid #ccc; border-left: none; }
.main-content { width: 100%; display: flex; justify-content: center; }
.column { width: 50%; margin: 15px 0; border-bottom: 1px solid #dad9d9; }
.column-left { background-color: #fff; border-right: 1px solid #dad9d9; }
.column-left >.tit { background-color: #f5f5f5; padding: 12px 0; font-size: 0.9rem; text-align: center; font-weight: 600; border-bottom: 2px solid #333; }
.column-right { background-color: #fff; }
.column-right >.tit { background-color: #f5f5f5; padding: 12px 0; font-size: 0.9rem; text-align: center; border-bottom: 2px solid #f5f5f5; }
.column-title { background-color: #f5f5f5; padding: 12px 0; font-size: 0.9rem; text-align: center; font-weight: 600; border-bottom: 2px solid #333; }
.column-title2 { background-color: #f5f5f5; padding: 12px 0; font-size: 0.9rem; text-align: center; border-bottom: 2px solid #f5f5f5; }
.menu-wrap { width: 100%; }
.menu-wrap ul { width: 100%; padding: 10px 0 0 0; }
.menu-wrap ul li { width: 100%; padding: 15px 0 15px 15px; font-size: 0.94rem; display: inline-block; line-height: 1; }
.menu-wrap ul li img { width: 18px; height: 18px; margin: -2px 5px 0 0; }
.menu-wrap ul li.zzim { font-weight: 600; background: #faf2f3; }
.bottom-menu { width: 100%; }
.bottom-menu ul { width: 100%; display: flex; justify-content: space-between; background-color: #f5f5f5; }
.bottom-menu ul li { width: 50%; padding: 12px 0; font-size: 0.94rem; display: inline-block; text-align: center; border-right: 1px solid #dad9d9; }
.bottom-menu ul li:last-child { border-right: none; }
.bottom-menu ul li img { width: 18px; height: 18px; margin: 3px 4px 0 0; }
.btn-logout-wrap { display: flex; justify-content: flex-end; padding-right: 25px; margin-top: 15px; }
.btn-logout-wrap button { padding: 8px 25px; border: 1px solid #dad9d9; text-align: center; cursor: pointer; font-size: 0.94rem; font-weight: 500; border-radius: 5px; }

/* 푸터 */
.bmenu-wrap { display: none; }
.mobile-bmenu-wrapper { width: 100%; display: block; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; padding: 10px 0; }
.mobile-bmenu-wrapper > ul { width:70%; margin: 0 auto; display: flex; justify-content: center; flex-wrap: wrap; align-items: center; list-style: none; padding: 0; }
.mobile-bmenu-wrapper > ul li { line-height:22px; font-size: 0.86rem; letter-spacing: -0.5px; color: #222;font-family:"Inter", sans-serif;text-align: center; padding: 0 10px; position: relative; cursor:pointer;}
.mobile-bmenu-wrapper > ul li a { color: #222; white-space: nowrap;}
.mobile-bmenu-wrapper > ul li:not(:last-child)::after { content: '|'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); color: #ccc; font-size: 0.8rem; }
.footer-inner { width: 100%; margin: 20px auto 0; display: flex; flex-direction: column-reverse; }
.footer-inner >.cominfo { width: 100%; padding: 20px 15px 25px 15px; display: flex; justify-content: row; }
.footer-inner >.cominfo>.logobox { display: none; }
.footer-inner >.cominfo>.info { width: 100%; }
.footer-inner >.cominfo>.info li { font-size: 0.8rem; line-height: 1.4; }
.footer-inner >.n-order { width: 100%; text-align: center; padding: 0 15px; }
.footer-inner >.n-order>button { width: 100%; background: #208b58; color: #fff; letter-spacing: -0.5px; text-align: center; padding: 15px 50px; line-height: 1; border-radius: 4px; cursor: pointer; }

/* 롤링배너 */
.slide { width: 80vw;height:300px;overflow: hidden;}
.slide img {width: 100%;height: 100%;object-fit: cover;}
.slider-wrapper { width: 100%; margin-top: 13px; overflow: hidden; position: relative; -webkit-overflow-scrolling: touch; }
.controls { text-align: center; margin: 10px 0 10px 0; display: flex; justify-content: center; }
.pagination { text-align: center; min-width: 50px; padding: 0 8px; color: #222; font-weight: 400; line-height: 31px; font-size: 0.9rem; }
#toggleAutoButton { display: none; }

/* 배너3 */
.ban-area { display: none; }

/* 상품목록 */
.goods { width: 100%; margin: 30px auto 0; padding: 0 15px; }
.goods>.tit { font-size: 1.3rem; font-weight: 600; letter-spacing: -0.5px; padding-bottom: 10px; }
.goods>.tit > span { font-family: 'Tahoma', sans-serif; }
.goods-inner { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
.goods-inner::after { content: ""; width: 31%; }
.goods-inner >.gbox { position: relative; width: 31%; padding: 0 0 40px 0; }
.goods-inner >.gbox img { width: 100%; object-fit: cover; }
.goods-inner >.gbox ul { padding-top: 20px; }
.goods-inner >.gbox ul li.gtit { line-height: 1.2; }
.goods-inner >.gbox ul li.gtit>strong { font-weight: 600; }
.goods-inner >.gbox ul li.info { padding-top: 5px; font-size: 0.7rem; line-height: 1.25; letter-spacing: -0.5px; color: #666; font-family: "Nanum Gothic", sans-serif; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; }
.goods-inner >.gbox ul li.costprice { padding-top: 10px; font-size: 0.9rem; color: #969696; text-decoration: line-through; line-height: 1; }
.goods-inner >.gbox ul li.price { padding-top: 2px; font-size: 1rem; font-weight: 600; line-height: 1; }
.goods-inner-100 { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; }
.goods-inner-100::after { content: ""; width: 31%; }
.goods-inner-100 >.gbox { position: relative; width: 31%; padding: 0 0 40px 0; }
.goods-inner-100 >.gbox img { width: 100%; object-fit: cover;border-radius:15px;}
.goods-inner-100 >.gbox ul { padding-top: 20px; }
.goods-inner-100 >.gbox ul li.gtit { line-height: 1.2; }
.goods-inner-100 >.gbox ul li.gtit>strong { font-weight: 600; }
.goods-inner-100 >.gbox ul li.info { padding-top: 5px; font-size: 0.7rem; line-height: 1.25; letter-spacing: -0.5px; color: #666; font-family: "Nanum Gothic", sans-serif; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; }
.goods-inner-100 >.gbox ul li.costprice { padding-top: 10px; font-size: 0.9rem; color: #969696; text-decoration: line-through; line-height: 1; }
.goods-inner-100 >.gbox ul li.price { padding-top: 2px; font-size: 1rem; font-weight: 600; line-height: 1; }
.btn-more { margin: 0 auto 20px !important; width:60%; display: block; background: #fff; font-size: 1rem; border: 1px solid #d6d6d6; font-weight: 400; letter-spacing: -0.5px; text-align: center; padding: 15px 0; line-height: 1; border-radius: 6px; cursor: pointer; transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, transform 0.2s ease-out; }
.btn-more:hover { background: #f5f5f5; border: 1px solid #f5f5f5; }
.btn-more img { width: 12px; height: 12px; margin: 2px 0 0 10px; }

/* 메인하단 */
.main-footer { width: 100%; margin-top:40px; background-color: #f5f5f5; border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; }
.main-footer-inner { width: 100%; margin: 0 auto; padding:30px 15px; display: flex; justify-content: space-between; flex-wrap: wrap; }
.main-footer-inner >.notice { position: relative; width: 100%; }
.main-footer-inner >.notice>.tit { font-size: 1.16rem; font-weight: 600; letter-spacing: -0.5px; padding-bottom: 10px; }
.main-footer-inner >.notice>.n-more { position: absolute; right: 0; top: 0; background: url('../img/underline.png') repeat-x left bottom; padding: 0;font-size:0.96rem;}
.main-footer-inner >.notice>.row { width: 100%; display: flex; justify-content: space-between; flex-wrap: nowrap; }
.main-footer-inner >.notice>.row>.txt { width: 75%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.96rem; line-height: 1; padding: 4px 0; }
.main-footer-inner >.notice>.row>.txt a { color: #222; }
.main-footer-inner >.notice>.row>.date { width: 20%; font-size: 0.9rem; line-height: 1; padding: 4px 0; text-align: right; }
.main-footer-inner >.cs { width: 100%; margin-top: 30px; }
.main-footer-inner >.cs>.tit { font-size: 1.16rem; font-weight: 600; letter-spacing: -0.5px; padding-bottom: 10px; }
.main-footer-inner >.cs>.call { color: #e20403; font-size: 1.45rem; font-weight: 600; line-height: 1; }
.main-footer-inner >.cs>ul { margin-top: 5px; }
.main-footer-inner >.cs>ul li { font-size: 0.9rem; line-height: 1.4; letter-spacing: -0.4px; }
.main-footer-bank { width: 100%; margin: 0 auto; padding: 20px 15px; display: flex; flex-direction: row; flex-wrap: wrap; }
.main-footer-bank >.tit { width: 100%; font-size: 1rem; font-weight: 500; letter-spacing: -1px; padding-right: 40px; line-height: 28px; padding-bottom: 5px; }
.main-footer-bank >.bnum { padding-right: 8px; line-height: 19px; font-size: 0.9rem; font-weight: 300; }
.main-footer-bank >.bnum img { width: 60px; height: 16px; margin-right: 6px; }
.main-footer-bank >.bname { line-height: 19px; font-size: 0.9rem; font-weight: 300; }

/* 서브상단 */
.sub-top-ban {width: 100%; margin: 15px auto 0; padding: 0 15px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.sub-top-ban > .banbox {width: 49%; cursor: pointer;margin-bottom:10px;}
.sub-top-ban > .banbox:nth-child(3) {display: none;} /* 마지막 3번째 배너는 비노출 */
.sub-top-ban > .banbox img {width: 100%; object-fit: cover;border-radius:0;}
.sub-top { width: 100%; text-align: center; margin-bottom: 40px; }
.sub-top-title { font-size: 1.4rem; margin-bottom:10px; text-align: center; font-weight: 600;}
.sub-menu-nav { width: 100%; display: flex; justify-content: center; }
.sub-menu-list { display: flex; flex-wrap: wrap; justify-content: center; gap:6px 8px; padding: 0 10px; max-width: 100%; }
.sub-menu-list li { display: block; padding:6px 10px; font-size: 0.86rem; transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out; border: 1px solid #ddd; border-radius: 20px; background-color: #f9f9f9; white-space: nowrap; }
.sub-menu-list li a { text-decoration: none; color: inherit; }
.sub-menu-list li:hover { color: #fff; background-color: #e30303; border-color: #e30303; }
.sub-menu-list li.current-page { color: #fff; font-weight: 500; border-bottom: none; background-color: #e30303; border-color: #e30303; }
.sub-menu-list li:not(.current-page):hover { color: #fff; background-color: #e30303; border-color: #e30303; }

/* 페이징 */
.pagination-container {display: flex;justify-content: center;margin-top:10px;margin-bottom:0;padding:15px 0 0 0;}
.pagination .page-link {display: block;padding:10px 10px;border: 1px solid #ddd;border-radius: 4px;background-color: #fff;transition: all 0.2s ease-in-out; /* 호버 효과를 위한 전환 */
font-size: 0.76rem;letter-spacing:-0.5px;min-width:34px;text-align: center;line-height:1;}

/* 서브하단배너 */
.sub-bottom-ban {width:100%;height:235px;margin:30px 0;display: block;background: url("../img/ban_sb_m.jpg") no-repeat center center;background-size: cover;cursor: pointer;color: transparent;text-indent: -9999px;}

/* 서브페이지공통 */
.sub-page {position: relative;width:100%;margin:15px auto 30px;padding: 0 15px;}

/* ------------상세페이지----------- */
.location ul li { display: block; font-size: 0.9rem; color: #666;position: relative;padding-right:15px;font-family: "Inter", sans-serif;}
 /* 하단 고정 바 */
#initial-bar { position: fixed; bottom: 0; left: 0;display:block;display:flex;justify-content: space-between;background:#fff;width:100%;z-index:500;padding-bottom: constant(safe-area-inset-bottom); /* iOS 11 이하 */
    padding-bottom: env(safe-area-inset-bottom); /* iOS 11 이상 및 최신 브라우저 */}
#initial-bar > .btn-zzim {width:22%;height:54px;line-height:54px;display:block;background:#fff;border:1px solid #ccc;border-left:none;font-size:1.1rem;font-weight:500;letter-spacing:-0.5px;text-align:center;cursor: pointer;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
#initial-bar > .btn-zzim img {width:20px;height:20px;margin:17px 2px 0 0;}
#initial-bar > .btn-mbuy {width:78%;height:54px;line-height:54px;display:block;background-color:#e30303;border:1px solid #e30303;color: #fff;font-size:1.1rem;font-weight:500;letter-spacing:-0.5px;text-align:center;cursor: pointer;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
/* 구매하기 슬라이드 패널 */
#purchase-panel { position: fixed; bottom: 0; left: 0; width: 100%;background-color: #fff; border-radius: 16px 16px 0 0; box-shadow: 0 -4px 12px rgba(0,0,0,0.15); z-index: 501; transform: translateY(104%); transition: transform 0.2s linear; display: flex; flex-direction: column;opacity: 1; }
#purchase-panel.is-open { transform: translateY(0); }        
/* 패널 헤더 (닫기 버튼) */
.panel-header {padding:14px 0 0 0;text-align: center;}
.panel-header .close-btn { background: none;border:none;text-align:center;font-size:1.2rem; color: #888; cursor: pointer; outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.panel-header .close-btn img {width:20px;height:20px;}
/* 패널 콘텐츠 영역 (사용자 정의 내용) */
.panel-content {width:100%;padding:0 15px 20px 15px;}
.panel-content .placeholder {width:100%;}
 /* 패널 내부 하단 버튼 바 */
.panel-bar {display:flex;justify-content: space-between;width:100%;background:#fff;}
.panel-bar > .btn-cart {width:50%;height:54px;line-height:54px;display:block;background:#fff;border:1px solid #ccc;border-left:none;font-size:1.1rem;font-weight:500;letter-spacing:-0.5px;text-align:center;cursor: pointer;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.panel-bar > .btn-mbuy2 {width:50%;height:54px;line-height:54px;display:block;background-color:#e30303;border:1px solid #e30303;color: #fff;font-size:1.1rem;font-weight:500;letter-spacing:-0.5px;text-align:center;cursor: pointer;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);}

/* 상품정보 */
.product-detail-top {width:100%;display:flex;justify-content: space-between;flex-wrap: wrap;}
.product-detail-top > .pimg {width:100%;}
.product-detail-top > .pimg img {width:100%;height:320px;object-fit:cover;}
.product-detail-top > .pinfo {position: relative;width:100%;}
.product-detail-top > .pinfo > h1 {padding-top:20px;width:80%;font-size:1.4rem;font-weight:300;line-height:1.3;}
.product-detail-top > .pinfo > h1 > strong {font-weight:600;}
.product-detail-top > .pinfo > h2 {padding-top:10px;font-size:0.9rem;font-weight:300;color:#666;letter-spacing:-0.5px;line-height:1.4;font-family: "Nanum Gothic", sans-serif;}
.product-detail-top > .pinfo > .share-container {position:absolute;right:0;top:12px;display: inline-block;}
.product-detail-top > .pinfo > .share-container > .btn-share {display:block;width:40px;height:40px;background:#fff url('../img/share.png') no-repeat center center;background-size:24px 24px;color:#222;cursor: pointer;text-indent: -9999px;}
.product-detail-top > .pinfo > .pricebox {padding:10px 0;margin-top:20px;border-top:1px solid #eee;border-bottom:1px solid #eee;}
.product-detail-top > .pinfo > .pricebox > .costprice {color:#e30303;font-weight:500;letter-spacing:-1px;padding-left:2px;}
.product-detail-top > .pinfo > .pricebox > .costprice span {margin-right:8px;font-size:1.2rem;color:#a1a1a1;font-weight:300 !important;letter-spacing:0;text-decoration:line-through;text-decoration-color:#e30303;text-decoration-thickness:1px;}
.product-detail-top > .pinfo > .pricebox > .saleprice {font-size:1.1rem;font-weight:500;line-height:1.3;letter-spacing:-0.5px;}
.product-detail-top > .pinfo > .pricebox > .saleprice img {width:32px;height:32px;margin:2px 4px 0 0;}
.product-detail-top > .pinfo > .pricebox > .saleprice > .promo-price {padding-left:5px;color:#e30303;font-size:1.7rem;font-weight:600;}
.product-detail-top > .pinfo > .pricebox > .saleprice > .won {font-weight:400 !important;}
/* 버튼-할인쿠폰 */
.btn-coupon {margin:20px auto 0;width:65%;display:block;background:#131c40;color:#fff;font-size:1rem;font-weight:300;letter-spacing:-0.5px;text-align:center;padding:18px 0;line-height:1;border-radius: 4px;cursor: pointer;}
.btn-coupon img {width:16px;height:16px;margin:0 0 0 10px;}
.btn-coupon strong {color:#ffeb00;font-weight:400;}
/* 옵션/갯수/금액/버튼 한개로 묶음 */
.buy-wrap {display:none;}
/* 옵션선택 */
.product-option {padding:20px 0 0 0;}
.product-option > select {width:100%;font-size:0.9rem;font-weight:300;padding:10px 36px 10px 12px;}
.product-option > select > option {font-weight:300;padding:10px;}
/* 갯수선택 */
.product-count {padding:15px 0 0 0;}
.product-count > p {}
.product-count-inner {width:100%;padding-top:5px;display:flex;justify-content: space-between;}
.counter-wrapper {display:inline-flex;border: 1px solid #ccc;overflow:hidden;}
.counter-button { width:32px; height:32px; border: none;background-color: #fff; font-size:0.9rem;cursor: pointer; transition: background-color 0.2s; }
.counter-button:hover { background-color: #f0f0f0; }
.counter-value { width: 50px; height: 32px; text-align: center; line-height: 32px; font-size:1rem;border-left: 1px solid #ccc; border-right: 1px solid #ccc; background-color: #fff; }
.counter-wrapper * { user-select: none; }
.counter-price {width:40%;display:flex;justify-content: flex-end;}
.counter-price > .price-item {padding-right:20px;font-size:1.1rem;}
.counter-price > .price-item > strong {font-weight:600;}
.counter-price > .delete {}
.close-button {display: flex; justify-content: center; align-items: center; width:28px; height:28px; cursor: pointer; border: none; background-color: transparent; padding: 0; }
.close-button svg { width: 100%; height: 100%; stroke: #888; stroke-width:1; fill: none; stroke-linecap: round; stroke-linejoin: round; }
/* 총 상품 금액 */
.total-price {width:100%;padding:15px 0 0 0;margin-top:20px;border-top:1px solid #eee;display:flex;justify-content: space-between;}
.total-price > .tit {width:30%;height:40px;line-height:48px;font-weight:500;}
.total-price > .price-item {width:70%;height:40px;display:flex;justify-content: flex-end;}
.total-price > .price-item > .total {color:#666;padding-right:20px;line-height:48px;}
.total-price > .price-item > .price-all {line-height:48px;}
.total-price > .price-item > .price-all > strong {color:#e30303;font-size:1.5rem;font-weight:600;line-height:40px;padding-right:3px;}
/* 버튼 */
.btn-buy {margin:18px auto 0;width:100%;display:block;background:#e30303;color:#fff;font-size:1.1rem;font-weight:400;letter-spacing:-0.5px;text-align:center;padding:20px 0;line-height:1;border-radius: 4px;cursor: pointer;}
.btn-b-wrap {width:100%;padding:11px 0 0 0;display: flex;justify-content: space-between;}
.btn-b-wrap > button {width:49%;display:block;background:#efefef;color:#222;font-size:1rem;font-weight:300;letter-spacing:-0.5px;text-align:center;padding:19px 0;line-height:1;border-radius: 4px;cursor: pointer;}
/* 공유하기 창 */
.sns-icons-window {display: none;position: absolute;top: 100%; /* 버튼 바로 아래 */left: -144px;background-color:#fff;border: 1px solid #dadada;border-radius:4px;padding: 12px;box-shadow: 0 4px 8px rgba(0,0,0,0.1);margin-top: 8px;z-index: 1000; /* 아래 display: flex는 .show 클래스에서 제어합니다. */gap: 12px;}
.sns-icons-window.show {display: flex; /* <<-- 중요: 이 클래스가 JS에 의해 추가되면 보여짐 */}
.sns-icon {width: 30px;height: 30px;border-radius: 50%;background-color: #f0f0f0;display: flex;justify-content: center;align-items: center;cursor: pointer;overflow: hidden;}
.sns-icon img {width: 100%;height: auto;}
.sns-icon:hover {opacity: 0.8;}
/* 구매후기 */
.reviews-container {display:none;}
/* 탭메뉴 */
html { scroll-behavior: smooth; }
.tab-menu {padding-top:30px;width:100%;border-bottom: 1px solid #dedede; box-shadow: 0 2px 3px rgba(0,0,0,0.06); }
.tab-menu li { flex: 1; text-align: center;padding:12px 0;font-size:0.8rem; border-right: 1px solid #dedede; background: #f4f4f4; transition: background 0.3s ease, color 0.3s ease; }
.tab-menu li span {display:none;}
.tab-section {padding:30px 0; border-bottom:1px solid #eee;scroll-margin-top: 70px; }
.tab-section > h3 {padding:10px 0;font-size:1.4rem;font-weight:500;text-align:center;line-height:1.5;}
.tab-section > .tit {font-size:1.2rem;font-weight:600;letter-spacing:-0.5px;}
.tab-section > .sub-tit {padding:20px 0 5px 0;font-size:0.96rem;font-weight:500;}
.tab-section > .sub-tit > .btn-receive {display: inline-block;margin-left:10px;padding:7px 17px 6px 17px;font-size:0.76rem;line-height:1;color:#fff;background-color: #0099ff;border-radius: 3px;}
.tab-section > .dtxtbox {font-size:0.8rem;font-family: "Nanum Gothic", sans-serif;color:#666;line-height:1.5;}
.tab-section > .imgbox {text-align:center;padding:30px 0 10px 0;}
.tab-section > .imgbox img {width:100%;}
.tab-section > .imgbox-de {text-align:center;padding:20px 0;}
.tab-section > .imgbox-de img {width:100%;height:auto;}
/* 탭영역 구매후기 */
.tab-reviews-grid {width:100%;}
.tab-review-card {width:100%;display: flex; justify-content: space-between;margin-top:15px;}
.tab-review-image {width:40%;}
.tab-review-image img {width: 100%; object-fit: cover;}
.tab-review-content {width:55%;display: flex; flex-direction: column;padding:0;}
.tab-review-content > .tit {width: 90%; margin-bottom: 8px; font-size: 0.96rem; font-weight: 500;line-height:1.3;}
.tab-review-content > p {width: 90%; margin-bottom: 10px; font-size: 0.8rem;line-height:1.3;color: #555; font-family: "Nanum Gothic", sans-serif;}

/* ------------ 주문하기 ----------- */
/* 주문하기 모달창 */
.modal {display:none;position: fixed;z-index: 1000;left: 0;top: 0;width: 100vw;height: 100vh;background-color: rgba(0,0,0,0.8);justify-content: center;align-items: center;overflow: hidden;}
.modal-content {background-color: #fff;padding:15px;border-radius: 0;width: 100vw;height: 100vh;position: relative;box-shadow: none;display: flex;flex-direction: column;}
.btn-modal-close {position: absolute;top:20px;right:10px;color: #222;font-size:2rem;font-weight:600;cursor: pointer;z-index: 1001;}
.modal-body {flex-grow: 1; /* 남은 공간을 모두 차지하여 스크롤이 필요하면 이 영역에 생김 */display: flex;flex-direction: column;width: 100%;overflow-y: auto; /* 내용이 길어질 경우에만 세로 스크롤바 생성 */}


}

/***************************************************************************/
/*					             기준 -일반 모바일 (480px ~ 767px)		   	             /
/***************************************************************************/
@media (min-width: 480px) and (max-width: 767px) {

html {font-size: 15px;}
body {font-size: 1rem;line-height: 1.6;}

.slide {width: 80vw;}

/* 헤더 */
.topmenu-wrap {display:none;}
.m-area {display:none;}
.menu {display:none;}
.mheader-logo {}
.mheader-search {}

/* --- 모바일 메뉴 스타일 --- */
.mobile-menu-wrapper {width: 100%;overflow-x: auto; -webkit-overflow-scrolling: touch; /* iOS에서 부드러운 스크롤 */white-space: nowrap; /* 메뉴 항목이 다음 줄로 줄 바꿈되는 것을 방지합니다. */
background-color: #f8f8f8;padding: 10px 0;}
.mobile-menu-wrapper ul {display: flex;align-items: center;padding: 0 10px;}
.mobile-menu-wrapper li {flex-shrink: 0; /* 항목이 줄어드는 것을 방지하고 정의된 너비를 유지합니다. */margin-right: 15px;text-align: center;}
.mobile-menu-wrapper li:last-child {margin-right: 0;}
.mobile-menu-wrapper a {display: block;text-decoration: none;color: #333;font-size: 12px;padding: 5px 0; /* 각 메뉴 항목 링크 내부 패딩 */}
.mobile-menu-wrapper img {display: block;width: 40px;height: 40px;margin: 0 auto 5px;}
.mobile-menu-wrapper .icon-hit {position: relative;display: inline-block;}
.mobile-menu-wrapper .icon-hit img {position: absolute;top: -5px;right: -10px;width: 20px;height: auto;margin: 0;}
.mobile-menu-wrapper::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera용 */}
.mobile-menu-wrapper { -ms-overflow-style: none; /* IE 및 Edge용 */scrollbar-width: none; /* Firefox용 */}

/* 푸터 */
.bmenu-wrap {width:100%;height:42px;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;}
.bmenu-wrap > .bmenu {width:100%;margin:0 auto;display:flex;flex-direction: column;flex-wrap: wrap;}
.bmenu-wrap > .bmenu > .leftarea {width:100%;}
.bmenu-wrap > .bmenu > .leftarea > ul {display:flex;justify-content:center;}
.bmenu-wrap > .bmenu > .leftarea > ul li {padding:0 8px;line-height:42px;font-size:0.76rem;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.bmenu-wrap > .bmenu > .leftarea > ul li:first-child {padding:0 8px 0 0;}
.bmenu-wrap > .bmenu > .leftarea > ul li a {color:#666;}
.bmenu-wrap > .bmenu > .rightarea {width:100%;}
.bmenu-wrap > .bmenu > .rightarea > ul {display:flex;justify-content:center;}
.bmenu-wrap > .bmenu > .rightarea > ul li {padding:0 8px;line-height:42px;font-size:0.76rem;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.bmenu-wrap > .bmenu > .rightarea > ul li:last-child {padding:0 0 0 8px;}
.bmenu-wrap > .bmenu > .rightarea > ul li a {color:#666;}
.footer-inner {width:100%;margin:50px auto 0;display:flex;flex-direction: column-reverse;}
.footer-inner > .cominfo {width:100%;padding-bottom:50px;display:flex;justify-content:row;}
.footer-inner > .cominfo > .logobox {display:none;}
.footer-inner > .cominfo > .info {width:100%;}
.footer-inner > .cominfo > .info li {font-size:0.9rem;}
.footer-inner > .n-order {width:100%;text-align:right;}
.footer-inner > .n-order > button {background:#208b58;color:#fff;letter-spacing:-0.5px;text-align:center;padding:15px 50px;line-height:1;border-radius: 4px;cursor: pointer;}

/* 배너3 */
.ban-area {display:none;}

/* 상품목록 */
.goods {width:100%;margin:100px auto 0;padding:0 15px;}
.goods > .tit {font-size:1.65rem;font-weight:600;letter-spacing:-1px;padding-bottom:20px;}
.goods > .tit > span {font-family:'Tahoma', sans-serif;}
.goods-inner {width:100%;display:flex;justify-content: space-between;flex-wrap: wrap;}
.goods-inner > .gbox {position: relative;width:31%;padding:0 0 80px 0;}
.goods-inner > .gbox img {width:100%;object-fit:cover;}
.goods-inner > .gbox ul {padding-top:20px;}
.goods-inner > .gbox ul li.gtit {line-height:1.3;}
.goods-inner > .gbox ul li.gtit > strong {font-weight:600;}
.goods-inner > .gbox ul li.info {padding-top:5px;font-size:0.76rem;line-height:1.4;letter-spacing:-0.5px;color:#666;font-family: "Nanum Gothic", sans-serif;}
.goods-inner > .gbox ul li.costprice {padding-top:15px;font-size:0.9rem;color:#969696;text-decoration:line-through;line-height:1;}
.goods-inner > .gbox ul li.price {padding-top:5px;font-size:1rem;font-weight:600;line-height:1;}
.btn-more {margin:20px auto 0;width:40%;display:block;background:#fff;border:1px solid #e1e1e1;font-weight:400;letter-spacing:-0.5px;text-align:center;padding:25px 0;line-height:1;border-radius: 4px;cursor: pointer;transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, transform 0.2s ease-out;}
.btn-more:hover {background:#f5f5f5;border:1px solid #f5f5f5;}
.btn-more img {width:12px;height:12px;margin:1px 0 0 10px;}


}


/***************************************************************************/
/*					             기준-태블릿 (768px ~ 1023px)		   	                     /
/***************************************************************************/
@media (min-width: 768px) and (max-width: 1023px) {

html {font-size: 16px;}
body {font-size: 1rem;line-height: 1.6;}

.slide {width: 80vw;}

}


/***************************************************************************/
/*					            노트북 (1024px ~ 1199px)		   	                             /
/***************************************************************************/
@media (min-width: 1024px) and (max-width: 1199px) {

html {font-size: 16px;}
body {font-size: 1rem;line-height: 1.6;}

}