@charset "utf-8";
/* ============================================================
   동해옛날된장 모바일 전용 CSS
   ============================================================ */
body{font-family:'Noto Sans KR','Malgun Gothic',sans-serif !important;background:#f7f2ea;}
img{max-width:100%;}
button{font-family:inherit;}

/* skip nav */
#skip_nav a{position:absolute;top:-999px;left:-999px;font-size:0}
#skip_nav a:focus{position:fixed;top:0;left:0;width:100%;padding:10px;background:#2d2210;color:#fff;font-size:14px;text-align:center;z-index:99999}


/* ── 헤더 (흰색) ── */
#m_hd {
  position: sticky; top: 0; z-index: 1000;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
#m_hd_inner {
  display: flex; align-items: center;
  height: 54px; padding: 0 4px;
}
#m_nav_btn {
  width: 44px; height: 54px;
  background: none; border: 0;
  display: flex; flex-direction: column;
  justify-content: center; align-items: center;
  gap: 5px; flex-shrink: 0; cursor: pointer;
}
#m_nav_btn span {
  display: block; width: 22px; height: 2px;
  background: #5c3d1e; border-radius: 1px;  /* 흰배경에서 갈색 햄버거 */
}
#m_logo { flex: 1; text-align: center; }
#m_logo a { display: inline-flex; align-items: center; }
#m_logo img { height: 36px; width: auto; vertical-align: middle; }
#m_hd_right { display: flex; align-items: center; flex-shrink: 0; }
#m_sch_btn, #m_cart_btn {
  width: 40px; height: 54px;
  background: none; border: 0;
  color: #5c3d1e;              /* 흰배경에서 갈색 아이콘 */
  font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  position: relative; cursor: pointer;
}
#m_cart_btn em {
  position: absolute; top: 7px; right: 1px;
  background: #c0392b; color: #fff; font-size: 9px;
  min-width: 15px; height: 15px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px; font-style: normal;
}
/* 검색바 */
#m_sch_bar { background: #f7f2ea; padding: 8px 10px; display: none; border-bottom: 1px solid #e8dcc8; }
#m_sch_bar form { display: flex; }
#m_sch_bar input {
  flex: 1; height: 38px;
  background: #fff; border: 1px solid #c8b88a; border-right: 0;
  border-radius: 3px 0 0 3px; color: #333;
  padding: 0 12px; font-size: 13px; font-family: inherit; outline: none;
}
#m_sch_bar button[type=submit] { width: 38px; height: 38px; background: #8b6914; border: 0; color: #fff; font-size: 15px; }
#m_sch_close {
  width: 34px; height: 38px; background: #eee; border: 0;
  color: #888; border-radius: 0 3px 3px 0; font-size: 16px;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}

/* ── 슬라이드 네비 ── */
#m_nav {
  position: fixed; top: 0; left: -290px; width: 290px;
  height: 100%; background: #2d2210; z-index: 2000;
  transition: left .28s ease; overflow-y: auto;
}
#m_nav.is_open { left: 0; }
body.nav_open { overflow: hidden; }
#m_nav_bg { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1999; }
#m_nav_head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid #4a3820;
}
#m_nav_head span { color: #f5d78a; font-size: 15px; font-weight: 700; }
#m_nav_close { background: none; border: 0; color: #888; font-size: 20px; line-height: 1; cursor: pointer; }
#m_nav_list > li > a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; color: #ddd; font-size: 14px; font-weight: 500;
  border-bottom: 1px solid #3a2810; transition: color .15s;
}
#m_nav_list > li > a:hover, #m_nav_list > li.is_open > a { color: #f5d78a; }
.m_nav_sub { display: none; background: #1e1408; }
.m_nav_sub li a {
  display: block; padding: 11px 30px; color: #bbb; font-size: 13px;
  border-bottom: 1px solid #2a1e0a; transition: color .15s;
}
.m_nav_sub li a:hover { color: #f5d78a; }

/* ── 페이지 타이틀 ── */
#m_page_title {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px; background: #fff;
  border-bottom: 1px solid #e8dcc8; font-size: 15px; font-weight: 700;
}
#m_page_title button { background: none; border: 0; font-size: 17px; color: #8b6914; padding: 0; cursor: pointer; }

/* ── 메인 이미지 슬라이더 (9:6 비율) ── */
#m_visual { width: 100%; overflow: hidden; line-height: 0; }
#m_img_slider { width: 100%; position: relative; overflow: hidden; }

/* 9:6 = 66.66% padding-top */
#m_img_slider::before {
  content: ''; display: block;
  padding-top: 66.666%;   /* 9:6 비율 */
}
.m_img_slides {
  position: absolute; inset: 0;
}
.m_img_slide {
  display: none; position: absolute; inset: 0;
}
.m_img_slide.on { display: block; }
.m_img_slide a { display: block; width: 100%; height: 100%; }
.m_img_slide img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
}
/* 컨트롤 */
#m_img_slider .m_sprev,
#m_img_slider .m_snext {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px;
  background: rgba(255,255,255,0.25); border: 1px solid rgba(255,255,255,0.3);
  border-radius: 50%; color: #fff; font-size: 12px;
  cursor: pointer; z-index: 10;
  display: flex; align-items: center; justify-content: center;
}
#m_img_slider .m_sprev { left: 7px; }
#m_img_slider .m_snext { right: 7px; }
#m_img_slider .m_sdots {
  position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 6px; z-index: 10;
}
#m_img_slider .m_dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: rgba(255,255,255,0.4); cursor: pointer;
  transition: background .2s, transform .2s;
}
#m_img_slider .m_dot.on { background: #c9a84c; transform: scale(1.3); }

/* ── 배너 2열 ── */
.m_banner_row {
  display: flex; gap: 6px; padding: 10px;
  background: #fff; border-bottom: 1px solid #f0e8d8;
}
.m_banner_card {
  flex: 1; height: 120px; border-radius: 5px; overflow: hidden;
  position: relative; display: flex; align-items: flex-end;
}
.m_bc1 { background: linear-gradient(135deg,#f5e4c0,#d4b06a); }
.m_bc2 { background: linear-gradient(135deg,#3c2a0e,#7b5020); }
.m_bc_food { position: absolute; right: 8px; bottom: 0; }
.m_bc_food1 { width: 72px; height: 58px; background: radial-gradient(ellipse at 30% 25%,#c8a030,#7a4f10); border-radius: 40% 50% 60% 40%/50% 40% 60% 50%; }
.m_bc_food2 { width: 70px; height: 52px; background: linear-gradient(135deg,#c49a3e,#8b6010); border-radius: 4px; }
.m_bc_txt { position: relative; z-index: 2; padding: 10px 12px; }
.m_bc_txt h3 { font-size: 15px; font-weight: 900; margin-bottom: 2px; font-family: 'Noto Serif KR',serif; }
.m_bc1 .m_bc_txt h3 { color: #3c1e00; }
.m_bc2 .m_bc_txt h3 { color: #f5d78a; }
.m_bc_txt p { font-size: 10px; margin-bottom: 6px; line-height: 1.4; }
.m_bc1 .m_bc_txt p { color: #6b3e10; }
.m_bc2 .m_bc_txt p { color: rgba(245,215,138,.8); }
.m_bc_btn { display: inline-block; padding: 3px 10px; font-size: 10px; font-weight: 700; border-radius: 2px; }
.m_bc1 .m_bc_btn { background: #5c3d1e; color: #fff; }
.m_bc2 .m_bc_btn { background: #f5d78a; color: #3c1e00; }

/* ── 섹션 공통 ── */
.m_sec { padding: 16px 10px 6px; background: #f7f2ea; border-bottom: 1px solid #e8dcc8; }
.m_sec_wh { background: #fff; }
.m_sec_hd { margin-bottom: 12px; }
.m_sec_hd h2 { font-size: 18px; font-weight: 900; color: #2a1a00; font-family: 'Noto Serif KR',serif; display: inline; }
.m_sec_hd span { font-size: 11px; color: #999; margin-left: 6px; }

/* ── 인기상품 - 2열 그리드 (슬라이더 효과) ── */
.m_hit_slider {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
  overflow: visible !important;
}
.m_hit_slider .item_wrap {
  flex: none !important; width: 100% !important;
  border: 1px solid #e0d4b4 !important;
  border-radius: 8px !important; overflow: hidden !important;
  background: #fff !important;
  display: flex !important; flex-direction: column !important;
}
.m_hit_slider .item_photo {
  width: 100% !important; aspect-ratio: 1/1 !important;
  background: #faf5ec !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  padding: 10px !important; overflow: hidden !important;
}
.m_hit_slider .item_photo img {
  max-width: 100% !important; max-height: 100% !important;
  object-fit: contain !important; width: auto !important; height: auto !important;
}
.m_hit_slider .item_name { padding: 6px 8px 2px !important; text-align: center !important; }
.m_hit_slider .item_name a {
  font-size: 12px !important; font-weight: 700 !important; color: #1a1a1a !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; display: block !important;
}
.m_hit_slider .item_price { text-align: center !important; padding: 2px 8px 10px !important; margin-top: auto !important; }
.m_hit_slider .item_price .price { font-size: 14px !important; font-weight: 900 !important; display: block; }
.m_hit_slider .item_price .cust_price { font-size: 10px !important; color: #aaa !important; text-decoration: line-through !important; display: block; }
.m_hit_slider .item_wrap:nth-child(4n+1) .item_price .price { color: #c0392b !important; }
.m_hit_slider .item_wrap:nth-child(4n+2) .item_price .price { color: #8b6914 !important; }
.m_hit_slider .item_wrap:nth-child(4n+3) .item_price .price { color: #1a6e3c !important; }
.m_hit_slider .item_wrap:nth-child(4n+4) .item_price .price { color: #1a4a90 !important; }
.m_hit_slider .item_basic, .m_hit_slider .item_icon_wrap,
.m_hit_slider .btn_wish, .m_hit_slider .item_star { display: none !important; }

/* ── 중간 배너 (90:38 비율) ── */
.m_mid_img_banner {
  width: 100%; position: relative;
  overflow: hidden; background: transparent; line-height: 0;
}
.m_mid_img_banner::before {
  content: ''; display: block;
  padding-top: 42.22%;   /* 38/90 = 42.22% */
}
.m_mid_bg_img_wrap {
  position: absolute; bottom: 0; left: 0; right: 0; line-height: 0;
}
.m_mid_bg_img {
  width: 100%; display: block;
  height: auto; object-fit: cover; object-position: center bottom;
}
.m_mid_txt_overlay {
  position: absolute; inset: 0;
  display: flex; align-items: flex-end; justify-content: center; z-index: 2;
}
.m_mid_txt_overlay a {
  display: flex; align-items: flex-end; justify-content: center;
  width: 100%; height: 100%;
}
.m_mid_txt_overlay img {
  width: 100%; height: 100%;
  object-fit: contain; object-position: bottom center;
}

/* ── 추천상품 - 2열 깔끔 ── */
.m_rec_list {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
}
.m_rec_list .item_wrap {
  display: flex !important; flex-direction: column !important;
  background: #fff !important;
  border: 1px solid #e0d4b4 !important;
  border-radius: 8px !important; overflow: hidden !important;
  width: 100% !important;
}
.m_rec_list .item_photo {
  width: 100% !important; aspect-ratio: 1/1 !important;
  background: #faf5ec !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  padding: 10px !important; overflow: hidden !important;
}
.m_rec_list .item_photo img {
  max-width: 100% !important; max-height: 100% !important;
  object-fit: contain !important; width: auto !important; height: auto !important;
}
.m_rec_list .item_icon_wrap {
  display: flex !important; flex-wrap: wrap !important;
  gap: 3px !important; padding: 5px 8px 0 !important; justify-content: center !important;
}
.m_rec_list .item_name { padding: 3px 8px 2px !important; text-align: center !important; }
.m_rec_list .item_name a {
  font-size: 12px !important; font-weight: 700 !important; color: #1a1a1a !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; display: block !important;
}
.m_rec_list .item_basic {
  font-size: 10px !important; color: #999 !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
  display: block !important; padding: 0 8px !important; text-align: center !important;
}
.m_rec_list .item_price { padding: 3px 8px 10px !important; margin-top: auto !important; text-align: center !important; }
.m_rec_list .item_price .cust_price { font-size: 10px !important; color: #aaa !important; text-decoration: line-through !important; display: block !important; }
.m_rec_list .item_price .price { font-size: 14px !important; font-weight: 900 !important; color: #c0392b !important; display: block !important; }
.m_rec_list .item_star, .m_rec_list .btn_wish { display: none !important; }

/* ── 고객센터/계좌 ── */
.m_info_wrap { display: flex; gap: 8px; padding: 12px 10px; background: #f5f0e6; border-top: 1px solid #e0d4b4; border-bottom: 1px solid #e0d4b4; }
.m_info_box { flex: 1; background: #fff; border: 1px solid #e0d4b4; border-radius: 5px; padding: 12px; }
.m_info_lbl { display: inline-block; font-size: 9px; font-weight: 700; padding: 2px 8px; border-radius: 2px; color: #fff; margin-bottom: 7px; }
.m_info_sub { font-size: 10px; color: #888; margin-bottom: 3px; }
.m_info_sm { font-size: 10px; color: #666; margin-bottom: 1px; }
.m_info_tel { font-size: 17px; font-weight: 900; color: #c0392b; letter-spacing: -.5px; line-height: 1.2; margin-bottom: 3px; }
.m_info_note { font-size: 9px; color: #aaa; margin-top: 5px; line-height: 1.4; }
.m_nh { display: inline-block; background: #2060b0; color: #fff; font-size: 10px; font-weight: 900; padding: 2px 8px; border-radius: 2px; margin-bottom: 5px; }
.m_acc_num { font-size: 14px; font-weight: 900; color: #222; letter-spacing: -.3px; margin-bottom: 3px; }

/* ── 빠른 메뉴 ── */
.m_quick { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; background: #e0d4b4; border-top: 2px solid #e0d4b4; }
.m_qi { background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 12px 6px; gap: 4px; text-decoration: none; }
.m_qi:active { background: #fdf5e0; }
.m_qi > span:first-child { font-size: 22px; line-height: 1; }
.m_qi > span:last-child { font-size: 10px; color: #555; font-weight: 500; }

/* ── 푸터 ── */
#m_ft { background: #2d2210; padding: 18px 14px 30px; }
.m_ft_links { display: flex; flex-wrap: wrap; border-bottom: 1px solid #4a3820; padding-bottom: 12px; margin-bottom: 14px; }
.m_ft_links a { font-size: 11px; color: #d4b870; padding: 3px 10px; border-right: 1px solid #4a3820; line-height: 16px; }
.m_ft_links a:first-child { padding-left: 0; }
.m_ft_links a:last-child { border-right: 0; }
.m_ft_logo { text-align: center; margin-bottom: 10px; }
.m_ft_logo img { height: 32px; width: auto; display: inline-block; }
.m_ft_addr { font-style: normal !important; font-size: 11px; color: #e3e3e3; line-height: 2; text-align: center; margin-bottom: 12px; }
.m_ft_addr b { color: #f5d78a; }
#m_ft #visit { margin-bottom: 12px; }
#m_ft #visit h2 { color: #d4b870; font-size: 12px; text-align: center; margin-bottom: 6px; font-weight: 700; }
#m_ft #visit dt { color: #e3e3e3; font-size: 12px; }
#m_ft #visit dd strong { color: #fff; }
.m_ft_copy { border-top: 1px solid #4a3820; padding-top: 12px; text-align: center; font-size: 10px; color: #7a6840; }
.m_ft_pclink { display: block; text-align: center; margin-top: 10px; font-size: 11px; color: #8b6914; text-decoration: underline; }

/* ── 컨테이너 ── */
#m_container { min-height: 50vh; background: #f7f2ea; }

/* skip nav */
#skip_nav a { position: absolute; top: -999px; left: -999px; font-size: 0; }
#skip_nav a:focus { position: fixed; top: 0; left: 0; width: 100%; padding: 10px; background: #2d2210; color: #fff; font-size: 14px; text-align: center; z-index: 99999; }


/* ============================================================
   모바일 전용 스킨 CSS (mobile_basic/main.mobile.skin.php)
   ============================================================ */

/* 인기상품 섹션 - 흰배경 */
.m_sec_hit { background: #fff !important; padding-bottom: 0 !important; }

/* 추천상품 섹션 - 흰배경 */
.m_sec.m_sec_wh { background: #fff !important; }

/* ── 인기상품 슬라이더 ── */
.m_hit_wrap {
  overflow: hidden !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
}
.m_hit_slider_inner {
  overflow: hidden !important;
  width: 100% !important;
  line-height: normal !important;
}
/* ul: JS가 너비/transform 제어 */
.m_hit_slider_inner .m_prod_ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
}
/* li: JS가 너비 제어 */
.m_hit_slider_inner .m_prod_li {
  flex-shrink: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background: transparent !important;
  box-sizing: border-box !important;
}
/* 도트 - 상품이 있을 때만 */
.m_hit_dots { display: flex !important; justify-content: center !important; gap: 6px !important; padding: 8px 0 2px !important; line-height: normal !important; }
.m_hit_dots:empty { display: none !important; padding: 0 !important; margin: 0 !important; }

/* ── 추천상품 2열 그리드 ── */
.m_rec_list .m_prod_ul {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}
.m_rec_list .m_prod_li {
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  border: 1px solid #e0d0b0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ── 공통 카드 스타일 ── */
/* 이미지 */
.m_prod_img_link {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1/1 !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.m_prod_img_link img {
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
}
/* 아이콘 */
.m_prod_icons {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 2px !important;
  padding: 0 6px 2px !important;
}
.m_prod_icons img { height: 14px !important; width: auto !important; }
/* 상품명 */
.m_prod_name {
  padding: 4px 6px 2px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
}
.m_prod_name a {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
}
/* 설명 */
.m_prod_basic {
  font-size: 10px !important;
  color: #888 !important;
  text-align: center !important;
  padding: 0 6px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
}
/* 가격 */
.m_prod_price {
  text-align: center !important;
  padding: 3px 6px 8px !important;
  margin-top: auto !important;
}
.m_price_num {
  font-size: 13px !important;
  font-weight: 900 !important;
  color: #c0392b !important;
  display: block !important;
}
/* 빈 항목 */
.m_noitem {
  text-align: center !important;
  padding: 20px !important;
  color: #aaa !important;
  font-size: 13px !important;
  width: 100% !important;
}

/* 고객센터 영역 침범 방지 */
.m_info_wrap {
  clear: both !important;
  display: flex !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ============================================================
   추천상품 - div 기반 그리드 (float 없음)
   ============================================================ */
.m_rec_grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.m_rec_card {
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  border: 1px solid #e0d0b0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
.m_rec_img {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  aspect-ratio: 1/1 !important;
  background: transparent !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
.m_rec_img img {
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
}
.m_rec_icons {
  display: flex !important;
  justify-content: center !important;
  gap: 2px !important;
  padding: 0 6px 2px !important;
}
.m_rec_icons img { height: 14px !important; width: auto !important; }
.m_rec_name {
  padding: 4px 8px 2px !important;
  text-align: center !important;
}
.m_rec_name a {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
}
.m_rec_basic {
  font-size: 10px !important;
  color: #888 !important;
  text-align: center !important;
  padding: 0 8px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
}
.m_rec_price {
  text-align: center !important;
  padding: 3px 8px 10px !important;
  margin-top: auto !important;
}
.m_rec_price_num {
  font-size: 13px !important;
  font-weight: 900 !important;
  color: #c0392b !important;
  display: block !important;
}

/* ============================================================
   m_rec_outer - 추천상품 래퍼 강제 그리드
   ============================================================ */
.m_rec_outer { width: 100% !important; box-sizing: border-box !important; }

/* rec.mobile.skin.php 출력 div 그리드 */
.m_rec_outer .m_rec_grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  margin: 0 !important;
}
.m_rec_outer .m_rec_card {
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  border: 1px solid #e0d0b0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* 로고 20% 크게 */
#m_logo img { height: 41px !important; width: auto !important; }

/* 방문자 통계 완전 숨김 (모바일 서브페이지) */
#visit, .visit_wrap, #m_ft #visit { display: none !important; }

/* ============================================================
   모바일 회원가입 페이지 스타일
   ============================================================ */
/* 기본 폼 래퍼 */
#bo_register,
#register_form { padding: 0 10px !important; }

/* 회원가입 테이블 → 블록으로 변환 */
#register_form table,
#register_form tbody,
#register_form tr,
#register_form th,
#register_form td {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
#register_form tr { margin-bottom: 12px !important; }
#register_form th {
    padding: 0 0 4px 0 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #5c3d1e !important;
    background: transparent !important;
    border: 0 !important;
    text-align: left !important;
}
#register_form td {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

/* 입력 필드 */
#register_form input[type=text],
#register_form input[type=password],
#register_form input[type=email],
#register_form input[type=tel],
#register_form input[type=number],
#register_form select {
    width: 100% !important;
    height: 44px !important;
    border: 1px solid #c8b88a !important;
    border-radius: 4px !important;
    padding: 0 12px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    background: #fff !important;
    font-family: inherit !important;
}
#register_form input:focus,
#register_form select:focus {
    border-color: #8b6914 !important;
    outline: none !important;
}

/* 버튼들 */
#register_form .btn_submit,
#register_form input[type=submit],
#register_form button[type=submit] {
    width: 100% !important;
    height: 48px !important;
    background: #8b6914 !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 4px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    margin-top: 8px !important;
}
/* 중복확인 등 인라인 버튼 */
#register_form .btn_id_check,
#register_form .frm_btn {
    display: inline-block !important;
    padding: 0 12px !important;
    height: 36px !important;
    line-height: 34px !important;
    background: #5c3d1e !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    margin-left: 6px !important;
    vertical-align: middle !important;
}
/* 아이디 입력줄 (입력+버튼 나란히) */
#register_form #reg_mb_id {
    width: calc(100% - 80px) !important;
    display: inline-block !important;
}

/* 안내 텍스트 */
#register_form .frm_info,
#register_form .hint {
    font-size: 11px !important;
    color: #999 !important;
    margin-top: 4px !important;
    display: block !important;
}

/* 약관 영역 */
#register_form .agree_box {
    border: 1px solid #e8dcc8 !important;
    border-radius: 4px !important;
    padding: 10px !important;
    max-height: 120px !important;
    overflow-y: auto !important;
    font-size: 12px !important;
    background: #f9f9f9 !important;
    margin-bottom: 8px !important;
}

/* 로그인 페이지 */
#login_form { padding: 20px 10px !important; }
#login_form table,
#login_form tbody,
#login_form tr,
#login_form th,
#login_form td {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
#login_form tr { margin-bottom: 10px !important; }
#login_form th { font-size: 13px !important; font-weight: 700 !important; color: #5c3d1e !important; padding: 0 0 4px !important; border: 0 !important; background: transparent !important; }
#login_form td { padding: 0 !important; border: 0 !important; }
#login_form input[type=text],
#login_form input[type=password] {
    width: 100% !important; height: 44px !important;
    border: 1px solid #c8b88a !important; border-radius: 4px !important;
    padding: 0 12px !important; font-size: 14px !important; box-sizing: border-box !important;
}
#login_form .btn_submit {
    width: 100% !important; height: 48px !important;
    background: #8b6914 !important; color: #fff !important;
    border: 0 !important; border-radius: 4px !important;
    font-size: 16px !important; font-weight: 700 !important; margin-top: 8px !important;
}


@charset "utf-8";
/* ============================================================
   모바일 상품 상세 페이지
   ============================================================ */

/* 기본 */
body { background: #f7f2ea; }

/* 이미지 슬라이더 */
.mi_img_wrap { width: 100%; background: #fff; }
.mi_slider { position: relative; overflow: hidden; line-height: 0; }
.mi_slides { position: relative; width: 100%; }
.mi_slide { display: none; width: 100%; }
.mi_slide.on { display: block; }
.mi_slide img { width: 100%; height: auto; max-height: 80vw; object-fit: contain; display: block; margin: 0 auto; background: #fff; }
.mi_single_img img { width: 100%; height: auto; max-height: 80vw; object-fit: contain; display: block; background: #fff; }
/* 이전/다음 */
.mi_prev, .mi_next {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; background: rgba(255,255,255,0.7);
  border: 1px solid rgba(0,0,0,0.1); border-radius: 50%;
  color: #555; font-size: 13px; cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
}
.mi_prev { left: 6px; } .mi_next { right: 6px; }
/* 도트 */
.mi_dots { display: flex; justify-content: center; gap: 5px; padding: 8px 0; background: #fff; line-height: 1; }
.mi_dot { width: 7px; height: 7px; border-radius: 50%; background: #ddd; cursor: pointer; transition: background .2s; }
.mi_dot.on { background: #8b6914; }

/* 상품 정보 */
.mi_info {
  background: #fff;
  padding: 14px 12px;
  margin-top: 8px;
}
.mi_name {
  font-size: 18px; font-weight: 900; color: #1a1a1a;
  line-height: 1.4; margin-bottom: 6px;
}
.mi_basic { font-size: 12px; color: #888; line-height: 1.5; margin-bottom: 12px; }

/* 가격 테이블 */
.mi_price_tbl { border-top: 1px solid #e8dcc8; border-bottom: 1px solid #e8dcc8; margin-bottom: 14px; }
.mi_row {
  display: flex; align-items: center;
  padding: 9px 0; border-bottom: 1px solid #f5f0e8;
}
.mi_row:last-child { border-bottom: 0; }
.mi_label { width: 80px; flex-shrink: 0; font-size: 12px; color: #888; }
.mi_val { font-size: 13px; color: #333; }
.mi_cust_price { text-decoration: line-through; color: #aaa !important; font-size: 12px !important; }
.mi_row_price .mi_val { font-size: 0; }
.mi_sell_price { font-size: 22px !important; font-weight: 900 !important; color: #c0392b !important; }

/* 옵션 */
.mi_option { margin-bottom: 10px; }
.mi_option select {
  width: 100%; height: 42px; border: 1px solid #c8b88a; border-radius: 3px;
  padding: 0 10px; font-size: 13px; background: #fff; margin-bottom: 6px;
}

/* 수량 */
.mi_basket_wrap { margin-bottom: 10px; }
.sit_basket {
  background: #f7f2ea; border-radius: 4px; padding: 10px;
  margin-bottom: 6px;
}
.sit_basket_name { font-size: 13px; font-weight: 600; margin-bottom: 8px; color: #333; }
.sit_basket_ea { display: flex; align-items: center; gap: 8px; }
.sit_basket_ea .btn_minus,
.sit_basket_ea .btn_plus {
  width: 32px; height: 32px; border: 1px solid #c8b88a; background: #fff;
  border-radius: 3px; font-size: 18px; display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.sit_basket_ea input[type=text] {
  width: 50px; height: 32px; text-align: center;
  border: 1px solid #c8b88a; border-radius: 3px; font-size: 14px;
}
.sit_basket_price { margin-left: auto; font-size: 14px; font-weight: 700; color: #c0392b; }
.sit_basket_del { width: 28px; height: 28px; border: 1px solid #ddd; background: #fff; border-radius: 3px; cursor: pointer; font-size: 14px; color: #aaa; }

/* 총 금액 */
.mi_total {
  text-align: right; font-size: 14px; color: #555;
  padding: 10px 0; border-top: 1px solid #e8dcc8; margin-bottom: 12px;
}
.mi_total strong { font-size: 22px; font-weight: 900; color: #c0392b; }

/* 구매 버튼 */
.mi_btns { display: flex; gap: 8px; margin-bottom: 4px; }
.mi_btn_cart {
  flex: 1; height: 48px; border: 2px solid #5c3d1e; background: #fff;
  color: #5c3d1e; border-radius: 4px; font-size: 15px; font-weight: 700; cursor: pointer;
}
.mi_btn_buy {
  flex: 1; height: 48px; border: 0; background: #8b6914;
  color: #fff; border-radius: 4px; font-size: 15px; font-weight: 700; cursor: pointer;
}
.mi_btn_wish {
  width: 48px; height: 48px; border: 1px solid #ddd; background: #fff;
  border-radius: 4px; font-size: 20px; color: #aaa; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.mi_soldout {
  text-align: center; padding: 20px; background: #f5f5f5; border-radius: 4px;
  color: #888; font-size: 14px; font-weight: 600;
}

/* 탭 */
.mi_tab_wrap { margin-top: 10px; background: #fff; }
.mi_tab_tit {
  display: flex; background: #3c2a0e;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  border-bottom: 0;
}
.mi_tab_tit::-webkit-scrollbar { display: none; }
.mi_tab_btn {
  flex-shrink: 0; height: 46px; padding: 0 16px;
  background: transparent; border: 0; border-bottom: 2px solid transparent;
  color: rgba(255,255,255,0.65); font-size: 13px; font-weight: 500;
  white-space: nowrap; cursor: pointer; position: relative;
}
.mi_tab_btn span {
  display: inline-block; background: rgba(255,255,255,0.2); color: rgba(255,255,255,0.8);
  font-size: 10px; padding: 1px 5px; border-radius: 8px; margin-left: 3px;
  vertical-align: middle;
}
.mi_tab_btn.active { color: #f5d78a; border-bottom-color: #c9a84c; font-weight: 700; }

/* 탭 내용 */
.mi_tab_con { display: none; padding: 16px 12px; }
.mi_tab_con.active { display: block; }
/* 상품 상세 이미지 */
.mi_tab_con img { max-width: 100% !important; height: auto !important; display: block; }

/* 상품 정보 고시 */
.mi_inf_title {
  font-size: 14px; font-weight: 700; color: #5c3d1e;
  padding-bottom: 8px; border-bottom: 2px solid #c9a84c; margin-bottom: 10px;
}
.mi_inf_row { border: 1px solid #e8dcc8; border-radius: 4px; overflow: hidden; margin-bottom: 6px; }
.mi_inf_th {
  background: #f7f2ea; padding: 8px 12px;
  font-size: 12px; font-weight: 600; color: #5c3d1e;
}
.mi_inf_td { padding: 8px 12px; font-size: 12px; color: #555; }

/* 배송/교환 */
.mi_ship_section { margin-bottom: 16px; }
.mi_ship_section h3 {
  font-size: 14px; font-weight: 700; color: #5c3d1e;
  margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid #e8dcc8;
}
.mi_ship_section ul { padding-left: 16px; }
.mi_ship_section li { font-size: 12px; color: #555; line-height: 1.8; list-style: disc; }

/* 기존 스타일 override */
#sit_buy, .sit_buy_inner, #stv_pg, #sit_rel { display: none !important; }
/* sit_ov_wrap 등은 mobile_item.css에서 처리 */

/* ============================================================
   모바일 상품 상세 페이지 - 최종
   ============================================================ */
.mi_img_wrap { width:100%; background:#fff; line-height:0; }
.mi_slider { position:relative; overflow:hidden; }
.mi_slides { width:100%; }
.mi_slide { display:none; width:100%; line-height:0; }
.mi_slide.on { display:block; }
/* 이미지 비율 유지 - aspect-ratio 사용 */
.mi_slide img,
.mi_single_img img {
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  display:block !important;
  aspect-ratio:auto !important;
}
.mi_prev,.mi_next{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;background:rgba(255,255,255,.75);border:1px solid rgba(0,0,0,.1);border-radius:50%;color:#555;font-size:13px;cursor:pointer;z-index:5;display:flex;align-items:center;justify-content:center;}
.mi_prev{left:6px;}.mi_next{right:6px;}
.mi_dots{display:flex;justify-content:center;gap:5px;padding:8px 0;background:#fff;line-height:1;}
.mi_dot{width:7px;height:7px;border-radius:50%;background:#ddd;cursor:pointer;transition:background .2s;}
.mi_dot.on{background:#8b6914;}

.mi_info{background:#fff;padding:14px 12px;margin-top:6px;}
.mi_name{font-size:17px;font-weight:900;color:#1a1a1a;line-height:1.4;margin-bottom:6px;display:block;}
.mi_basic{font-size:12px;color:#888;line-height:1.5;margin-bottom:12px;}

.mi_price_tbl{border-top:1px solid #e8dcc8;border-bottom:1px solid #e8dcc8;margin-bottom:14px;}
.mi_row{display:flex;align-items:center;padding:9px 0;border-bottom:1px solid #f5f0e8;}
.mi_row:last-child{border-bottom:0;}
.mi_label{width:80px;flex-shrink:0;font-size:12px;color:#888;}
.mi_val{font-size:13px;color:#333;}
.mi_cust_price{text-decoration:line-through;color:#aaa !important;font-size:12px !important;}
.mi_sell_price{font-size:21px !important;font-weight:900 !important;color:#c0392b !important;}

.mi_option{margin-bottom:10px;}
.mi_option select{width:100%;height:42px;border:1px solid #c8b88a;border-radius:3px;padding:0 10px;font-size:13px;background:#fff;margin-bottom:6px;box-sizing:border-box;}

.mi_basket_wrap{margin-bottom:10px;}
.sit_basket{background:#f7f2ea;border-radius:4px;padding:10px;margin-bottom:6px;}
.sit_basket_name{font-size:13px;font-weight:600;margin-bottom:8px;color:#333;}
.sit_basket_ea{display:flex;align-items:center;gap:8px;}
.sit_basket_ea .btn_minus,.sit_basket_ea .btn_plus{width:32px;height:32px;border:1px solid #c8b88a;background:#fff;border-radius:3px;font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.sit_basket_ea input[type=text]{width:50px;height:32px;text-align:center;border:1px solid #c8b88a;border-radius:3px;font-size:14px;}
.sit_basket_price{margin-left:auto;font-size:14px;font-weight:700;color:#c0392b;}

.mi_total{text-align:right;font-size:14px;color:#555;padding:10px 0;border-top:1px solid #e8dcc8;margin-bottom:12px;}
.mi_total strong{font-size:21px;font-weight:900;color:#c0392b;}

.mi_btns{display:flex;gap:8px;margin-bottom:4px;}
.mi_btn_cart{flex:1;height:48px;border:2px solid #5c3d1e;background:#fff;color:#5c3d1e;border-radius:4px;font-size:14px;font-weight:700;cursor:pointer;}
.mi_btn_buy{flex:1;height:48px;border:0;background:#8b6914;color:#fff;border-radius:4px;font-size:14px;font-weight:700;cursor:pointer;}
.mi_btn_wish{width:48px;height:48px;border:1px solid #ddd;background:#fff;border-radius:4px;font-size:18px;color:#aaa;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.mi_soldout{text-align:center;padding:20px;background:#f5f5f5;border-radius:4px;color:#888;font-size:14px;font-weight:600;}

.mi_tab_wrap{margin-top:10px;background:#fff;}
.mi_tab_tit{display:flex;background:#3c2a0e;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.mi_tab_tit::-webkit-scrollbar{display:none;}
.mi_tab_btn{flex-shrink:0;height:46px;padding:0 16px;background:transparent;border:0;border-bottom:2px solid transparent;color:rgba(255,255,255,.65);font-size:12px;font-weight:500;white-space:nowrap;cursor:pointer;}
.mi_tab_btn span{display:inline-block;background:rgba(255,255,255,.2);color:rgba(255,255,255,.8);font-size:10px;padding:1px 5px;border-radius:8px;margin-left:3px;vertical-align:middle;}
.mi_tab_btn.active{color:#f5d78a;border-bottom-color:#c9a84c;font-weight:700;}
.mi_tab_con{display:none;padding:14px 12px;}
.mi_tab_con.active{display:block;}
.mi_tab_con img{max-width:100% !important;height:auto !important;display:block;}

.mi_inf_title{font-size:14px;font-weight:700;color:#5c3d1e;padding-bottom:8px;border-bottom:2px solid #c9a84c;margin-bottom:10px;}
.mi_inf_row{border:1px solid #e8dcc8;border-radius:4px;overflow:hidden;margin-bottom:6px;}
.mi_inf_th{background:#f7f2ea;padding:8px 12px;font-size:12px;font-weight:600;color:#5c3d1e;}
.mi_inf_td{padding:8px 12px;font-size:12px;color:#555;}

.mi_ship_section{margin-bottom:16px;}
.mi_ship_section h3{font-size:14px;font-weight:700;color:#5c3d1e;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #e8dcc8;}
.mi_ship_section ul{padding-left:16px;}
.mi_ship_section li{font-size:12px;color:#555;line-height:1.8;list-style:disc;}

/* 기존 PC 요소 완전 숨김 */
/* sit_buy만 숨김, 나머지는 mobile_item.css에서 처리 */
#sit_buy,.sit_buy_inner,#stv_pg,#sit_rel { display:none !important; }

/* ============================================================
   커뮤니티(회원가입/게시판 등) 페이지 패딩 및 스타일
   ============================================================ */
.m_comm_container {
  padding: 0 14px 30px;
  min-height: 60vh;
  background: #f7f2ea;
  box-sizing: border-box;
}
.m_comm_container .register,
.m_comm_container .mbskin {
  padding: 16px 0;
}
/* 회원가입 폼 패딩 */
.m_comm_container .form_01 { margin-bottom: 16px; }
.m_comm_container .form_01 h2 {
  background: #5c3d1e;
  color: #fff;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 700;
  margin: 0;
}
.m_comm_container .form_01 ul {
  background: #fff;
  padding: 14px;
  border: 1px solid #e8dcc8;
  border-top: 0;
  border-radius: 0 0 6px 6px;
}
.m_comm_container .form_01 li { margin-bottom: 12px; }
.m_comm_container .form_01 li:last-child { margin-bottom: 0; }
/* 입력필드 */
.m_comm_container input[type=text],
.m_comm_container input[type=password],
.m_comm_container input[type=email],
.m_comm_container input[type=tel],
.m_comm_container select,
.m_comm_container .frm_input {
  display: block !important;
  width: 100% !important;
  height: 44px !important;
  border: 1px solid #c8b88a !important;
  border-radius: 4px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  background: #fff !important;
  font-family: inherit !important;
}
.m_comm_container input:focus { border-color: #8b6914 !important; outline: none !important; }
.m_comm_container input::placeholder { color: #bbb !important; }
/* 체크박스/라디오 원래 크기 */
.m_comm_container input[type=checkbox],
.m_comm_container input[type=radio] {
  display: inline-block !important;
  width: 20px !important;
  height: 20px !important;
  border: 1px solid #c8b88a !important;
  vertical-align: middle !important;
  accent-color: #8b6914 !important;
  cursor: pointer !important;
}
/* 제출 버튼 */
.m_comm_container .btn_submit,
.m_comm_container input[type=submit] {
  display: block !important;
  width: 100% !important;
  height: 50px !important;
  background: #8b6914 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 6px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  margin-top: 10px !important;
  box-sizing: border-box !important;
}
/* 안내텍스트 */
.m_comm_container .frm_info {
  font-size: 11px;
  color: #aaa;
  margin-top: 4px;
  display: block;
}
/* 중복확인 버튼 */
.m_comm_container .btn_id_check {
  height: 36px !important;
  padding: 0 14px !important;
  background: #5c3d1e !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  cursor: pointer !important;
  margin-top: 6px !important;
}
/* 약관 */
.m_comm_container #fregister_chkall,
.m_comm_container #fregister_term,
.m_comm_container #fregister_private {
  margin-bottom: 14px;
}
.m_comm_container #fregister_chkall {
  background: #f7f2ea;
  border: 1px solid #c8b88a;
  border-radius: 6px;
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.m_comm_container #fregister_term,
.m_comm_container #fregister_private {
  background: #fff;
  border: 1px solid #e8dcc8;
  border-radius: 8px;
  overflow: hidden;
}
.m_comm_container #fregister_term h2,
.m_comm_container #fregister_private h2 {
  background: #5c3d1e;
  color: #fff;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 700;
  margin: 0;
}
.m_comm_container textarea {
  width: 100% !important;
  height: 100px;
  border: 0;
  border-bottom: 1px solid #e8dcc8;
  padding: 10px 14px;
  font-size: 12px;
  color: #666;
  resize: none;
  box-sizing: border-box;
  background: #faf9f7;
  display: block;
}
.m_comm_container .fregister_agree {
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 0;
  margin: 0;
}
.m_comm_container .fregister_agree label {
  font-size: 14px;
  color: #333;
  cursor: pointer;
  flex: 1;
}
.m_comm_container .btn_confirm { padding: 4px 0; }
.m_comm_container .btn_confirm .btn_submit {
  width: 100% !important;
  height: 50px !important;
  background: #8b6914 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 6px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  display: block !important;
}
/* 개인정보 테이블 */
.m_comm_container .tbl_head01 { overflow-x: auto; padding: 0 14px 14px; }
.m_comm_container .tbl_head01 table { width: 100%; border-collapse: collapse; }
.m_comm_container .tbl_head01 th { background: #f7f2ea; padding: 8px 10px; font-size: 12px; color: #5c3d1e; border: 1px solid #e8dcc8; }
.m_comm_container .tbl_head01 td { padding: 8px 10px; font-size: 12px; color: #444; border: 1px solid #e8dcc8; line-height: 1.5; }

/* 페이지 타이틀 */
#m_page_title {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: #fff;
  border-bottom: 1px solid #e8dcc8;
  font-size: 15px;
  font-weight: 700;
  margin: 0 -14px 14px;
}
#m_page_title button {
  background: none;
  border: 0;
  font-size: 17px;
  color: #8b6914;
  cursor: pointer;
  padding: 0;
}


/* ── 모바일 푸터 바로가기 ── */
.m_ft_quick { text-align: center; padding: 16px 14px 12px; border-bottom: 1px solid #4a3820; margin-bottom: 14px; }
.m_ft_quick a { color: #d4b870; font-size: 13px; font-weight: 600; text-decoration: none; padding: 0 6px; }
.m_ft_qdiv { color: #5a4830; font-size: 12px; }