/* 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:#000; }
#headerBanner {position:relative; width:100%; height:34px; overflow:hidden;background-color:#000; z-index:999; margin-bottom:10px; }
#headerBanner .hdBannerTxt { position:relative; width:100%; height:34px }
#headerBanner .hdBannerTxt a { display:block;color:#9be7f4;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 { display:block; width:100%; text-align:center; box-sizing:border-box;; z-index:100; background:rgba(255,255,255,0.5); }
.header_inner {height:100%; padding:14px 0; height:46px; box-sizing:border-box; }
.header_left {position:absolute; left:15px; top:calc(50% - 11px);  }
.header_left .menu_open {display:inline-block; margin-right:10px; width:22px;  }
.header_left .cart {display:inline-block;width:22px; position:relative }
.header_left .cart sup {position:absolute; bottom:-3px; right:-6px; width:16px; height:16px; border-radius:100%; background:#c70c0d; color:#fff; font-size:8px; text-align:center; line-height:16px; }
.header_left .isBack img {width:22px;}
.header_logo {text-align:center; }
.header_logo a {display:inline-block; }
.header_logo img {height:18px; }
.header_right {position:absolute; right:15px; top:calc(50% - 11px);}
.header_right a {display:inline-block; margin-right:8px; }
.header_right a:last-child {margin-right:0} 
.header_right a img {width:22px; }
.sub_header_inner {height:100%; padding:14px 0; height:46px; box-sizing:border-box; }

.header_box .header_inner  { display:none }
.header_box .sub_header_inner  {display:block; position:relative }
.header_box .sub_header_inner .header_logo {display:none;}
.side_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:#ece2d8; padding:32px 30px; overflow-y:auto;  }
.side_box.active {left:0; }
.side_tt_box {text-align:center; position:relative; }
.side_logo a {display:inline-block; width:177px; }
.side_close {display:inline-block; width:20px; position:absolute; top:0; right:0}
.side_close img {display:inline-block}
.side_user {margin-top:15px; }
.side_user p {margin-bottom:10px;}
.side_user a {display:inline-block;vertical-align: top;width: calc(50% - 5px); height:36px; line-height:36px; border-radius:30px; font-size:14px; color:#363636; background:#fff; margin-right:4px}
.side_user a:last-child {margin-right:0}
.side_user a.usr_login {background:#958473; color:#fff}

.side_info {display: flex; align-items: center; justify-content: space-around; margin-top:24px; box-sizing:border-box; padding:0 20px  }
.side_info li {text-align:center; width:33.33%; }
.side_info li span {display:block; }
.side_info li .icon img {height:26px; }
.side_info li .txt {margin-top:8px; font-size:12px; }

.side_menu_box {margin-top:26px; }
.side_menu_con { background:#fff; border-radius:10px; box-shadow:0px 0px 3px 2px rgb(0 0 0 / 4%); box-sizing:border-box; margin-bottom:14px; padding:24px  }
.side_menu_con:last-child { margin-bottom:0  }
.side_menu_con dt {font-weight:500; font-size:16px; position:relative;  }
.side_menu_con dt .arrow { display:inline-block; width:18px; position:absolute; right:0; top:calc(50% - 9px); transition: all 0.3s; }
.side_menu_con.hide dt .arrow {transform: rotate( -180deg ); } 
.side_menu_con dd {display:block; margin-top:28px; }
.side_menu_list li {display:inline-block; width:calc(33.33% - 2px); margin-bottom:24px;  }
.side_menu_list li a {display:inline-block; font-size:14px; color:#808080; }
.side_menu_list li a.point { font-weight:600;}
.side_menu_list li:last-child {margin-bottom:0;}
.side_menu_list.type02 {padding:0 34px}
.side_menu_list.type02 li { width:calc(50% - 2px)}
.side_menu_list.type02 li a {color:#000;  }

#search_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:46px; z-index:10 }
#search_box .search_inner {position:relative; display:inline-block; width:100%; }
#search_box .btn_search {position:absolute; top:calc(50% - 11px); right:32px; width:22px}
#search_box .searchBox {background:#ece2d8; padding:17px; }
#search_box .searchBox input {border-radius:30px; width:100%; box-sizing:border-box; padding:0 48px 0 16px  }

.sub_menu_box {display:none; position:fixed; top:46px; left:0; width: 100%; height:calc(100% - 46px); box-sizing:border-box; background:rgba(0,0,0,0.6);; z-index:10  }
.sub_menu_list {background:#efeae6; text-align:center; padding:24px 0 }
.sub_menu_list li {margin-bottom:16px; }
.sub_menu_list li a {display:inline-block; font-size:14px; padding:0 10px; color:#000 }
.sub_menu_list li:last-child {margin-bottom:0px; }

#header.headroom--not-top .header_box {position:fixed; left:0; top:0;}


/*.animated { -webkit-animation-duration: .5s; animation-duration: .5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } 
#header.slideDown .animated{ -webkit-animation-name:slideDown; animation-name:slideDown; } 
#header.slideUp .animated { -webkit-animation-name:slideUp; animation-name:slideUp; } 
#header.slideDown .animated{ -webkit-animation-name:unset; animation-name:unset; } 
#header.slideUp .animated{ -webkit-animation-name:unset; animation-name:unset; } */




/* SlideDown for headroom */ 
@-webkit-keyframes slideDown{ 
	0% {-webkit-transform:translateY(-100%)} 
	100% {-webkit-transform:translateY(0)} 
} 
@keyframes slideDown{ 
	0% {transform:translateY(-100%)} 
	100% {transform:translateY(0)} 
} 

/* SlideUp for headroom */ 
@-webkit-keyframes slideUp{ 
	0% {-webkit-transform:translateY(0)} 
	100% {-webkit-transform:translateY(-100%)} 
} 
@keyframes slideUp{ 
	0% {transform:translateY(0)} 
	100% {transform:translateY(-100%)} 
} 




/* BASIC css end */

