/* BASIC css start */
/* [상도] 2026-11-10 박기환 · 모바일 맨 위·아래 띠 개편(양지연 11-06 · 19·21·23번)의 모양 규칙을 상단 JS 칸에서 상단 CSS 칸 맨 위로 옮김 · 처음 뜰 때 번쩍임 없애기 · 상단 JS 의 TH·GR 값을 바꿔도 이제 모양은 안 바뀜(여기를 고칠 것) · 맨 위에 둬야 아래 규칙들과의 순서가 전과 같음 · ops#69 · 시작 */
.SMS_fixed_wrap .fixed_logo{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:12px 14px 8px!important;height:auto!important;min-height:58px;box-sizing:border-box}
.SMS_fixed_wrap .fixed_logo>a:not(#sdh-cart){margin:0!important;position:static!important}
.SMS_fixed_wrap .m_menu{display:none!important}
.SMS_fixed_wrap .search_fixed_btn{width:auto!important;margin:0 14px 8px!important;background:#f2f3f5;border:0!important;border-radius:12px;box-sizing:border-box}
.SMS_fixed_wrap .search_fixed_btn form,.SMS_fixed_wrap .search_fixed_btn input{border:0!important;background:transparent!important}
#sdh-cart{position:relative!important;display:block!important;width:30px;height:30px;flex:0 0 auto}
#sdh-cart svg{width:28px;height:28px}
#sdh-cart b{position:absolute;top:-3px;right:-6px;min-width:17px;height:17px;padding:0 4px;box-sizing:border-box;border-radius:9px;background:#f25a3d;color:#fff;font-size:11px;font-weight:800;line-height:17px;text-align:center}
.SMS_fixed_wrap .m_cart.sdh-old{display:none!important}
.SMS_fixed_wrap .rolling_wrap{transition:max-height .25s ease,opacity .2s;max-height:400px;overflow:hidden}
.SMS_fixed_wrap.sdh-fold .rolling_wrap{max-height:0!important;opacity:0}
#SMS_fixedMenu>*:not(#sdh-bar){display:none!important}
#sdh-bar{display:flex;justify-content:space-around;align-items:center;height:60px;background:#fff;border-top:1px solid #e5e7eb}
#sdh-bar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;color:#333;text-decoration:none;cursor:pointer}
#sdh-bar a svg{width:24px;height:24px}
#sdh-bar a.on{color:#2DBEE9}
.promotionBanner{display:none!important}
#sdh-pop{position:fixed;inset:0;z-index:100003;background:rgba(15,22,38,.55);display:flex;align-items:center;justify-content:center;padding:24px}
#sdh-pop .cd{position:relative;background:#fff;border-radius:22px;width:100%;max-width:300px;padding:70px 20px 18px;text-align:center;color:#1f2a44;box-sizing:border-box}
#sdh-pop .ic{position:absolute;left:50%;top:-62px;transform:translateX(-50%);width:124px;height:124px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.18))}
#sdh-pop .x{position:absolute;right:-6px;top:-54px;width:38px;height:38px;border-radius:19px;background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;font-size:20px;color:#333;cursor:pointer}
#sdh-pop .t1{margin:0;font-size:16px;font-weight:800;color:#2DBEE9}
#sdh-pop .t2{margin:4px 0 16px;font-size:19px;font-weight:800}
#sdh-pop .go{display:block;padding:14px;border-radius:12px;background:#222;color:#fff;font-weight:800;font-size:15.5px;text-decoration:none}
#sdh-pop .no{display:block;margin-top:12px;font-size:12.5px;color:#9ca3af;cursor:pointer}
#sdh-pop .cd{animation:sdhIn .45s cubic-bezier(.2,1.5,.4,1) both}
@keyframes sdhIn{0%{transform:scale(.6);opacity:0}
100%{transform:scale(1);opacity:1}
}
#sdh-pop .ic{transform-origin:50% 85%;animation:sdhGift 2.6s ease-in-out .5s infinite}
@keyframes sdhGift{0%,100%{transform:translateX(-50%) translateY(0) rotate(0)}
25%{transform:translateX(-50%) translateY(-6px) rotate(0)}
50%{transform:translateX(-50%) translateY(0) rotate(0)}
58%{transform:translateX(-50%) rotate(-9deg)}
64%{transform:translateX(-50%) rotate(8deg)}
70%{transform:translateX(-50%) rotate(-6deg)}
76%{transform:translateX(-50%) rotate(4deg)}
82%{transform:translateX(-50%) rotate(0)}
}
#sdh-pop .sp{position:absolute;color:#ffd24a;font-size:16px;line-height:1;animation:sdhTw 1.6s ease-in-out infinite;pointer-events:none}
#sdh-pop .sp.b{color:#2DBEE9;font-size:12px;animation-delay:.5s}
#sdh-pop .sp.c{font-size:11px;animation-delay:1s}
@keyframes sdhTw{0%,100%{opacity:0;transform:scale(.4) rotate(0)}
50%{opacity:1;transform:scale(1.15) rotate(20deg)}
}
#sdh-pop .go{animation:sdhPulse 1.8s ease-out 1s infinite}
@keyframes sdhPulse{0%{box-shadow:0 0 0 0 rgba(45,190,233,.55)}
70%{box-shadow:0 0 0 12px rgba(45,190,233,0)}
100%{box-shadow:0 0 0 0 rgba(45,190,233,0)}
}
@media (prefers-reduced-motion:reduce){#sdh-pop .cd,#sdh-pop .ic,#sdh-pop .sp,#sdh-pop .go{animation:none}
#sdh-pop .ic{transform:translateX(-50%)}
}
#sdh-rv{position:fixed;inset:0;z-index:100002;background:rgba(15,22,38,.5);display:flex;align-items:flex-end}
#sdh-rv .sh{background:#fff;width:100%;max-height:75vh;overflow:auto;border-radius:18px 18px 0 0;padding:16px 16px 24px;box-sizing:border-box;color:#1f2a44}
#sdh-rv .hd{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
#sdh-rv .hd b{font-size:17px}
#sdh-rv .hd a{font-size:20px;cursor:pointer;color:#333}
#sdh-rv .gr{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#sdh-rv .gr a{text-decoration:none;color:#1f2a44;font-size:12px;line-height:1.35}
#sdh-rv .gr img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;background:#f2f3f5;display:block;margin-bottom:4px}
#sdh-rv .em{padding:30px 0;text-align:center;color:#6b7280;font-size:14px}
#sdh-rv .clr{display:block;margin-top:14px;text-align:center;font-size:12.5px;color:#6b7280;text-decoration:underline;cursor:pointer}
.SMS_fixed_wrap .search_fixed_btn{background:#fff!important;border:2px solid #2DBEE9!important}
.SMS_fixed_wrap .SMS_fixed_inner{border-bottom:0!important}
.SMS_fixed_wrap .SMS_rolling_menu{border:0!important}
.SMS_fixed_wrap .SMS_rolling_menu .swiper-slide{border-bottom:0!important;height:36px!important}
.SMS_fixed_wrap .rolling_wrap{padding:0 8px 6px;box-sizing:border-box;border-bottom:1px solid #eef0f3}
.SMS_fixed_wrap .rolling_wrap a{font-size:14px!important;line-height:36px!important;color:#333!important;font-weight:500}
.SMS_fixed_wrap .rolling_wrap a.sdh-hot{color:#139fcb!important;font-weight:800}
/* 원래 장바구니 칸은 처음부터 숨김 — 새 장바구니(#sdh-cart)는 JS 가 1줄 오른쪽에 붙임 */
.SMS_fixed_wrap .m_cart{display:none!important}
/* [상도] 2026-11-10 박기환 · 모바일 맨 위·아래 띠 개편 모양 규칙 · ops#69 · 끝 */



/* 띠 배너 css */
.promotionBanner { width:100%; /*height:34px; background-color:#d6ab89;*/ height:auto; color:#000; line-height:34px; font-size:13px; text-align:center;background:#99e7f7;}
.promotionBanner .bannerLink { display:block; }
.promotionBanner .btnClose { position:absolute; /*top:10px;*/ top:20px; right:15px; }
.promotionBanner .btnClose img { width:14px; }

.promotionBanner > a > img{width:100%}

/* */
.overflow_hd { width:100% !important; height:100% !important; overflow:hidden !important; }
.SMS_rolling_menu .swiper-slide {background:#fff;}
.MenuAllCon .SMS_All_tabmenu_content .tab_box .tabSub_box .tabSub_box_inner:nth-child(2) {padding-bottom:119px;} 
.MenuAllCon.noneSNS .SNSIconWrap{display:none !important;}

.tabSub_box_inner .icon { display:none !important; }

/*230131_블로그아이콘추가*/
#BasementContent .SNSIconWrap .SNSIcon_Nblog a{background:url('/design/sangdogagu/custom/img/sns_blog_m.png')no-repeat;background-size:cover;opacity:1;}
#BasementContent .SNSIconWrap{top:0px;}

/*260225_3D몬랙추가*/
#BasementContent .SNSIconWrap .SNSIcon_3DMR a{background:url('https://ofunis.com/homepage/3D_m.png')no-repeat;background-size:cover;opacity:1;}
#BasementContent .SNSIconWrap{top:0px;}


/*마이페이지_탭*/
.tab_mp {padding:10px 5px;}
.tab_mp > li > a{padding:0 10px;font-size:16px;height:45px;line-height:45px;font-weight:500;color:#333;}

#Basement{min-height:864px!important;}

/* 상도 · 2026-11-05 · 양지연 · 모바일 상단 검색창 누를 때 네모 테두리 없애기 · ops#69 17번 · 시작 */
#SMS_style .search_fixed_btn #smartskinSearch input#keywordInput:focus {
  border: none !important;
  background: transparent !important;
}
/* 상도 · 2026-11-05 · 양지연 · ops#69 17번 · 끝 */

/* 상도 · 2026-11-05 · 양지연 · 모바일 머리 두 줄(1줄 가운데 로고 · 2줄 넓은 검색창+장바구니·메뉴) · 돋보기 누르는 자리 넓힘(10번) · 0 크기 단추 숨김(11번) · ops#69 21번 · 시작 */
#SMS_style .SMS_fixed_inner { height: auto; line-height: normal; padding-bottom: 8px; position: relative; }
#SMS_style .SMS_fixed_inner .inner_wrap { height: auto; display: block; padding: 0 10px; }
#SMS_style .SMS_fixed_inner .inner_wrap .fixed_logo { width: auto; height: 46px; margin: 0 auto; top: 0; display: flex; align-items: center; justify-content: center; }
#SMS_style .SMS_fixed_inner .inner_wrap .fixed_logo a { display: flex; align-items: center; justify-content: center; width: auto; height: auto; }
#SMS_style .SMS_fixed_inner .fixed_logo img { max-width: 130px; }
#SMS_style .SMS_fixed_inner .inner_wrap .search_fixed_btn { position: relative; right: auto; margin-top: 0; width: calc(100% - 82px); height: 38px; border: 1.5px solid #222; border-radius: 19px; padding: 0 2px 0 14px; display: flex; align-items: center; box-sizing: border-box; }
#SMS_style .SMS_fixed_inner .search_fixed_btn #smartskinSearch { flex: 1; min-width: 0; height: 100%; position: relative; }
#SMS_style .SMS_fixed_inner .search_fixed_btn #smartskinSearch input#keywordInput { position: static; width: 100%; height: 100%; line-height: normal; border: none !important; background: transparent !important; font-size: 14px; padding: 0; }
#SMS_style .SMS_fixed_inner .search_fixed_btn .search_btn { display: none; }
#SMS_style .SMS_fixed_inner .inner_wrap .search_fixed_btn img { float: none; width: 18px; margin: 0; padding: 9px; box-sizing: content-box; }
#SMS_style .SMS_fixed_inner .small_icon { top: auto; bottom: 10px; }
#SMS_style .SMS_fixed_inner .m_cart { right: 42px; }
#SMS_style .SMS_fixed_inner .m_menu { right: 6px; }
/* 상도 · 2026-11-05 · 양지연 · ops#69 21번 · 끝 */

/* 상도 · 2026-11-05 · 양지연 · 모바일 검색창을 누르면 펼쳐지던 추천 문구 칸(SMS_MainSearch) 숨김 · ops#69 20번 · 시작 */
#SMS_style .SMS_MainSearch, .SMS_MainSearch { display: none !important; }
/* 상도 · 2026-11-05 · 양지연 · ops#69 20번 · 끝 */

/* 상도 · 2026-11-05 · 양지연 · 모바일 맨 위 메뉴 줄을 옆으로 미는 대신 4칸 × 3줄 표로(18번 합침) · ops#69 23번 · 시작 */
.rolling_wrap { height: auto !important; }
.SMS_rolling_menu { overflow: visible !important; height: auto !important; }
.SMS_rolling_menu .swiper-wrapper { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; transform: none !important; width: 100% !important; height: auto !important; }
.SMS_rolling_menu .swiper-slide { width: auto !important; height: 38px !important; margin: 0 !important; text-align: center !important; border-bottom: 1px solid #eee; box-sizing: border-box; }
.SMS_rolling_menu .swiper-slide-duplicate { display: none !important; }
.SMS_rolling_menu .swiper-slide a { display: block !important; font-size: 14px !important; line-height: 38px !important; white-space: nowrap; }
/* 상도 · 2026-11-05 · 양지연 · ops#69 23번 · 끝 */

/* 상도 · 2026-11-05 · 양지연 · 메뉴 2줄(몬스터랙·그로잉·모던하임·게이밍책상) 밑줄 짚기 · ops#69 24번 · 시작 */
.SMS_rolling_menu { position: relative !important; }
#sd-menu-bar { position: absolute; left: 0; top: 0; width: 0; height: 2px; background: #ee231c; border-radius: 2px; transition: left .6s ease, top .6s ease, width .6s ease; pointer-events: none; z-index: 5; }
/* 상도 · 2026-11-05 · 양지연 · ops#69 24번 · 끝 */

/* BASIC css end */