@charset "utf-8";

body {width:100%; height:auto; -webkit-overflow-scrolling:touch;}
#wrap {min-width:320px; width:100%; height:100%; -webkit-overflow-scrolling:touch;}
.ly_wrap {overflow:hidden; overflow-y:scroll; -webkit-overflow-scrolling:touch;}

/*───────────────────────────────────────────────────────────

	 HEADER

───────────────────────────────────────────────────────────*/
#header_wrap {}
#header_wrap header { width:100%; min-width:320px; background:rgba(0,0,0,0.7); z-index:300;}
#header_wrap header.h_on {position:fixed; top:0; left:0;}
#header_wrap header .header_box {position:relative; height:50px;border-bottom:0px solid #cbcbcb;}
#header_wrap header .header_box .h_logo {padding:11px 0 5px 0; margin:0 auto; line-height:0; text-align:center;}
#header_wrap header .header_box .h_logo a {font-size:0; line-height:0; }
#header_wrap header .header_box .h_logo img {height:30px}
#header_wrap header .header_box .left_menu {position:absolute; top:0; left:5px; display:table;}
#header_wrap header .header_box .left_menu li {display:table-cell; vertical-align:top;}
#header_wrap header .header_box .right_menu {position:absolute; top:0; right:5px; display:table;}
#header_wrap header .header_box .right_menu li {position:relative; display:table-cell; vertical-align:top;}
/* 좌측 메뉴 */
#header_wrap header .header_box .side_menu {display:inline-block; padding:16px 7px 15px 7px; vertical-align:top;}
#header_wrap header .header_box .side_menu span {display:inline-block; width:20px; height:15px; font-size:0; background:url('../upload/icon_menu2.png') no-repeat center; background-size:100%; vertical-align:top;}
/* 검색 */
#header_wrap header .header_box .top_search {display:inline-block; padding:15px 7px 15px 7px; vertical-align:top; background:none; border:none;}
#header_wrap header .header_box .top_search span {display:inline-block; width:18px; height:17px;  font-size:0; background:url('../upload/icon_search2.png') no-repeat center; background-size:100%; vertical-align:top;}
/* 마이페이지 */
#header_wrap header .header_box .mypage {display:inline-block;  padding:14px 7px 14px 7px;}
#header_wrap header .header_box .mypage span {display:inline-block; width:21px; height:21px; font-size:0; background:url('../upload/icon_mypage2.png') no-repeat center; background-size:100%; vertical-align:top;}
/* 장바구니 */
#header_wrap header .header_box .cart {display:inline-block;  padding:15px 7px 14px 7px;}
#header_wrap header .header_box .cart span {display:inline-block; width:20px; height:21px;  font-size:0; background:url('../upload/icon_cart2.png') no-repeat center; background-size:100%; vertical-align:top;}
#header_wrap header .header_box .cart_count {position:absolute; top:8px; right:0; display:block; padding:3px 6px 1px 6px; line-height:15px; border-radius:100%; color:#fff; background:#ff4200;  vertical-align:middle; font-size:12px;}

/* 메인,서브 상단 고정배경 */
#maintop {position:relative; display: block; width: 100%; }

/* 카테고리배경 */
#cate { position:relative; width:100%; background:rgba(0,0,0,0.8); }

/* 움직이는물체 */
#frontin { width:120px; height:120px; text-align:center; background:rgba(0,0,0,0.5); border-radius:50px }
#frontin h2{ color:#fff; font-size:30px; line-height:30px; padding:20px 0 0 ; }
#frontin p{ display:block; color:#fff; font-size:20px; line-height:20px; padding:0 0 5px ; }
#frontin span{ padding:7px 15px; background:#FFFF00; border-radius:100px  }
#frontin span a { color:#000; font-size:15px;  }
#frontin { 
    position:absolute;
    animation-name: frontin;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@keyframes frontin {
    0%   {top:160px;  right:20px;}
    50%  {top:170px;  right:20px;}
    100% {top:160px;  right:20px;}
}
/*───────────────────────────────────────────────────────────

	 중앙 위치

───────────────────────────────────────────────────────────*/
/*#mainbox .mbox > li:nth-child(1) .desc_img img {position:absolute; top:0; left:0; width: 100%; height: 100%;  object-fit: cover;border-radius: 6px; }*/
.desc { position:relative; width:96%; margin:10px auto; font-size:20px;border-radius:20px; background:url("/data/skin/front/MARKET/upload/bg_main_middle02.png"); background-size: cover;   z-index:1 }
.desc div { padding:0 21px 5px; }
.desc .pname { font-size:17px; font-weight:600; padding:10px 30px; color:#fff;   }
.desc .ptext span { display:inline-block; margin:0 4px 8px 0; padding:7px 5px; border-radius:30px; font-size:12px; font-weight:500; color:#fff; background:#0DB5C0 }
.desc .ptext span:hover { background:#EC786A }
/*.desc .ptext2 {margin:15px 0 0; }*/
.desc .ptext2 span {  padding:8px 10px 0px;  font-size:14px; font-weight:300; color:#fff;  }

.banC {width:100%; margin:0}
.banC ul:after {content:"";display:block; clear:both}
.banC ul li{ float:left; display:block; width:50%; text-align:center}
.banC ul li:nth-child(1) { display:block; width:100%; text-align:center}
.banC ul li:nth-child(6) { display:block; width:100%; text-align:center}
.banC ul li img{width:98%}

.mrban0 {width:100%; margin:0}
.mrban0 div{ text-align:center}
.mrban0 img{width:100%;}

.mov { clear:both; width:100%; margin:1em auto; }
.mov:after { content:""; display:block; clear:both; }
.mov h2 { text-align:left; margin:1em 0.5em 0.3em; font-size:14px }
.fixed_sky {display:none;position:fixed; right:10px; bottom:125px}
.fixed_sky img { height:45px }


.sub_top {position:relative; padding:0 45px 0 43px; border-top:1px solid #dbdcde; background:#fff;}
/* 좌측 이전 */
.sub_top .sub_top_left {position:absolute; top:0; left:0;}
.sub_top h2 {overflow:hidden; display:block; width:100%; padding:12px 0; white-space:nowrap; text-overflow:ellipsis; font-size:15px; line-height:15px; text-align:center;}
/* 목록가기 글쓰기 위치 */
.sub_top .sub_top_right2 {position:absolute; top:5px; right:5px;}

/*───────────────────────────────────────────────────────────

	 네비게이터

───────────────────────────────────────────────────────────*/
.navi_g { background:#f9f9f9; border-top:1px solid #dbdcde;}
.navi_g ul {padding:6px 10px 6px 10px; font-size:0;}
.navi_g ul li {display:inline-block; font-size:12px; text-indent:17px; background:url('../img/icon/icon_arrow_next.png') no-repeat 5px center; background-size:7px 11px;}
.navi_g ul li:nth-child(1) {text-indent:0; background:none;}
.navi_g ul li a {font-size:12px; text-indent:15px;}

/*───────────────────────────────────────────────────────────

	 좌측 메뉴

───────────────────────────────────────────────────────────*/
#wrap nav {display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1001;}
#wrap nav .bg {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); z-index:1001;}
#wrap nav .left_close {position:fixed; top:20px; left:310px; width:29px; height:29px; background:url('../img/icon/icon_left_x.png') no-repeat center; background-size:100%; z-index:1002;}
#wrap nav .nav_bg_box {position:relative;}
#wrap nav .nav_bg_box .nav_box {position:fixed; top:0; left:0; width:290px; height:100%; margin:0 0 0 -290px; background:#fff; z-index:1001;}
#wrap nav .nav_bg_box .nav_box .nav_iscroll_box {position:relative; overflow: hidden; width:100%; height:100%;}
#wrap nav .nav_bg_box .nav_box .nav_iscroll_box {position:absolute; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0);}

/* 다국어 선택 */
.nav_language {display:table; position:relative; width:100%; background:#f3f3f3; }
.nav_language .tit {display:table-cell; width:30%; font-size:15px; padding:13px 15px 13px 15px; color:#262626; font-weight:bold; box-sizing:border-box;}
.nav_language .language_box {display:table-cell; width:70%; box-sizing:border-box;}

/* 배너 및 로그인 & 로그아웃 */
.nav_banner { position:relative; width:274px; margin:0 auto; padding:8px 0 8px 0; text-align:center;}
.nav_banner .nav_login { position:relative; }
.nav_banner .nav_login ul {font-size:0;}
.nav_banner .nav_login ul li {display:inline-block; padding:0 10px 0 10px; background:url('../img/icon/icon_line.gif') no-repeat left center; background-size:1px 11px; }
.nav_banner .nav_login ul li:first-child {background:none;}
.nav_banner .nav_login ul li a {display:inline-block; font-size:15px; color:#222222;}
.nav_banner img {width:100%;}
.nav_banner .left_logo { position:relative; text-align:center; }
.nav_banner .left_logo img {width:112px;}
.nav_banner .login_txt { position:relative; text-align:center; line-height:20px; box-sizing:border-box;padding: 0 20px; }
.nav_banner .login_txt p.name strong {overflow:hidden; display:inline-block; max-width:150px; text-overflow:ellipsis; white-space:nowrap; font-size:18px; vertical-align:middle; color:#000;}
/* 중앙 링크 (장바구니, Q&A, 최근본상품) */
.nav_link {padding:10px 0 0 0;}
.nav_link ul {display:table; width:100%;}
.nav_link ul li {display:table-cell; width:33.3%; text-align:center;}
.nav_link ul li a {display:block; padding:36px 0 0 0; font-size:13px; color:#888;}
.nav_link ul li:nth-child(1) a {background:url('../img/icon/icon_qna.png') no-repeat center 3px; background-size:33px 30px;}
.nav_link ul li:nth-child(2) a {background:url('../img/icon/icon_prd_latest.png') no-repeat center 4px; background-size:40px 25px;}
.nav_link ul li:nth-child(3) a {background:url('../img/icon/icon_lnb_heart.png') no-repeat center 4px; background-size:33px 28px;}

/* 네비 탭메뉴 */
.nav_tabmenu_box {padding-top:25px;}
.nav_tabmenu_box .nav_tabmenu {display:table; width:100%;}
.nav_tabmenu_box .nav_tabmenu li {display:table-cell; width:50%; text-align:center;}
.nav_tabmenu_box .nav_tabmenu li span {display:block; padding:10px 0 10px 0; background:#e8e8e8; color:#acacac;}
.nav_tabmenu_box .nav_tabmenu li.on span {background:#21807A; color:#fff; font-weight:bold;}
.nav_tabmenu_box .nav_tabmenu li:nth-child(1) span {margin:0 1px 0 8px;}
.nav_tabmenu_box .nav_tabmenu li:nth-child(2) span {margin:0 8px 0 1px;}

/* 게시판 */
.nav_community_box {padding-top:25px;}
.nav_community_box .comm_tit {padding:10px 0 10px 10px; margin:0 10px 0 10px; font-size:18px; color:#272727; font-weight:bold; border-bottom:1px solid #000000;}
.nav_community_box .board_cate {}
.nav_community_box .board_cate li {padding:0 25px;}
.nav_community_box .board_cate li a {display:block; padding:12px 0; font-size:16px; color:#1c1c1c;}

/* 배너 2 */
.nav_banner2 {width:274px; margin:0 auto; padding:20px 0 50px 0; }
.nav_banner2 a img {width:100%;}

/*───────────────────────────────────────────────────────────

	 FOOTER

───────────────────────────────────────────────────────────*/
#footer {margin:0}
/* 고객센터 / PC화면 보기 */
#footer footer .ft_button_box {padding:0 25px; background:#5d5d5d;}
#footer footer .ft_button_box ul {display:table; width:100%; padding:24px 0 0 0; text-align:center;}
#footer footer .ft_button_box ul li {display:table-cell; width:50%;}
#footer footer .ft_button_box ul li:nth-child(1) {padding-right:6px;}
#footer footer .ft_button_box ul li:nth-child(2) {padding-left:6px;}
#footer footer .ft_button_box ul li a {display:block; padding:10px 0; background:#484848; color:#aeaeae; font-size:13px; border-radius:2px;}
#footer footer .ft_info2_box {padding:10px; background:#5d5d5d;}
#footer footer .ft_info2_box .ft_menu {display:table; width:100%;}
#footer footer .ft_info2_box .ft_menu li {display:table-cell; width:25%;}
#footer footer .ft_info2_box .ft_menu li a {display:block; padding:18px 0 18px 0; font-size:11px; color:#d1d1d1; text-align:center; letter-spacing:-1px;}
#footer footer .ft_info2_box .ft_menu li a.privacy {color:#fff; font-weight:bold;}
#footer footer .ft_info2_box .ft_address {padding:0 50px 0 50px; text-align:center; font-size:12px; color:#e0e0e0; word-break:keep-all;}
#footer footer .ft_sns_btn {display:table; width:100%; text-align:center;}
#footer footer .ft_sns_btn li {display:inline-block; padding:10px 5px 10px 5px;}
#footer footer .ft_sns_btn li a {display:block; width:36px;}
#footer footer .ft_sns_btn li a img {width:100%;}
/* 카피라이터 */
#footer footer .ft_copy {padding:15px 0 30px 0; color:#e0e0e0; font-size:12px; text-align:center; font-style:normal;}
/* 바로가기 */
#footer footer .shortcut {text-align:center; background:#2f2f2f;}
#footer footer .shortcut a {display:block; padding:12px 0 12px 0;}
#footer footer .shortcut a span {position:relative; display:inline-block; color:#e0e0e0; height:36px; line-height:36px; padding:0 0 0 46px; background-size:36px; background-repeat:no-repeat;}
#footer footer .shortcut a span em {color:#ff353b; font-style:normal;}

/* 모바일에서 foot 영역 4등분 */
@media (max-width:768px){
.foot{display:flex; flex-wrap:nowrap; gap:3px; justify-content:center; padding:0; margin:0; align-items:center;justify-items:center;  }}
.foot img{ max-height:50px;width:auto; display:block;width}}


/* 탑버튼 */
#footer footer .ft_btn_top a {display:inline-block; width:100%; height:46px; border-top:1px solid #505050; border-bottom:1px solid #787878; text-align:center; color:#ffffff; background:#5d5d5d; line-height:46px; font-size:13px; font-weight:bold;}
#footer footer .ft_btn_top a span {padding:0 0 0 15px; background:url('../img/icon/icon_top_arrow.png') no-repeat 0 center; background-size:10px 6px;}
.fixed_btn_top {position:fixed; right:11px; bottom:85px; }
.fixed_btn_top span {display:inline-block; width:42px; height:42px; background:url('../img/btn/btn_top.png') no-repeat 0 0; background-size:42px 42px; font-size:0; text-indent:-9999px;}

/* 브랜드 검색 버튼 */
.btn_nav_brand_search {position:relative; display:block; padding-left:15px; margin:8px 8px 0 8px;; height:46px; line-height:46px; color:#1c1c1c; font-size:16px; font-weight:bold; letter-spacing:-1px; border:1px solid #e6e6e6;}
.btn_nav_brand_search:after {position:absolute; top:17px; right:17px; display:inline-block; content:''; width:6.5px; height:12px; background:url('../img/icon/icon_brand_arrow.png') no-repeat 0 0; background-size:6.5px 12px;}

/* 증명 마크 로고 영역 */
.foot_certify{padding:15px 7px 0; text-align:center; background:#fff;}
.foot_certify span{display:inline-block;margin-left:-4px;}
.foot_certify span:first-child{margin-left:0;}
.foot_certify img{height:45px; margin:0 7px 15px;}

.bestban{
  margin:0;
  background:#f7f7f7 url("/data/skin/front/MARKET/img/background/bg_lower_05.png")
center top / 80% repeat; padding:12px;padding-bottom:80px; margin-bottom:50px; margin-top:30px;}
/* 카드 그리드: 모바일 1열, 태블릿↑ 2열 */
.best-grid{
  list-style:none; margin:0; padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:40px;
}
.best-grid > li.span-2{ margin-top:50px; }
@media (min-width:768px){
  .best-grid{ grid-template-columns:1fr 1fr; }
  .best-grid .span-2{ grid-column:1 / -1; }  /* 3번 아이템 2칸 차지 */
}
.contbox{
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  position:relative;
  box-shadow:0 1px 4px rgba(0,0,0,.06);
}
.card{ display:block; position:relative; text-decoration:none; }
.embed,
.mrban0{                       /* 3번에서 쓰신 래퍼도 같은 규칙 적용 */
  position:relative;
  width:100%;
  aspect-ratio:16/9;          /* 필요시 21/9, 4/3 등으로 변경 가능 */
  overflow:hidden;
}
.embed img, .embed picture, .embed iframe, .embed video,
.mrban0 img, .mrban0 picture, .mrban0 iframe, .mrban0 video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border:0;
}
/* 오버레이 텍스트 */
.midbox{                       /* 가운데 라벨 영역 */
  position:absolute;
  left:0; right:0;
  bottom:70px;
  text-align:center;
  pointer-events:none;         /* 클릭 방해 X */
}
.conttext{
  background:#21807A;
  color:#fff;
  font-size:clamp(14px, 3.6vw, 16px);
  padding:10px 12px;
  display:inline-block;
  border-radius:6px;
}

/* 하단 바 텍스트 */
.botbox{
  position:absolute;
  left:0; right:0; bottom:0;
  min-height:52px;
  background:linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,0));
  text-align:center;
  padding:8px 10px;
  opacity:1;
  transition:opacity .25s ease;}
.botboxcont{color:#fff; font-size:clamp(16px, 4.5vw, 22px); letter-spacing:-0.5px; padding:0;}
.banner-weekly img { width: 100%;margin-top: 30px;height: auto;      display: block;     max-width: 100%;   }

/* 세일 블록 타이틀 (3번 카드 내부) */
.contbox.sale .tit{ font-weight:700;margin:8px 12px 4px;}





/* ===== 회원등급혜택 팝업 ===== */
/* 숨김 */
.gb_dn{ display:none !important; }

/* 딤 */
#gradeBenefitDim{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:9998;
}

/* 레이어 컨테이너 */
#gradeBenefitLayer{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  box-sizing:border-box;
}

/* 팝업 박스 */
.grade_benefit{
  width:min(92vw, 360px);
  background:#fff;
  border:1px solid #e8e8e8;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  color:#222;
}

/* 상단 */
.grade_benefit_top{
  position:relative;
  padding:12px 44px 12px 14px;
  background:#f5f5f5;
  border-bottom:1px solid #e8e8e8;
}
.grade_benefit_top h1{
  margin:0;
  font-size:14px;
  font-weight:600;
}

/* 닫기 */
.grade_benefit_close_btn{
  position:absolute;
  right:12px;
  top:10px;
  width:24px;
  height:24px;
  line-height:24px;
  text-align:center;
  cursor:pointer;
  font-size:16px;
}

/* 내용 */
.grade_benefit_contents{
  padding:14px;
  max-height:60vh;
  overflow:auto;
}

/* 리스트(dl) */
.grade_list dl{
  overflow:hidden;
  padding:10px 0;
  border-top:1px solid #e8e8e8;
  margin:0;
}
.grade_list dl:first-child{ border-top:0; }
.grade_list dt{
  float:left;
  width:80px;
  font-weight:700;
  font-size:12px;
  color:#666;
}
.grade_list dd{
  float:left;
  width:calc(100% - 80px);
  margin:0;
  font-size:12px;
  color:#222;
}