/* BASIC css start */
.wrapper {padding:0 15px; box-sizing:border-box; width:100%; position:relative; }
.swiper {overflow:hidden; position:relative}
.dn {display:none;}
button {background:none; border:none; }
img {max-width:100%}

/* ÃÖ»ó´Ü ¹è³Ê */
#headerBanner.TBI{ position:relative; width:100%; height:5%; overflow:hidden;background-color:#2f3529; }
#headerBanner {position:relative; width:100%; height:34px; overflow:hidden;background-color:#2f3529; z-index:999;/* margin-bottom:10px; */}
#headerBanner .hdBannerTxt { position:relative; width:100%; height:34px }
#headerBanner .hdBannerTxt a { display:block;color:#fff;line-height:34px;text-align:center; }
#headerBanner .hdBannerImg { position: relative; width: 100%;}
#headerBanner .topbanner{width:100%;}
#headerBanner .bnClose { position:absolute; top:0; right:0 }
#headerBanner .bnClose a { display:block; width:33px; height:33px; font-size:22px; text-align:center; line-height:35px;color:#fff; }

.header_box {position:fixed; left:0; width:100%; display:block; text-align:center; box-sizing:border-box;z-index:102; background:#fff;}
.header_box .animated {  }
.header_box .wrapper {text-align:left; height:100%;padding:10px 16px 10px; box-sizing:border-box; }
.header_box .menu_btn {position:absolute; right:15px; top:calc(50% - 8px);  width:22px; height:16px; text-align:center;  }
.header_box .menu_btn span { display: block; width:100%; height: 2px; background:#000; margin-bottom:4px; }
.header_box .menu_btn span:last-child {margin-bottom:0}
.header_box .logo {display:inline-block;}
.header_box .logo img {height:37px}
.header_box .logo > span {display:inline-block; height:37px; line-height:37px; font-size:19px; }
.header_box .search_show {width: 23px;position:absolute;right: 46px;top: calc(50% - 11px);}
.header_box .basket_btn {position:absolute;top: calc(50% - 17px);right:75px;width: 32px;}
.header_box .basket_btn .ic_basket { display:inline-block; position:relative; }
.header_box .basket_btn .ic_basket .count {position:absolute; bottom:-1px; right:-2px; width:16px; height:16px; border-radius:100%; background:#000; color:#fff; font-size:8px; text-align:center; line-height:16px; }

.scroll_menu_box {background:#fff; padding-right:42px; position:relative; display:none !important;  }
.scroll_menu_list li {width:auto; padding:0 14px; text-align:center; height:42px; }
.scroll_menu_list li a { display:inline-block; height:100%; font-size:13px; line-height:42px; }
.scroll_menu_box .menu_more { position:absolute; top:0; right:0; width:42px; height:42px; text-align:center;   }
.scroll_menu_box .menu_more img {display:inline-block; }
.hide_menu_box { position: absolute; width: 100%; top: 42px; left: 0; background: #fff; border-bottom: 1px solid #f0f0f0; padding: 24px 0; border-top: 1px solid #f0f0f0; display:none; }
.hide_menu_box ul li {display:inline-block;width: calc(25% - 3px); vertical-align:top;padding: 0px 7px; box-sizing:border-box; margin-bottom:24px;}
.hide_menu_box ul li:nth-last-child(-n+4) {margin-bottom:0} 

.search_area_box {display:none; position:fixed; top:0; left:0; width: 100%; height:100%; box-sizing:border-box; background:rgba(0,0,0,0.6); padding-top:85px; z-index:10 }
.search_area_box .search_area {position:relative; display:inline-block; width:100%; padding:17px; box-sizing:border-box; }
.search_area_box .search_area input {border-radius:30px; width:100%; box-sizing:border-box; padding:0 48px 0 16px  }
.search_area_box .search_btn {position:absolute; top:calc(50% - 11px); right:32px; width:22px}

.animated { -webkit-animation-duration: .1s; animation-duration: .1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } 

#header.slideDown .animated{ -webkit-animation-name:slideDown; animation-name:slideDown;  } 
#header.headroom--not-top .animated { -webkit-animation-name:slideUp; animation-name:slideUp; } 
#header.headroom--not-top .header_box { top:0; background:rgba(255,255,255,0.7)}
#header .animated {height:32px; }

#header.slideUp .hide_menu_box {display:none !important; }


/* SlideDown for headroom */ 
@-webkit-keyframes slideDown{ 
	0% {height:0px} 
	100% {height:32px } 
} 
@keyframes slideDown{ 
	0% {height:0} 
	100% {height:32px;} 
} 

/* SlideUp for headroom */ 
@-webkit-keyframes slideUp{ 
	0% {height:32px} 
	100% {height:0;} 
} 
@keyframes slideUp{ 
	0% {height:32px} 
	100% {height:0} 
} 

.menu_box {position:fixed; top:0; left:-100%; transition: all 0.3s; animation-direction: reverse; z-index:1001; -webkit-overflow-scrolling: touch; width:100%; height:100%; box-sizing:border-box; background:#fff; padding:0px 0 32px; overflow-y:auto;  }
.menu_box.active {left:0; }
.menu_hd_box {padding-top:32px; margin: 0 0 40px 34px;  position:relative;}
.menu_logo {margin-bottom:60px }
.menu_logo > span {display:inline-block; height:37px; line-height:37px; font-size:19px; }
.menu_closed {position:absolute; top:23px; right:0px; padding:13px; font-size:22px; }
.menu_closed > span {font-weight:bold; }
.menu_login_box {position:relative; }
.menu_login_box li {margin-bottom:10px; }
.menu_login_box li:nth-child(1){margin-bottom:24px}
.menu_login_box li:last-child {margin-bottom:0}
.menu_login_box li.cart {position:absolute; top:0; left:140px; }
.side_menu .menu_list {margin-bottom:40px; }    
.side_menu .menu_list:last-child {margin-bottom:0}
.side_menu .menu_list > li {margin-bottom:4px; }
.side_menu .menu_list > li:last-child {margin-bottom:0px; }
.side_menu > ul > li a {display:block; padding:3px 94px 3px 34px; position:relative;}
.side_menu > ul > li.has_sub { position:relative;}
.side_menu > ul > li.has_sub .open_sub { background:url('/design/danilove/renewSkin/mo/images/common/ic_arrow_down.png')no-repeat center left 15px/8px auto}
.side_menu > ul > li.has_sub.on .open_sub { background-image:url('/design/danilove/renewSkin/mo/images/common/ic_arrow_up_red.png'); color:#cc2c2c}
.side_menu > ul > li.has_sub .view {position:absolute; top:3px; right:40px; border:1px solid #d5d5d5; font-size:10px; height:18px; line-height:18px; border-radius:3px; padding:0 5px; box-sizing:border-box;  }
.side_menu > ul > li.has_sub .sub_menu_list {display:none;margin-bottom:10px }

.side_info_list  { margin-left:34px;}
.side_info_list > li {margin-bottom:24px; line-height:1.6 }
.side_info_list > li:last-child {margin-bottom:0px; }
.side_info_list > li > a {padding:0 !important}



#sfsnapfit_main img {bottom:221px !important; height: auto !important; right:11px !important; }

/* BASIC css end */