/*all*/
a { color: inherit; }
.index-wrap { box-sizing: border-box; padding: 0 .8rem; position: relative; }
.clear0::after { content: ''; display: block; clear: both; }
i { background: none; }
html, body { box-sizing: border-box; font-size: 1em; -webkit-text-size-adjust: none; min-height: 100%; background: #fff; }
#page-box, #nav-box { font-family: 'PT Sans', Arial, sans-serif; }
/*top-text*/
.diy-top-text { color: #444; font-size: .88em; line-height: 3rem; height: 3rem; overflow: hidden; text-overflow: ellipsis; max-width: 15rem; text-transform: capitalize; white-space: nowrap; }
#page-box{cursor: pointer;}
#page-box .top-bar { background-color: #E7E1D8; padding: 0 1em; overflow: hidden; }
#page-box .top-bar .cart { float: right; background: #F2EEE8; padding: 0 .8em; line-height: 3em; }
#page-box .top-bar .cart i { background: none; margin-right: 5px; }
#page-box .top-bar .cart a { color: #888; }
/*top_box*/
#top_box { height: 4rem; padding: 0 2rem; box-sizing: border-box; line-height: 2rem; z-index: 99; left: 0; top: 0; width: 100%; background: none; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-around; justify-content: space-around; border-top: 1px solid #e3d5ba; border-bottom: 1px solid #e3d5ba; margin-top: 3px; }
#top_box > * { color: #f07f5d; height: 3rem; width: 3rem; text-align: center; line-height: 3rem; font-size: 1rem !important; margin: auto; bottom: 0; cursor: pointer; background: none; border: 0; }
#top_box i.menu-switch { left: .4rem; top: 0; }
#top_box a.cart { right: .44em; top: 0; }
#top_box i.search-close { font-weight: 700; }
#page-box .logo { height: 8rem; overflow: hidden; position: relative; z-index: 0; text-align: center; margin: 0 auto; border-bottom: 1px solid #e3d5ba; }
#page-box .logo img { display: inline-block; max-height: 100%; max-width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; }
/*nav box*/
body.menu-show { background-color: #000; transition: all .4s; }
#nav-box { position: fixed; z-index: 999999; background: rgba(54, 54, 54, 0.8); left: -100%; top: 0; width: 80%; height: 100%; overflow-y: scroll; transition: all .4s; }
body.menu-show #nav-box { left: 0; box-shadow: 0 2px 4px 0 rgba(0,0,0,.2); }
#nav-box .logo { position: relative; margin-right: 5rem; z-index: 0; height: 5rem; overflow: hidden; }
#nav-box .logo img { max-width: 100%; max-height: 90%; display: block; position: absolute; margin: auto; left: 0; right: 0; top: 0; bottom: 0; }
#nav-box .menu-close { cursor: pointer; position: absolute; right: 0; width: 5rem; left: auto; height: 5rem; top: 0; z-index: 1; }
#nav-box .menu-close i { background: none; display: inline-block; width: 5rem; font-size: 2rem; font-weight: 700; line-height: 5rem; text-align: center; }
#nav-box .menu-close:hover { color: #000; }
#page-box { left: 0; transition: all .4s; opacity: 1; background: none; box-sizing: border-box; padding: .8rem; }
body.menu-show #page-box { position: fixed; left: 80%; z-index: 0; top: 0; }
/*nav*/
.page-menu .menu-box { box-sizing: border-box; margin: 0; color: #99855F; }
.page-menu .menu-box h4.tit { border: 0; font-size: 1rem; background: none; line-height: 3.2rem; position: relative; text-align: left; text-transform: uppercase; font-weight: 400; display: none; }
.page-menu ul.mainnav { background: none; line-height: 3.2rem; position: relative; overflow: hidden; border: 1px solid #e3d5ba; border-top: 0; border-bottom: 0; }
.page-menu ul.mainnav .mli { background: #fff; color: #99855F; border-bottom: 1px solid #e3d5ba; }
.page-menu li.bg { height: 1rem; background: #383442; }
.page-menu li.mli > a { position: relative; color: inherit; background: none; display: block; cursor: pointer; transition: .3s all; font-size: .9rem; line-height: 3.4rem; font-weight: 400; text-overflow: ellipsis; overflow: hidden; text-transform: uppercase; white-space: nowrap; text-indent: .8rem; }

.page-menu li.mli .crt { right: 2.4rem; font-size: .88rem; top: 0; bottom: 0; margin: auto; text-align: right; display: inline-block; text-transform: uppercase; font-style: normal; transition: .3s all; font-weight: 400; color: inherit; position: absolute; line-height: 1rem; height: 1rem; z-index: 3; }
.page-menu li.mli > a i.i { position: absolute; top: 0; right: 0; bottom: 0; margin: auto; height: 2rem; width: 2rem; display: block; line-height: 2rem; transition: all .4s; z-index: 2; background: #fff; }
.page-menu li.mli > a i.i::before { position: absolute; content: ''; background: none; width: 0; height: 0; margin: auto; top: 0; bottom: 0; left: 0; right: 0; border-left: .3rem solid transparent; border-right: .3rem solid transparent; border-top: .3rem solid #99855f; }
.page-menu li.mli.on > a i.i::before { border-top: 0; border-bottom: .3rem solid #99855f; }
.page-menu li.mli.d>a { font-size: 1em; font-weight: 400; color: #f3f3f3; }
.page-menu .menu-box .son { line-height: 3rem; display: none; }
.page-menu .menu-box .son li { border-top: 1px solid #e3d5ba; }
.page-menu .menu-box .son a { display: block; color: #99855f; cursor: pointer; overflow: hidden; position: relative; text-transform: uppercase; white-space: nowrap; text-overflow: ellipsis; text-indent: 1.6rem; font-size: .8rem; }
.page-menu .menu-box .son a:hover { opacity: .8; }
.page-menu .menu-box .son a b { float: left; padding-left: .8em; }
.page-menu .menu-box .son a span { float: right; padding-right: .8em; }
/*login*/
#nav-box .login { }
#nav-box .login a { display: block; color: #000009; font-weight: 400; text-transform: capitalize; line-height: 3.6rem; padding: 0 .8em; font-size: 1em; margin: 0; text-indent: .8rem; }
/*banner*/
.top-banner-box { position: relative; z-index: -2; }
.banner-box { position: fixed; z-index: 0; top: 0; left: 0; width: 100%; height: 100vh; padding-bottom: 6rem; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#banner { overflow: hidden; position: relative; z-index: 0; height: auto; margin: .8rem 0; }
#banner .swiper-pagination { display: none; }
#banner .swiper-slide { height: 100%; -webkit-background-size: cover; background-size: cover; background-position: center center; background-repeat: no-repeat; }
#banner .img { width: 100%; display: block; }
#banner .cont { position: absolute; top: 50%; left: 8%; color: #fff; width: 80%; overflow: hidden; -webkit-transform: translateY(-50%); transform: translateY(-50%);/* transition: all .6s .6s; opacity: 0;*/ right: 8%; margin: auto; text-align: center; padding: 0; height: auto; line-height: 2em; }
#banner .swiper-slide-active .cont { opacity: 1; }
#banner h4 { line-height: 2rem; margin-bottom: .8rem; font-size: 1.08rem; color: #fff; text-transform: capitalize; display: inline; }
#banner p { font-size: 1.1rem; line-height: 1.9rem; color: #fff; display: none; }
#banner .swiper-pagination-bullet { /* background: rgba(255,255,255,.7);  border-radius: 0; */ width: .5em; height: .5em; background: none; border: 3px solid #fff; opacity: .8; }
#banner .swiper-pagination-bullet-active { background: #fff; }
#banner .iconfont { position: absolute; z-index: 2; top: 50%; height: 3rem; line-height: 3rem; width: 2rem; display: block; text-align: center; font-size: 2rem; color: #fff; margin-top: -1.5rem; opacity: .9; cursor: pointer; background: rgba(255,255,255,.1); }
#banner .iconfont.prev { left: 0; }
#banner .iconfont.next { right: 0; }
#banner .swiper-pagination-progressbar-fill { background: #A16C41 }
#banner .more { display: none; color: #fff; background: #BA9B4C; width: 10em; margin: 1em auto 0; line-height: 2.6em; text-transform: uppercase; border-radius: 3px; }
/*#body_box*/
#body_box { }
.index_default { position: relative; z-index: 1; padding: 0 !important; box-sizing: border-box; min-height: 20vh; }
.index-page-box { display: none; }
.index-page-box.on { display: block; }
#carousel .touchcarousel-container { overflow: hidden; }
#carousel .touchcarousel-item > a { height: 36rem; display: block; background-size: cover; background-repeat: no-repeat; background-position: center; }
.index_default #carousel .tc-paging-item { background-color: #fff; opacity: .7; }
.index_default #carousel .tc-paging-item.current { background-color: #a39161; }
/*search*/
.search-box { background: none; position: relative; top: 0; height: auto; left: 0; z-index: 2; border: 1px solid #e3d5ba; border-top: 0; padding: 2rem; }
.search-box .searchform { position: relative; height: 2.2rem; z-index: 0; width: auto; border: 1px solid #e3d5ba; border-radius: 4px; }
.search-box .search_input { height: 2.2rem; box-sizing: border-box; font-size: 1rem; color: #303030; background: none; text-indent: 0; padding: 0 5.8rem 0 .8rem; position: absolute; top: 0; bottom: 0; margin: auto; width: 100%; border: 0; -webkit-text-size-adjust: none; }
.search-box #btn-autocomplete2 { position: absolute; right: 1px; top: 0; height: 3.4rem; border: 0; margin: auto; padding: 0; background: none; line-height: 3.4rem; text-align: center; width: 3.4rem; bottom: 0; color: #fff02d; }
.search-box .btn_search { position: absolute; top: 0px; width: 5rem; background: #6DCBD5; color: #FFF; font-weight: 700; cursor: pointer; font-size: 1rem; padding: 0; height: 100%; border: 0; bottom: 0; margin: auto; right: 0; transition: .4s all; }
.search-box .btn_search:hover { background: #319FAB; }
.search-box .search-close { display: none; }
/*copyright*/

#nav-box .copyright { padding: 1rem 1rem 4rem 1rem; box-sizing: border-box; color: #888; text-align: center; line-height: 2rem; }
/*ad*/
.home-diy-ad-box { }
.home-diy-ad-box.ad1 { margin-bottom: 1em; }
.home-diy-ad-box.ad1 .img { }
.home-diy-ad-box.ad1 .img img { width: 100%; display: block; }
/*index products */
.index_default .tit { background: none; line-height: 3.2rem; position: relative; text-align: center; text-transform: uppercase; font-weight: 400; font-size: 1rem; color: #99855f; border-top: 1px solid #e3d5ba; border-bottom: 1px solid #e3d5ba; margin-bottom: 1rem; }
.index_default .tit a { color: #99855f; font-size: 1rem; }
.index_default .tit::after { /*position: absolute; content: ''; background: #aaa; height: 1px; width: 4em; left: 50%; margin-left: -2em; bottom: 2%;*/ }
.home-pro-box { position: relative; width: 100%; overflow: hidden; text-align: center; margin: 0; box-sizing: border-box; z-index: 1; }
.home-pro-box .pro-tit { text-align: center; position: relative; line-height: 3.2rem; }
.home-pro-box .pro-tit a { text-transform: uppercase; color: #222; text-align: center; display: inline-block; padding: 0 2rem; position: relative; }
.home-pro-box .pro-tit a::after { position: absolute; content: ''; height: 2px; background: #222; width: 40%; bottom: .4em; left: 0; z-index: 1; right: 0; margin: auto; display: none; }
.home-pro-box .pro-box { position: relative; height: auto; }
.home-pro-box .pro-box .box { overflow: hidden; position: relative; }
.home-pro-box .pro-box .pro-list { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; -webkit-justify-content: space-between; justify-content: space-between; }
.home-pro-box .pro-box .pro-list > li { position: relative; z-index: 0; height: auto; box-sizing: border-box; padding: .8rem; color: #99855f; width: 100%; margin-bottom: 1rem; border: 1px solid #f0ede9; }
.home-pro-box .pro-box .pro-list > li .pic { display: block; position: relative; width: 100%; overflow: hidden; height: 0; box-sizing: border-box; z-index: 1; padding-bottom: 100%; }
.home-pro-box .pro-box .pro-list > li .pic img { max-height: 100%; max-width: 100%; left: 0; bottom: 0; display: block; position: absolute; right: 0; top: 0; margin: auto; }
.home-pro-box .pro-box .pro-list > li .pro_content { position: relative; text-align: center; line-height: 1.8em; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; font-weight: 400; display: block; z-index: 0; margin: .2em; font-size: .9rem; }
.home-pro-box .pro-box .pro-list > li .name:hover { opacity: .8; }
.home-pro-box .pro-box .pro-list > li .name { display: block; font-size: inherit; font-weight: 400; text-transform: capitalize; line-height: 1.5rem; overflow: hidden; color: #99855f; transition: .4s all; }
.home-pro-box .pro-box .pro-list > li .sold_out_box { color: #999; font-size: .8rem; position: absolute; top: 50%; bottom: auto; margin: auto; left: 0; right: 0; text-align: center; width: 54%; background: #f9f9f9; text-transform: uppercase; opacity: .94; z-index: 3; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); padding: .4em; }
.home-pro-box .pro-box .pro-list > li .price { font-size: inherit; color: #f07f5d; font-weight: 400; }
.home-pro-box .pro-box .pro-list > li .oldprice { margin-left: 0; font-size: 12px; color: #aaa; text-decoration: line-through; display: block; font-weight: 400; line-height: 1.5em; }
.home-pro-box .pro-box .pro-list > li .pro-tips { position: absolute; top: 0; left: 0; z-index: 9; right: 0; height: 0; }
.home-pro-box .pro-box .time-box { right: 0; top: 0; padding: 0; line-height: 2.5rem; color: #000; font-size: .8rem; width: auto; z-index: 2; }
.home-pro-box .pro-box .pro-list span.discount-timer { background: none; text-indent: 0; font-weight: 400; display: block; font-size: inherit; padding: 0; line-height: inherit; color: inherit; }
.home-pro-box .pro-tips .discount { background: #f07f5d; position: absolute; left: 1rem; top: 1rem; margin: 0; z-index: 0; color: #fff; line-height: 1.1em; font-size: 1em; display: block; width: 3em; height: 3em; box-sizing: border-box; padding: 0.4em; border-radius: 4em; }
.home-pro-box .pro-tips .discount p { white-space: nowrap; font-weight: 400; font-size: .8em; }
.home-pro-box .pro-tips .discount em { font-style: normal }
.home-pro-box .pro-tips .discount .sharp { width: 100%; left: 0; top: auto; bottom: -1em; height: 1em; overflow: hidden; position: absolute; display: none; }
.home-pro-box .pro-tips .discount .sharp::after { content: ''; position: absolute; width: 0; border-right: 12em solid transparent; border-left: 12em solid transparent; border-top: 4em solid #DA2929; left: -20000%; right: -20000%; margin: auto; bottom: 0; height: 0; }
.home-pro-box .pro-box .pro-list > li .pro-tips .newin { background: rgba(255,255,255,.08); position: absolute; right: 0; top: 0; z-index: 0; color: #DA2929; padding: 0 .4rem; text-transform: uppercase; font-size: .8rem; border-radius: 0; line-height: 1.5rem; display: none; }
.home-pro-box .swiper-pagination-bullet-active { opacity: .8; background: #333; }
.home-pro-box .swiper-pagination-fraction { top: 0; left: 0; width: 100%; height: 2em; line-height: 2em; }
.home-pro-box .view-box a { background: #517FA4; color: #fff; border-radius: 5px; padding: 0px 30px; display: inline-block; text-transform: uppercase; line-height: 36px; }
.home-pro-box .view-box a:hover { opacity: .7; color: #859BB1; }
.home-pro-box .pro-box .iconfont { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; cursor: pointer; font-weight: 700; color: #BA9B4C; display: none; }
.home-pro-box .pro-box .iconfont.prev { left: 0; }
.home-pro-box .pro-box .iconfont.next { right: 0; }
.home-pro-box .pro-box .iconfont.swiper-button-disabled { opacity: .1; cursor: default; }
/*#bottom_box*/
#bottom_box { padding: 0; background: none; }
#bottom_box h4.tit { background: none; font-size: .9rem; font-weight: 400; text-transform: uppercase; color: #99855f; line-height: 2rem; padding: .8rem; border-bottom: 1px solid #e3d5ba; margin-bottom: .8rem; text-align: center; }
/*newsletter-box*/
.newsletter-box { box-sizing: border-box; color: #99855f; padding: .8rem; }
.newsletterform { text-align: center; position: relative; }
.newsletterform #email { width: 100%; height: 3.0rem; line-height: 1em; font-size: .88rem; color: #99855f; background: none; padding: 0; box-sizing: border-box; transition: all .4s; text-indent: 0; text-align: center; border: 0; border-bottom: 1px solid #e3d5ba; }
.newsletterform .newsletter_btn { position: static; background: #6dcbd5; font-size: .9rem; cursor: pointer; text-align: center; text-indent: 0; color: #fff; text-transform: uppercase; box-sizing: border-box; padding: 0.6rem; border: 0; font-weight: 400; width: 8rem; border-radius: 4px; margin: 1em auto auto; box-shadow: 0 -2px 0 rgba(0,0,0,.08) inset; }
.newsletterform .newsletter_btn:hover { background: #319fab; }
/*copyright*/
#bottom_box .copyright { color: #99855f; padding: 2em 2em 3em; }
/*NEWS*/
#news { box-sizing: border-box; z-index: 1; overflow: hidden; position: relative; }
#news h3.tit { position: relative; line-height: 3.6rem; background: none; color: #fff; border-top: 1px solid #e3d5ba; border-bottom: 1px solid #e3d5ba; margin-bottom: 1rem; }
#news .news_con { overflow: hidden; display: block; }
#news li { float: none; overflow: hidden; position: relative; height: auto; text-align: left; box-sizing: border-box; }
#news li:not(:last-child) { margin-bottom: 1.6rem; }
#news .bg { overflow: hidden; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; position: relative; display: block; height: 100vw; }
/*#news li:hover .bg { opacity: .9; }*/
#news .cont { overflow: hidden; position: relative; bottom: 0; box-sizing: border-box; color: #99855f; top: 0; padding: .5rem; text-align: center; }
#news li:last-child .cont { border: 0; }
#news .cont .title { overflow: hidden; }
#news .time { line-height: 2rem; color: #99855f; display: block; position: relative; font-style: normal; font-weight: 400; font-size: .9rem; }
#news .title a { line-height: 2.4em; font-size: 1em; display: block; font-weight: 700; text-transform: capitalize; color: #f07f5d; height: 2.4em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
#news .title a:hover { opacity: .8; }
#news p { line-height: 1.5rem; font-size: .88rem; }
/*currency*/
.currency-box { box-sizing: border-box; border-bottom: 1px solid #E3D5BA; color: #f07f5d; }
.currency-box h4 { display: none; }
.currency-box .select { position: relative; border: 0; overflow: hidden; z-index: 1; background: none; margin: 0 auto; border-radius: 0; color: inherit; width: 100%; font-size: 3rem; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; height: 3rem; }
.currency-box #cursel { text-indent: 0; font-size: .9rem; color: inherit; padding: 0; box-sizing: border-box; border: 0; transition: all .4s; cursor: pointer; background: none; text-align: center; height: auto; width: auto; line-height: inherit; }
.currency-box .select::after { display: none; }
.currency-box .select > i { position: static; display: inline; font-size: .9rem; padding: 2px 0 0 2px; }
/*bottom-nav*/
.bottom-nav { padding: 0 .4rem; }
.bottom-nav ul { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-flex-flow: row wrap; flex-flow: row wrap; font-size: .86rem; }
.bottom-nav li { height: 2.6rem; line-height: 2.6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: .2rem .3rem; }
.bottom-nav a { font-size: inherit; color: #f07f5d; font-weight: 400; padding: 0 .4rem; line-height: inherit; }
.bottom-nav a:hover { opacity: .8; }