/*h5兼容*/
html {
font-size: 16px;
}
@media only screen and (min-width: 320px) {
html {
font-size: 15.147px !important;
}
}
@media only screen and (min-width: 375px) {
html {
font-size:16px !important;
}
}
@media only screen and (min-width: 400px) {
html {
font-size: 17.06666px !important;
}
}
@media only screen and (min-width: 414px) {
html {
font-size: 17.664px !important;
}
}
@media only screen and (min-width: 480px) {
html {
font-size: 20.48px !important;
}
}
*{font-family: "苹方","DINPro-Bold";-webkit-tap-highlight-color: rgba(0, 0, 0, 0); margin:0; padding:0; border: none; outline: none;list-style: none; text-decoration: none; vertical-align: middle;}
input[type=button], input[type=submit], input[type=file], button {-webkit-tap-highlight-color: rgba(0, 0, 0, 0); cursor: pointer; -webkit-appearance: none; outline: none; }
input{ -webkit-appearance: none;}
textarea{-webkit-appearance: none;appearance: none;}
select{appearance:none; -moz-appearance:none;-webkit-appearance:none;}
img{height:auto;display:inline-block;}
a{display:block;height:auto;cursor:pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
html{ width:100%; height:100%;}
body{ width:100%; height:100%; margin:auto; background-color:#f5f7f9;}
.dx-app{display: block;}
.dx-pc{display: none;}
/*商品库*/
.dxwxjl-shop{width: 100%;background-color: #fff;padding-bottom: 0.5rem; padding-top: 0.5rem;}
.dxwxjl-shop a{color: #fff;display: inline-block;display: flex;align-items: center;justify-content: center; width: 100%;}
.dxwxjl-shop div{ margin: auto; width: 88%;font-size: 0.9375rem; background-color: #09ba07;height: 2.5rem;border-radius: 0.3125rem;color:#fff;display: flex;align-items: center;justify-content: center;}
.dxwxjl-shop img{ width: 1.4rem; height: 1.4rem; margin-right: 2px;}
.dxwxjl-shopa{background-color: #fff; padding-bottom:0.625rem; border-bottom: 1px solid #eee;}
.dxwxjl-shopa input{ width: 70%;color: #222;font-size: 0.9375rem;background: none;}
.dxwxjl-shopa div{ margin: auto; width: 88%;font-size: 0.8125rem; background-color: #f4f4f4;height: 2.5rem;border-radius: 0.3125rem;color:#999;display: flex;align-items: center;justify-content: left;}
.dxwxjl-shopa img{ wwidth: 1.4rem; height: 1.4rem; margin-right: 4px; margin-left:1rem;}
.dxwxjl-shs{ width: 100%; height: 100%;position: relative; }
.dxwvjl-posi{position: fixed;width: 100%;z-index: 5; top: 3.4375rem;}
.dxwxjl-shle{position: fixed;height: 100%; border-top: 1px solid #eee; box-sizing: border-box; overflow:auto; padding-bottom: 5rem; left: 0;top: 10rem;z-index: 5; width: 28%;}
.dxwxjl-shle div.active{ float: left; width: 100%;font-size: 0.9375rem; background-color: #fff;color: #09ba07;position: relative;}
.dxwxjl-shle div.active::before { content: " ";width: 3px;position: absolute; left: 0.625rem; height: 1rem;top: 1rem;background-color: #09ba07;}
.dxwxjl-shle div{ float: left; width: 100%; height:3.125rem;color: #999;font-size: 0.8125rem;display: flex;align-items: center;justify-content: center;}
.dxwxjl-shle div.guanli{color: #00a8da;}
.dxwxjl-shle div.guanli a{color: #00a8da;}
.dxwxjl-shle div.guanli img{ width: 0.8125rem;height: 0.8125rem;}
.dxwxjl-shri{position: relative;overflow: hidden; min-height: 16rem; margin-top:6.5625rem; background-color: #fff;height: 100%; margin-left: 28%; width: 72%;}
.dxwxjl-shrix{ width: 100%;overflow-y:auto;}
.dxwxjl-shls{float: left; width: 100%;padding: 0.625rem;box-sizing: border-box;border-bottom: 1px solid #f1f1f1;}
.dxwxjl-shlsimg{float: left; width:4.5rem; height: 4.5rem;border-radius: 0.4rem; overflow: hidden; display: flex;align-items: center;justify-content:center;}
.dxwxjl-shlsimg img{width: 100%;}
.dxwxjl-shlsimg div{ width: 100%;height: 100%;}
.dxwxjl-shlstxt{float: left;position: relative; width: 60%;margin-left: 0.625rem;}
.dxwxjl-shlstxt .xtt1{font-size: 1rem;color: #222; width: 80%; padding: 0.3rem 0 0.5rem 0;text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.dxwxjl-shlstxt .xtt2{font-size: 0.8125rem;color: #f00;}
.dxwxjl-shlstxt .xtt2 div{ margin-left: 0.3125rem;display: inline-block; color: #999;font-size: 0.625rem;text-decoration: line-through;}
.dxwxjl-shlstxt .xtt3{font-size: 0.625rem;color: #999; padding: 1px 0;}
.dxwxjl-shlstxt .xtt4{font-size: 0.625rem;color: #999;}
.dxwxjl-shlstxt input{position: absolute;right: -0.3rem;top: 0;}
.xxtbnt{ margin-top: 0.5rem;}
.xxtbnt div{ padding: 0.25rem 1rem; margin-right: 0.3125rem; display: inline-block; color: #777;font-size: 0.9375rem;text-align: center;border: 1px solid #e4e4e4;border-radius: 0.35rem;}
.xxtbnt div a{color: #777;}
.dxwxjl-foot{position: fixed;margin: auto; width: 90%;left: 5%; z-index: 11;box-shadow: 0 0 8px #e6e6e6;overflow: hidden; bottom: 1.25rem;background-color: #fff;height: 3.125rem;border-radius: 100px;}
.dxwxjl-footle{float: left; width: 30%;display: flex;height: 3.125rem; color: #09ba07;align-items: center;justify-content: center;font-size: 0.9375rem;}
.dxwxjl-footle checkbox{ margin-right:0.3125rem;}
.dxwxjl-footle input{ margin-right: 4px;}
.dxwxjl-footri{float:right; width: 70%; background:#ddd; line-height: 3.125rem;color: #fff;text-align: center;font-size: 1.03125rem;}
.dxwxjl-footri a{color: #fff;}
/*分类*/
.jllist{float: left;width: 100%;}
.jllistbox{width: 100%;float: left; padding: 0.75rem 0.75rem;box-sizing: border-box;}
.jllisth{float: left;width: 100%;color: #222;position: relative; font-size: 0.8125rem;}
.jllisth img{width: 1.5625rem;height: 1.5625rem;position: absolute; right: 0;top: 0;}
.jllista{float: left;width: 100%; margin-top: 0.9375rem;}
.jllistan{float: left;width: 100%;position: relative; border-bottom: 1px solid #e4e4e4;}
.jllistan input{width: 100%;padding-right: 35%;padding-left: 5px; box-sizing: border-box; font-size: 0.9375rem;height: 3.125rem;}
.jllistan .jllistar{position: absolute;right: 0;top:0.75rem;}
.jllistan .jllistar div img{width: 1.5625rem;height: 1.5625rem;}
.jllistan .jllistar div{float: left; margin-left: 0.5rem;}
.footbutton{float: left;width: 100%;padding: 1rem 5%;box-sizing: border-box;}
.footbutton a.fbutl{width: 100%;height: 2.875rem;line-height: 2.875rem;background-color: #09ba07;color: #fff;text-align: center;font-size:1rem;border-radius: 6px;}
.footbutton a.fbutt{width: 100%;height: 2.875rem;line-height: 2.875rem;background-color: #999;color: #fff;text-align: center;font-size:1rem;border-radius: 6px; margin-top: 0.625rem;}
/*添加商品*/
.dxgoods{ width: 100%; padding: 0.75rem;box-sizing: border-box;}
.dxgoods-deta{float: left; width: 100%;background-color: #fff; padding:0 0.75rem;box-sizing: border-box; border-radius: 0.3rem; margin-bottom: 0.75rem;}
.dxgoods-des{float: left; width: 100%;position: relative; height: 3.125rem;font-size: 0.8125rem; display: flex;align-items: center;justify-content: left;}
.dxgoods-des text{ width: 4.4rem;display: inline-block;font-size: 0.8125rem;position: relative;top: 0px;}
.dxgoods-des input.imesjfa{color: #222;width: 70%;}
.dxgoods-desa{float: left; width: 100%;padding: 0.5rem 0;}
.dxgoods-desa textarea{ height: 4.8rem;width: 100%; font-size: 0.9375rem;color: #222;}
.dxgoods-desimg{float: left; width: 100%; padding-bottom: 0.5rem;display: flex;align-items: center;justify-content: left;}
.dxgoods-desimgs{float: left; }
.dxgoods-desimgs img{ width: 4.375rem;float: left; height: 4.375rem; margin:0 0.5rem 0.3rem 0;}
.dxgoods-desimgsa{float: left; width: 4.375rem; height: 4.375rem;position: relative;top: 0px; margin:0 0.4rem 0.3rem 0;}
.dxgoods-desimgsa:focus, .dxgoods-desimgsa:active{-webkit-filter: brightness(0.4);filter: brightness(0.4); cursor: pointer;}
.dxgoods-guige{float: left;position: relative; width: 100%;background-color: #fff; padding:0 0.5rem;box-sizing: border-box; border-radius: 0.3rem;}
.goodsgg{position: absolute;right: 0.5rem;color: #09ba07;font-size: 0.9375rem;}
.goodsgg a{color: #09ba07;}
.dxgoods-des input.imesjf{width: 50%;}
.dxgoods-des select{ width: 70%;position: absolute;left: 4.5rem;text-align: right;background-color: #fff;}
.dxgoods-des select img{ width: 0.9375rem; height: 0.9375rem;position: relative;top:1px;}
.dxgoods-tixi{float: left; width: 100%;color: #999;font-size: 0.8125rem;padding: 1.4rem 0 6rem 0;}
.dxgoods-tixih{float: left; width: 100%;padding: 0 0 0.5rem 0}
.dxgoods-tihh{float: left; width: 100%;}
.dxborder{border-bottom:1px solid #eee;}
.bntfoot{position: fixed;bottom: 0.875rem;z-index: 10; left: 4%; width: 92%;border-radius: 100px;background-color: #09ba07;font-size: 1rem;height: 2.875rem; line-height: 2.875rem; color: #fff;text-align: center;}
/*规格*/
.dxgoods{ width: 100%;float: left; padding: 0.75rem 0.75rem 8rem 0.75rem;box-sizing: border-box;}
.dxgoods-deta{float: left; width: 100%;background-color: #fff; padding:0 0.78125rem;box-sizing: border-box; border-radius: 0.3125rem; margin-bottom: 0.75rem;}
.dxgoosgg{float: left; width: 100%;}
.goosggs .active{background-color: #eaeaea;border: 1px solid #eaeaea;color: #222;}
.dxgoosgg .h1{float: left;width: 100%;position: relative;display: flex;align-items: center;justify-content: left; height: 3.125rem; font-size: 0.9375rem;color: #222;line-height: 3.125rem;}
.goosggs{float: left;width: 100%; padding-bottom: 0.78125rem;}
.goosggsi{padding: 0 1rem; margin-right: 0.8125rem; height: 29px;line-height: 29px; display: inline-block; color: #777;font-size: 0.875rem;text-align: center;border: 1px solid #e4e4e4;border-radius: 0.25rem;}
.goosggsis{position: relative;top: 0; padding: 0 0.3125rem; height: 29px;line-height: 29px;width: 6rem; color: #09ba07;display: inline-block; font-size: 0.875rem;text-align: center;border: 1px solid #09ba07;border-radius: 0.25rem;}
.goosggsis img{width: 1.25rem;height: 1.25rem;position: relative;top: -2px;}
.dxgoosgg .h1 input{color: #222; padding-left: 0.5rem; width: 40%; height:2rem; position: relative;top: 1px;margin-left: 3px;border: 1px solid #f1f1f1;}
.dxgoosgg .h1 div{position: absolute;top: 0; right: 2px;display: flex;align-items: center;justify-content: center; color: #999;font-size: 0.875rem;}
.dxgoosgg .h1 div:focus, .dxgoosgg .h1 div:active{-webkit-filter: brightness(0.6);filter: brightness(0.6); cursor: pointer;}
.dxgoosgg .h1 div img{ width: 1.1rem;height: 1.1rem; margin-right: 0.3125rem;}
.dxgoosgg .h1 img.bianji{ width: 1.25rem;height: 1.25rem;}
.dxgooslib{float: left;width: 100%; padding: 1.125rem 0;}
.dxgoosgg .h1 .colora{ color: #09ba07;}
.dxgoosg{padding: 0.5rem 0.3125rem 0.5rem 1.1rem; margin-right: 0.8125rem; float: left;display: flex;align-items: center;justify-content: center;background-color: #eaeaea; color: #222;font-size: 0.875rem;text-align: center;border-radius: 0.25rem;}
.dxgoosg:focus, .dxgoosg:active{-webkit-filter: brightness(0.6);filter: brightness(0.6); cursor: pointer;}
.dxgoosu img{ margin-left: 0; width: 1.3rem;height:1.3rem;}
.dxgoosg img.iconbig{margin-left: 0; width: 1.1rem;height:1.1rem;}
.dxgoosu{padding: 0.5rem 0.9375rem 0.5rem 0.5rem; margin-right: 0.8125rem; float: left;display: flex;align-items: center;justify-content: center;background-color: #eaeaea; color: #00a8da;font-size: 0.875rem;text-align: center;border-radius: 0.25rem;}
.dxgoods-m{float: left;width: 100%; padding: 1.125rem 0;}
.goos-txt{width: 100%;display: table; width: 100%; /*Optional*/ table-layout: fixed; /*Optional*/ }
.goos-txt div{display: table-cell; color: #999;font-size: 0.8125rem;text-align: center; }
.goos-txts{width: 100%;display: table; width: 100%; /*Optional*/ table-layout: fixed; margin-bottom: 0.78125rem;margin-top: 0.78125rem; /*Optional*/ }
.goos-txts div{ display: table-cell;position: relative; line-height:1.5rem;height: 2.2rem; color: #222;font-size: 0.8125rem;text-align: center; }
.goos-txts div input{background-color:#eaeaea;position: absolute;top: 0.3125rem;left: 0;right: 0;margin: auto; height: 2.2rem; border-radius: 0.25rem; margin: auto; width: 80%;text-align: center;}
.goos-txts div img{width: 2.2rem;height: 2.2rem;background-color: #eaeaea; border-radius: 0.25rem;top: 0.3125rem; position: absolute;left: 0;right: 0; margin: auto;}
.goos-txts div img:focus, .goos-txts div img:active{-webkit-filter: brightness(0.6);filter: brightness(0.6); cursor: pointer;}
.pwjqd-box{position: fixed;top: 0; width: 100%;height: 100%; z-index:11; }
.pwjqd-boxbr{position: absolute;top: 0;display: flex;align-items: center;justify-content: center; width: 100%; height: 100%;background-color:rgba(0, 0, 0, 0.51) ;}
.pwjqd-boxbri{ width: 90%;position: relative;border-radius: 0.3125rem;overflow: hidden; text-align: center; background-color: #fff;}
.qdtxt1{position: relative;width: 100%;left: 0;right: 0; padding: 1.875rem 0; font-size: 1.03125rem;font-weight: bold; color: #222;}
.qdtxt2{position: absolute;bottom: 20.3125rem; width: 100%;left: 0;right: 0;color: #999;font-size: 1rem; }
.qdtxtinput{position: relative; width: 88%; margin: 0 6%;position: relative;top: -0.3125rem;}
.qdtxtinput div{ width: 100%;background-color: #f2f2f2;border-radius: 0.3125rem; margin-bottom: 0.9375rem; height:3.25rem;display: flex;align-items: center;justify-content: left;}
.qdtxtinput div text{font-size: 0.8125rem;color: #222; width: 5rem;text-align: left;text-indent: 0.9375rem;}
.qdtxtinput div input{font-size: 0.8125rem;position: relative;top: 1px; background-color: #f2f2f2; color: #222; width: 60%;text-align: left; }
.qdtxt5{position: relative;border-top: 1px solid #eee; height: 2.875rem;font-size: 1rem; line-height: 2.875rem; width:100%;text-align: center; }
.qdtxt5 div{display: inline-block; width: 50%; background-color: #fff;color: #222;}
.qdtxt5 div.active{display: inline-block; width: 50%;border-left: 1px solid #eee;box-sizing: border-box; background-color: #fff;color: #f00;}
.qdtxt5 div.actives{display: inline-block; width: 50%;border-left: 1px solid #eee;box-sizing: border-box; background-color: #fff;color: #09ba07;}
/*物流设置*/
.yunfeibnt{float: left;width: 100%;margin: 0.5rem 0 0.5rem 0;}
.yunfei{float: left;width: 100%; }
.yunfeibnt div{float:right;border-radius: 0.4375rem;background-color: #fff; border: 1px solid #eee;color:#666;font-size: 0.875rem; padding: 3px 0.9375rem; margin-left:0.315rem;}
.dxwxjl-con{float: left;z-index: 5; margin-top: 0.5rem; position: relative; width:100%;box-sizing: border-box;padding: 0 0.625rem 0.625rem 0.625rem;}
.dxwxjl-cont{float: left;width: 100%;background-color: #fff;border-radius: 0.5rem;}
.dxwxjl-conth{float: left;width: 100%;position: relative;text-align: left;color: #000;line-height: 3.2rem; height: 3rem; font-weight: bold; font-size: 1rem; padding: 0 0.5rem;box-sizing: border-box;}
.dxwxjl-conth text{position: absolute;right: 0;top: 0.625rem; color:#09ba07;font-size: 0.625rem;right: 0.625rem; padding: 0.0375rem; font-weight: normal;line-height: 3rem; border-radius: 3px;border: 1px solid #09ba07;}
.wuliu{float: left;width: 100%;}
.wuliu-li{position: relative;background-color: #fff;float: left;font-size: 0.9375rem; width: 100%;line-height: 3.125rem; padding: 0 1rem; margin: 1px 0 0 0; box-sizing: border-box;}
.wuliu-li form{ width: 50%;position: absolute;top: 0; right: 0.625rem;text-align: right;}
.wuliu-li form img{ width: 0.9375rem; height: 0.9375rem;position: relative;top:1px;}
.dxwxjl-wuliuts input{position: absolute;left: 0;top: 0.2rem;}
.wuliu-mobant{float: left;width: 100%; }
.wuliu-mobanh{float: left;width: 100%;color: #222;font-size: 1rem;line-height: 3.125rem;background-color: #f5f5f5;}
.wuliu-mobants{float: left;width: 100%; padding: 0 0.75rem;border-bottom: 1px solid #f1f1f1;box-sizing:border-box; display: flex;align-items: center;justify-content: space-between; font-size: 0.9375rem;color: #222; height: 3.125rem;line-height: 3.125rem;}
.wuliu-moban{background-color: #fff;width: 94.8%; margin: 0 2.6%;float: left;}
.dxwxjl-wuliu{float: left;width: 100%; padding: 0 0.875rem;box-sizing: border-box; text-align: center;}
.dxwxjl-wuliut{float: left;width: 100%;color: #999;font-size: 0.875rem;text-align: left;line-height: 1.2rem; margin-top: 0.5rem;}
.wuliutan{background-color: #09ba07;color: #fff; height: 2.5rem;line-height: 2.5rem; margin: 0.625rem 0 1.5rem 0; width: 80%; border-radius: 3.125rem;font-size: 0.9375rem; display: inline-block;}
.wuliutan a{color: #fff;}
.dxwxjl-wuliuts{float: left;z-index: 5; text-align: left;font-size: 0.875rem;border-bottom: 1px solid #eee; padding-bottom: 0.5rem; margin-bottom: 0.5rem; margin-top: 0.3125rem; color: #777; position: relative; width:100%;}
.dxwxjl-conf{float: left;z-index: 5; margin-top: 0.625rem; position: relative; width:100%;box-sizing: border-box;padding: 0 0.625rem 0.75rem 0.625rem;}
.wuliutxt{float: left;width: 100%;line-height: 1.2rem; margin: 3px 0 3px 0; padding: 0 26% 0 8%;box-sizing: border-box;}
.wuliutxtf{position: absolute;right: 0;top: 0.3125rem;}
.wuliutxtf img{width: 1.5rem;height: 1.5rem; margin-left: 0.5rem;}
.wuliu-mobants input{text-align: right;background: none;}
.wuliu-mobantsa{float: left;width: 100%; padding: 0.75rem 0.75rem 0 0.75rem ;box-sizing: border-box;border-bottom: 1px solid #f1f1f1;}
.wuliu-mobantsa .monb{float: left;color: #222;font-size: 1rem;text-align: left;width: 40%;}
.wuliu-mobantsa .monb text{display: inline-block; width: 100%;font-size: 0.8125rem;color: #999;}
.wuliu-mobantsak{float: left;width: 100%;position: relative; height: 3.125rem;line-height: 3.125rem; padding: 0 0.75rem 0 0.75rem;box-sizing: border-box;border-bottom: 1px solid #f1f1f1;}
.wuliu-mobantsak .monb{float: left;color: #222;font-size: 1rem;text-align: left;width: 40%;}
.wuliutanok{float: left;width: 100%;text-align: center; margin-top: 2rem;}
.wuliutanok div{background-color: #09ba07;color: #fff;text-align:center; height: 2.9375rem;line-height: 2.9375rem; margin: auto; width: 92%; border-radius: 100rem;font-size: 0.9375rem;}
.qdtxt5{position: relative;border-top: 1px solid #f1f1f1;float: left; height: 2.875rem;font-size: 1rem; line-height: 2.875rem; width:100%;text-align: center; }
.qdtxt5 div{display: inline-block; width: 50%; background-color: #fff;color: #222;}
.qdtxt5 div.active{display: inline-block; width: 50%;border-left: 1px solid #eee;box-sizing: border-box; background-color: #fff;color: #f00;}
.qdtxt5 div.actives{display: inline-block; width: 50%;border-left: 1px solid #eee;box-sizing: border-box; background-color: #fff;color: #09ba07;}
.wuliu-mobants .monb{font-size: 1rem;}
.swiper-tab{float: right;}
.swiper-tab ul li{display: inline-block; margin-left: 0.5rem;}
.swiper-tab ul li a{border:1px solid #eee;color: #333; padding: 0.4rem 0.5rem;font-size: 0.8125rem; }
.swiper-tab ul li.active a{border:1px solid #09ba07;color: #09ba07; }
.swiper-taba{float: left; width: 100%; margin: 0.875rem 0;}
.swiper-taba ul li{float: right;display: none;color:#666;font-size: 0.8125rem;}
.swiper-taba ul li div{ margin-bottom: 0.875rem;}
.swiper-taba ul li input{border: 1px solid #eee; width: 5rem;font-size: 0.8125rem; height: 2.2rem; margin: 0 0.3rem; padding-left: 0.2rem;}
.swiper-taba ul li.thisclass{display: block;}
.wuliri{float: right;width: 60%; position: relative;}
.wuliri div{width: 70%;float: right;margin-right: 1rem; font-size: 0.8125rem;color: #666;text-overflow: ellipsis;white-space: nowrap;overflow: hidden; }
.wuliri img{position: absolute;right: 0%;top: 1rem; width: 1.1rem;}
/*添加提货点*/
.jl-thd{float: left;width: 100%;}
.jl-thds{float: left;width: 100%;background-color: #fff; padding: 0 0.6875rem;box-sizing: border-box;}
.jl-thdsl{float: left;width: 100%;display: flex;align-items: center; font-size: 0.9375rem;border-bottom:1px solid #f1f1f1; height: 3.125rem;line-height: 3.125rem;}
.jl-thdsl text{float: left;color: #000; width: 30%;}
.jl-thdsl div{float:right;width: 68%; position: relative;display: flex;align-items: center;height: 3.125rem;}
.jl-thdsl div input{width:100%;color: #000;font-size: 0.9375rem;}
.jl-thdsl div img{position: absolute;right: 3px;width: 1.5rem;height: 1.5rem;}
/*订单*/
.ordershil{float: left;width: 100%;background-color: #fff;}
.ordershils{float: left;width: 100%;margin:auto; border-bottom: 0.625rem solid #f4f4f4; padding: 0 5.2%;box-sizing: border-box; display: flex; justify-content: space-between; flex-wrap: wrap;display: flex;justify-content:space-between;flex-wrap: wrap;}
.ordershils-li{float: left;text-align: center; padding: 0.9375rem 0;}
.ordershils-li .orsjlis{float: left;width: 100%;font-size: 1.4rem;font-weight: bold; line-height: 2.75rem;}
.ordershils-li .orsjlis i{display: inline-block;font-size: 1rem;}
.ordershils-li .orsjlisa{float: left; width: 100%;font-size: 0.875rem;color:#999;font-weight: normal; display:flex;align-items: center;justify-content: center;}
.ordershils-li .orsjlisa a{color: #999;}
.ordershils-li .orsjlisa img{width: 1.25rem; height:1.25rem; margin-left: 2px;}
.hexiao{float: left;width: 100%;}
.hexiaotop{float: left;width: 100%;background: #fff; border-bottom:1px solid #eee; padding: 0.8125rem 4%;box-sizing: border-box;}
.hexiaoh{float: left;width: 50%;text-align: left;font-weight: bold;}
.hexiaoh div{ font-size: 1rem;}
.hexiaoh div.active{color: #666; margin-top: 2px; font-size: 0.875rem; font-weight: normal;}
.hexiaori{float: right; background-color: #09ba07; color: #fff; font-size: 0.8125rem;padding: 0.4rem 0.8125rem; border-radius: 1px;}
.hexiaobot{float: left;width: 100%;background: #fff;padding: 0.75rem 4% 0 4%;box-sizing: border-box; border-bottom: 0.625rem solid #f4f4f4; }
.hexiaobotsa{float: left;width: 60%;}
.hexiaobotsa .aui-checkbox{float: left; margin-right: 3px;position: relative;top: 2px;}
.hexiaobotsa div{float: left;color: #777;font-size: 0.875rem;}
.hexiaobotsr{float: right;color: #777;font-size: 0.87rem;}
.hexiaobots{float: left;width: 100%; margin-bottom: 0.5rem;}
.nt-bofk{background-color: #fff; position: relative; border-radius: 0.4375rem; width: 92%; color: #333;}
.sctangchuankh{margin-top: 20px;}
.sctangtt{float:left; width: 100%;text-align:center;color: #666;font-size: 0.9375rem; padding: 1.6rem 5%;box-sizing: border-box;}
.sctangttb{float: left; position: relative;border-top: 1px solid #eee; height: 2.875rem;font-size: 1rem; line-height: 2.875rem; width:100%;text-align: center; }
.sctangttb a{display: inline-block; width: 100%;color: #09ba07;font-size: 1rem;font-weight: bold; }
.myorta{float: left; width: 100%; height: 3.125rem;border-bottom: 1px solid #eee; }
.myorta div{color: #000;font-size: 0.875rem; width: 50%; height: 3.125rem; text-align: center;display: flex;align-items: center;justify-content:center; float: left;}
.myorta div img{width: 1.5625rem; height: 1.5625rem;}
.myorderss{float: left;width: 100%; margin: 0.75rem 0;}
.myorderss div{width: 92%;margin: auto;display: block;display: flex;align-items: center;justify-content: left;border-radius: 0.25rem; background-color: #f2f2f2; height: 2.4rem;}
.myorderss div img{width: 1.4rem; height: 1.4rem; margin: 0 0.4rem 0 1rem;}
.myorderss div input{width: 80%;font-size: 0.875rem;background: #f2f2f2;}
.ordernli{float: left; width: 100%;}
.ordernliah{float: left;font-size: 1rem;border-bottom: 1px solid #eee; margin-bottom: 0.5rem; font-weight: bold; width: 100%;position: relative; height: 2.875rem;line-height: 2.875rem;}
.ordernliah i{color: #f00;font-style: normal;}
.myorderli{float: left;width: 100%;border-bottom:1px solid #eee; display:-webkit-flex; display: flex;text-align: center;line-height: 2.75rem; }
.myorderli div{-webkit-flex:1; flex:1;font-size: 0.9375rem;color: #333;position: relative;}
.myorderli div i{position: absolute;display: inline-block;font-style: normal; z-index: 10;top: 0.9375rem;right: 0.9375rem; background-color: #f00;width: 0.5rem;height:0.5rem;border-radius: 0.5rem;overflow: hidden;}
.myorderli div.active{color: #09ba07;font-weight: bold; }
.myorderli div.active:before{content: " ";width:2rem;position: absolute; left: 50%; margin-left:-1rem; height:0.3rem;bottom: 0rem;background-color: #09ba07;}
.liahri{position: absolute;right: 0rem;top: 0.5rem;font-weight: normal;font-size: 0.875rem; background-color: #e7ffec;color: #029000; font-size: 0.8125rem;line-height: normal; padding: 0.3rem 0.9375rem; border-radius: 10.5rem;}
.liahria{position: absolute;right: 0rem;top: 0.5rem;font-weight: normal;font-size: 0.875rem; background-color: #fffaeb;color: #ffbb02; font-size: 0.8125rem;line-height: normal; padding: 0.3rem 0.9375rem; border-radius: 10.5rem;}
.myorder{position: relative;float:left; top: auto;background-color: #fff; width: 100%;z-index: 10;}
.orderdfla{float: left; width: 100%; padding: 0.7rem 4%;box-sizing: border-box;}
.orderdfla div{background: #f4f4f4;color:#999;font-size: 0.878rem;float: left; margin-right: 0.6rem; padding: 0.55rem 1.2rem;border-radius: 3px;}
.orderdfla div.active{background-color: #e7ffec;color: #029000;}
.ordernlian{float: left; width: 100%;}
.ordernlians{float: left; width: 100%;display: flex;align-items: center;justify-content: flex-start;font-size: 1rem;}
.ordernlians img.lianimga{ width: 3rem; height: 3rem;border-radius: 0.45rem;overflow: hidden; margin-right: 0.3125rem;}
.ordernlians img.lianimg{ width: 1.375rem; height: 1.375rem; margin-left: 3px;}
.ordernlianj{float:left; width: 100%;position: relative;border-bottom: 1px solid #eee;}
.ordernlianj div{font-size: 0.8125rem;width: 80%;text-overflow: ellipsis;white-space: nowrap;overflow: hidden; float: left; line-height: 2.5rem;}
.ordernlianj div.iesf{position: absolute;width: auto; right: -0.3125rem;display: flex;align-items: center; color: #999;font-size: 0.8125rem;}
.ordernlianj div.iesf img{width: 1rem;height: 1rem;}
.ordernlitc{float: left; width: 100%; padding-top: 0.3125rem;}
.ordernlitca div{display: inline-block;font-weight: bold;}
.ordernlitca div.ordernlitcas{position: absolute;right: 0rem;font-weight: normal;}
.ordernlitcbsn{float: left; width: 100%; margin-top: 0.5rem;position: relative;}
.ordernlitca{float: left;width: 100%; margin: 3px 0;font-size: 0.875rem;position: relative;}
.ordernlitcb{float: left;width: 100%; margin: 0 0;font-size: 0.8125rem;margin-top: 2px;}
.ordernlitcbs{float: left; width: 100%;font-size: 0.875rem; position: relative;color: #000;}
.ordernlitcbs text{position: absolute;right: 0;color: #000;font-size: 0.875rem;}
.ordernlitcbsn i{position: absolute;right: 0;color: #000;font-size: 0.875rem;font-style: normal;}
.ordernlitcbs i{position: absolute;right: 0;color: #000;font-size: 0.875rem;font-style: normal;}
.ordernlitcbsn{color: #999;}
.ordernlitcbsn text{position: absolute;right: 0;color: #000;font-size: 0.875rem;}
.orderdd{float: left; width: 100%;background-color: #f4f4f4;border-radius: 0.3125rem; padding: 0 0.55rem;box-sizing: border-box; margin-top: 0.5rem;}
.orderddh{float: left; width: 100%;font-size: 1rem;line-height: 2.75rem;}
.orderddf{float: left; width: 100%;}
.orderddfs{float: left; width: 100%;position: relative; padding-bottom: 0.75rem; font-size: 0.875rem;display: flex;align-items: center; color: #666;}
.orderddfs a{color: #666;}
.orderddfs p{width: 69%;}
.orderddfs img{width: 0.9375rem; margin-right: 0.35rem; height: 0.9375rem;}
.orderddk{float: left; width: 100%;border-top: 1px solid #e5e5e5; padding: 0.5rem 0;}
.orderddks{float: left; width: 100%;position: relative; display: flex;align-items: center;font-size: 0.875rem;color: #666;}
.orderddks img{ width: 1rem; height: 1rem; margin-right: 2px;}
.orderddks div{display: inline-block; margin: 0.25rem;}
.ddksri{position: absolute;right: 0;border: 1px solid #e5e5e5;font-size: 0.8125rem; padding: 3px 0.5rem;}
.ordejant{float: left; width: 100%; margin-bottom: 0.5rem;}
.ordejant div{display: inline-block;color: #666; border: 1px solid #e5e5e5;font-size: 0.8125rem; padding: 3px 0.5rem;}
.orderbz{float: left;width: 100%;position: relative;line-height: 1.5625rem; font-size: 0.875rem;color: #666;}
.orderbz img{ width: 1rem; height: 1rem; margin-right: 2px;}
.orderbz .orderbzs div{display: inline-block; margin: 0.45rem;}
.orderbzs{display:flex;align-items: center;}
.order-bnt{float: left; width: 100%; margin: 0.625rem 0; display: flex;align-items: center;justify-content: flex-end;}
.order-bnt div{display: inline-block;border: 1px solid #e5e5e5;border-radius: 2px; padding: 0.3125rem 0.5rem;font-size: 0.875rem; margin-left: 0.5rem;}
.myorder-li{float:left; width: 100%; padding: 0.625rem 0.625rem;box-sizing: border-box;}
.pwjqd-boxbrw{float: left;width: 100%; height: 100%;position: relative;}
.pwjqd-boxbriw{ width: 100%; padding: 0 4%;box-sizing: border-box; position: absolute;bottom: 0; border-top-left-radius:0.625rem; border-top-right-radius:0.625rem;overflow: hidden; text-align: center; background-color: #fff;}
.ordtsh{float: left;width: 100%;font-size: 1rem; height: 3rem;line-height:3rem; text-align: left; font-weight: bold;position: relative;}
.ordtsh img{position: absolute;right: 0;top: 0.7125rem; width: 1.5625rem; height:1.5625rem;}
.ordtshli{float: left; width: 100%;max-height:22rem;overflow:auto;}
.ordtshlibox{float:left;width: 100%;text-align: left; padding: 0.625rem 0; font-size: 0.9375rem; border-top: 1px solid #eee;}
.ordtshlibox div.active{font-size: 0.75rem;color: #999; margin-top: 0.352rem;}
.ordtsui{float: left; width: 100%; margin:auto; display: flex; justify-content: space-between; flex-wrap: wrap;display: flex;justify-content:space-between;flex-wrap: wrap;}
.ordtsui div{ width: 23%;border-radius:0.25rem; padding: 0.45rem 0; display: table-cell; background-color: #f4f4f4;font-size: 0.875rem;text-align: center;}
.ordtsui div.active{background-color: #09ba07;color: #fff;}
.ordtsuiv{float: left; width: 100%;}
.ordtsuivh{float: left; width: 100%;text-align: left;line-height:2.5rem; margin-top:0.625rem; color: #999;font-size:0.8125rem;}
.ordtsuivw{float: left; width: 100%;display: flex;align-items: center;justify-content: flex-start; margin-bottom: 0.9375rem;}
.ordtsuivw picker{width: 47.5%;display: inline-block;}
.ordtsuivw i{ margin: 0 0.625rem;}
.ordtsuivw input{width: 100%;border-radius: 1px;font-size: 0.8125rem; background-color: #f4f4f4;color: #999; height: 2.5rem;text-align: center; display: inline-block;}
.ordtsuiva{float: left; background-color: #09ba07;border-radius: 4px;color: #fff;text-align: center; width: 100%; margin-bottom: 0.9375rem; line-height: 2.75rem;}
/*发货*/
.myorderxs{ box-sizing: border-box;width: 100%;float: left;}
.myorder-jbo{float: left;width: 100%;border-top:1px solid #f1f1f1; height: 2.75rem; margin-top: 0;display: flex;align-items: center;justify-content: left;}
.myorder-li{float: left;width: 100%;padding-bottom: 0;}
.jskbox{float: left; width: 100%;padding: 0rem 0 0 0;background-color: #fff; box-sizing: border-box;position: relative;}
.dxgoods-des{float: left; width: 100%;height: 3.2rem;font-size: 0.875rem; display: flex;align-items: center;justify-content: left;}
.dxgoods-des i{ width: 4rem;display: inline-block;font-style: normal;}
.dxgoods-des input.imesjfa{color: #222;width: 70%;}
.dxgoods-des input.imesjf{width: 50%;}
.dxgoods-des img{ width: 50%;position: absolute;right: 0;text-align: right;}
.dxgoods-des img{ width: 1.125rem; height: 1.125rem;right: 0; position: absolute;top:1.2rem;}
.picker{width: 70%;float: right; display: flex;align-items: center;justify-content: right;}
.picker input{margin-right: 0.3125rem; width: 100%;}
.picker img.dnimg{position: absolute;right: 5px;top: 1rem; width: 1.3rem;height:1.3rem;}
.dxgoods-desa{float: left; width: 100%;padding: 0.75rem 0;}
.dxgoods-desa textarea{ height: 4.5rem;width: 100%; font-size: 0.9375rem;color: #222;}
.dxgoods-desimg{float: left; width: 100%; padding-bottom: 0.875rem;display: flex;align-items: center;justify-content: left;}
.dxgoods-desimgs{float: left; }
.dxgoods-desimgs img{ width: 4.375rem; height: 4.375rem; margin:0 13px 0.3125rem 0;}
.dxgoods-desimgsa{float: left; width: 140rpx; height: 140rpx;position: relative;top: -2px; margin:0 0.4rem 0.3125rem 0;}
.dxgoods-desimgsa:focus, .dxgoods-desimgsa:active{-webkit-filter: brightness(0.4);filter: brightness(0.4); cursor: pointer;}
.myorder-sj{float: left;width: 100%;}
.myorder-sjh{float: left;width: 100%;display: flex;align-items: center;border-bottom: 1px solid #f1f1f1; margin-bottom: 0.4rem; justify-content:left; height: 10.4rem;}
.myorder-sjh img{width: 60.2rem; height: 60.2rem; margin-right: 10.2rem;border-radius: 3.125rem;overflow: hidden;}
.myorder-sjh div{display: inline-block;color:#000;font-size: 1rem;border-radius: 3px;}
.myorder-sjh text{color: #09ba07;position: relative;top: 1px; font-size: 20.2rem; margin-left: 0.4rem;border-radius: 3px; padding: 0.2rem 0.3rem; border: 1px solid #09ba07;}
.game-jfadds{float: left; width: 100%;padding: 0.875rem 0 1rem 0;background-color: #fff; box-sizing: border-box;position: relative;}
.game-jfadds .ttxtq{color: #434343; margin-top: 0.4rem;}
.game-jfadds .ttxtw img{ width:1.5625rem; height: 1.5625rem;position: absolute;right:0.9375rem;bottom:0;top:33px;}
.game-jfadds .jfadds{color: #434343;font-size: 0.9375rem;}
.game-jfadds .jfadds{ width:75%; margin-top:1rem;position: relative;}
.game-jfadds .jfadds div{margin-top: 0.3125rem;}
.nt-bosjf img.game-jfcook{ margin: auto;display: block; width:4.6875rem; height: 4.6875rem; margin-top: 1.25rem; margin-bottom: 1.0625rem;}
.nt-bosjf img#s5{position: absolute;bottom: -3.2rem;z-index: 10; width: 2rem;left: 50%; margin-left: -1rem;}
.nt-bosjf h1{color: #333333;font-size: 1.125rem;text-align: center; margin-bottom: 0.5rem;}
.nt-bosjf p{width: 100%;font-size: 0.875rem;color: #666666; text-align: center}
.nt-bosjf a{ width: 88%; height:2.5rem;line-height: 2.55rem;text-align: center;font-size: 1rem;color: #333333; background-color:#FFCE24;border-radius: 0.3125rem; margin:auto; display: block; margin-top: 0.4rem; margin-bottom: 1.8rem;}
.gameadd{float: left; width: 100%;}
.gameadd li{float: left; width: 100%;background-color: #fff;position: relative; margin-top: 0.625rem;}
.gameadd li .jfadds img{position: absolute;right: 0.875rem;top: 0.46875rem;width: 1.9rem;z-index: 5;}
.game-jfadds .jfadds text{position: absolute;right: -32%;top: 4px;color: #09ba07;font-size: 0.8125rem;}
.game-jfaddmor{position:relative; float: left; width: 100%;font-size: 0.9375rem;color: #666; padding: 0 5%;box-sizing: border-box; height: 2.875rem;border-top: 1px solid #f2f2f2; margin-top: 0.625rem;}
.game-jfaddrp{position: absolute;right: 1.2em;font-size:0.9375rem;top: 0.78125rem;}
.game-jfaddrp text{color: #B4B4B4;}
.liuyan{float: left;width: 100%;color:#666;font-size: 0.8125rem;margin-bottom: 1rem;margin-top: 0.4rem;}
.liuyan small{color: #434343; display: inline-block;}
/*数据分析*/
.sjfxtop{position: relative;float: left; padding: 0.4rem 0; top: auto;background-color: #fff;width: 100%;}
.sjfxtops{float: left;width: 100%; padding: 0 0.3125rem;box-sizing:border-box;margin: 0.45rem 0 0.45rem 0; }
.sjfxtops div{float: left;color: #222;background-color: #f2f2f2;border-radius: 3.125rem; font-size: 0.78125rem; padding: 0.4rem 0.75rem; margin-right: 0.75rem;}
.sjfxtops div.active{color: #1aaf17;background-color: #f1fff0;}
.sjfxtopa{float: left;width: 100%; padding: 0 0.9375rem; margin: 0.3rem 0 0.45rem 0; display: flex;align-items: center;justify-content:left; box-sizing:border-box; color: #999;font-size: 0.78125rem;}
.sjfxtopa input{background-color: #f2f2f2;display: inline-block; width: 90%; margin: 0 0.25rem;text-align: center; font-size: 0.78125rem; padding: 0.4rem 0.3125rem;border-radius: 3.125rem; }
.sjfxtopa div, .sjfxtopa picker{display: inline-block; width: 40%;}
.sjfxbox{ margin:0.45rem 0 0 0;float: left;width: 100%; padding: 0 0.45rem;box-sizing: border-box;}
.sjfxboxi{float: left;width: 100%; margin-bottom: 0.3125rem;overflow: hidden; background-color: #fff;border-radius: 0.3125rem;}
.sjfxboxh{float: left;width: 100%; padding: 0 0.75rem;box-sizing: border-box; position: relative;font-size: 1.1rem;font-weight: bold; height: 3.125rem;line-height: 3.125rem; background-color: #fff;}
.sjfxboxh text{position: absolute;right: 0.75rem;color: #999;font-weight: normal;font-size: 0.78125rem;}
.sjfxli{float: left;width: 100%;border-top:1px solid #f1f1f1;}
.sjfxli div{float: left; height: 6rem; width: 33.333%;font-size: 0.78125rem;color: #999; text-align: center; box-sizing: border-box;border-bottom:1px solid #f1f1f1;border-right:1px solid #f1f1f1;}
.sjfxli div text{width: 100%;display: inline-block;font-size: 1.4rem;line-height: 2.5rem; margin-top: 0.75rem; color: #000;}
/*团员管理*/
.youke{float: left;width: 100%; background-color: #fff; margin-bottom: 0.3125rem;}
.orderdfla{float: left; width: 100%; padding: 0.3125rem 4%;box-sizing: border-box;}
.orderdfla div{background: #f4f4f4;color:#999;font-size: 0.875rem;float: left; margin-right: 0.6rem; padding: 0.5rem 1.2rem;border-radius: 0.2rem;}
.orderdfla div.active{background-color: #e7ffec;color: #029000;}
.myorderli{float: left;width: 100%;border-bottom:1px solid #eee; display:-webkit-flex; display: flex;text-align: center;line-height: 2.75rem; }
.myorderli div{-webkit-flex:1; flex:1;font-size: 0.9375rem;color: #333;position: relative;}
.myorderli div text{position: absolute;display: inline-block;z-index: 10;top: 0.9375rem;right: 0.9375rem; background-color: #f00;width: 0.5rem;height:0.5rem;border-radius: 0.5rem;overflow: hidden;}
.myorderli div.active{color: #09ba07;font-weight: bold; }
.myorderli div.active:before{content: " ";width: 2.4rem;position: absolute; left: 50%; margin-left:-1.2rem; height:0.2rem;bottom: 0rem;background-color: #09ba07;}
.myorderss{float: left;width: 100%; margin: 0.3125rem 0; padding: 0 3.2%;box-sizing: border-box;}
.myorderss div.myinput{width: 74%;float: left;display: flex;align-items: center;justify-content: left;border-radius: 0.3rem; background-color: #f2f2f2; height: 2.5rem;}
.myorderss div.myinput img{width: 1.44rem; height: 1.44rem; margin: 0 0.4rem 0 0.3125rem;}
.myorderss div.myinput input{width: 80%;font-size: 0.875rem;}
.myorderss .mydatax{width: 24%; float:right;display: flex;background: none; height:2.5rem; align-items: center;justify-content: center;font-size: 0.75rem;color:#999;}
.myorderss .mydatax img{width: 1.4rem;height: 1.4rem;margin: 0;}
.tuanduili{float: left;width: 100%;position: relative; padding: 0.8rem 3.2%;box-sizing: border-box;border-bottom: 1px solid #eee;}
.tuanduiliimg{float: left; margin-right: 0.75rem;}
.tuanduiliimg img{width:3.25rem; height:3.25rem;border-radius: 0.3rem;overflow: hidden;}
.tuanduilitxt{float: left;width: 70%;}
.tuanduilitxt .tdtxt1{float: left;width: 100%;font-size: 1rem; margin-bottom: 2px;}
.tuanduilitxt .tdtxt1 text{position: relative;top: -2px; background-color: #e7ffec;color: #09ba07;font-size: 0.8125rem; padding: 1px 3px; border-radius: 3px;margin-left: 4px;}
.tuanduilitxt .tdtxt2{float: left;width: 100%;font-size: 0.8125rem;color: #999;}
.tuanduilitxt .tdtxt2 text{margin-right: 0.5rem;}
.tuanduilitxt .tdtxti{position: absolute;right: 0.875rem;top: 0.8rem;}
.tuanduilitxt .tdtxti img{width: 1.44rem; height: 1.44rem;}
/*地区选择*/
.addsboxl{float: left;width: 100%; padding-bottom: 5rem;}
.adds{float: left;width: 100%;font-size: 1rem; margin-bottom: 1.3rem;}
.adds .aui-checkbox{ margin-right: 0.45rem;}
.addsq{float: left;width: 100%; padding-left: 1rem;box-sizing: border-box; height: 2.5rem;display: flex;align-items: center;justify-content: left;}
.addsr{float: left;width: 100%; padding-left: 2.5rem;box-sizing: border-box;}
.addsr-l{float: left;width: 100%;text-align: center;}
.addsr-li{float: left;width: 100%;}
.addsr-lix{float: left;width: 100%;text-align: center; padding-left: 16%;box-sizing: border-box;font-size: 0.8125rem;}
.addsr-lis{float: left;width: 50%;text-align: center;}
.addsr-oo{float: left; width:100%;display: flex;align-items: center;justify-content: left; height: 2.5rem;}
.pwjqd-boxbr{display: flex;align-items: center; justify-content: left;}
.addsr-oo div{display: inline-block;}
.addsr-oo div text{display: inline-block; width: 1rem; height: 1rem; transform:rotate(90deg);
-webkit-transform:rotate(90deg);
-moz-transform:rotate(90deg);
-o-transform:rotate(90deg);
-ms-transform:rotate(90deg); background: url(../images/wxicons1.png) no-repeat center center;background-size: 1rem 1rem;}
/*head*/
.headapp{float: left; width: 100%;display: block;position: relative;z-index: 10;background-color: #fff;}
.headapp .headapp-le{float: left; padding: 0px 0 0px 10px;}
.headapp .headapp-le img{ height: 42px;width: 42px; border-radius: 100px;overflow: hidden;margin-right: 0.4rem;}
.headapp .headapp-le a{color: #333;float: left; font-weight: bold;font-size: 0.9375rem;display: inline-block; }
.headapp .headapp-ri{float: right;}
.headapp .headapp-ri img{width: 55px;}
.headapp .headapp-le a.loginc{display: inline-block;color: #09ba07; font-size: 0.8125rem;margin-left: 1rem;}
/**/
/*手机右侧滑出样式*/
a#cd-logo {display: block;float: left; height:100%;}
a#cd-logo img { display: block; width:4.5rem;}
header img.left{ float:left; overflow:hidden; height: auto; margin:0px 0px 0px 0.625rem;}
header img.right{ float:right;width:2.625rem; height: auto; margin:0 0.2rem 0px 0px;}
header{ height:3.437rem; width:100%; line-height:3.437rem; position: fixed;top: 0; left: 0;z-index:3;
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property: transform;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
transition-duration: 0.4s;
}
header .lateral-menu-is-open {
/* translate to show the lateral menu */
-webkit-transform: translateX(-40%);
-moz-transform: translateX(-40%);
-ms-transform: translateX(-40%);
-o-transform: translateX(-40%);
transform: translateX(-40%);
}
.cd-main-content {
/* set a min-height and a z-index to be sure that the main element completely covers the lateral menu */
height: 100%;
z-index: 2;
padding-top:3.4375rem;
padding-bottom:4.5rem;
height: auto;
/* Force Hardware Acceleration in WebKit */
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property: transform;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
transition-duration: 0.4s;
}
.cd-main-content.lateral-menu-is-open {
/* translate to show the lateral menu - all content needs to be put in the .cd-main-content to translate*/
-webkit-transform: translateX(-40%);
-moz-transform: translateX(-40%);
-ms-transform: translateX(-40%);
-o-transform: translateX(-40%);
transform: translateX(-40%);
}
header.lateral-menu-is-open {
/* translate to show the lateral menu */
-webkit-transform: translateX(-40%);
-moz-transform: translateX(-40%);
-ms-transform: translateX(-40%);
-o-transform: translateX(-40%);
transform: translateX(-40%);
}
header .is-fixed { position: fixed;}
#cd-top-nav { position: absolute; top: 0; right: 120px; height: 100%;display: none;}
#cd-top-nav ul {height: 100%;padding-top: 18px;}
#cd-top-nav li {display: inline-block;margin-right: 1em;}
#cd-top-nav a {display: inline-block; padding: .5em;color: #FFF;text-transform: uppercase;font-weight: 600;}
#cd-top-nav a.current {background-color: #242e30;}
.no-touch #cd-top-nav a:hover { color: rgba(255, 255, 255, 0.7);}
@media only screen and (min-width: 768px) {#cd-top-nav { display: block;}}
a#cd-menu-trigger { position: absolute;right: 0;top: 0; height: 100%; width: 50px;}
a#cd-menu-trigger .cd-menu-text {height: 100%; text-transform: uppercase; color: #FFF;font-weight: 600; display: none;}
a#cd-menu-trigger .cd-menu-icon {
opacity:0;
/* this span is the central line in the menu menu */
display: inline-block;
position: absolute;
left:40%;
top: 50%;
bottom: auto;
right: auto;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
width:40px;
height:40px;
background-color: #FFF;
/* these are the upper and lower lines in the menu menu */
}
#cd-menu-trigger .cd-menu-icon::before, #cd-menu-trigger .cd-menu-icon:after {
content: '';
opacity:0;
width: 100%;
height: 100%;
position: absolute;
background-color: inherit;
left: 0;
/* Force Hardware Acceleration in WebKit */
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
}
#cd-menu-trigger .cd-menu-icon::before { bottom: 5px; display:none;}
#cd-menu-trigger .cd-menu-icon::after {top: 0px;}
#cd-menu-trigger.is-clicked .cd-menu-icon { background-color: rgba(255, 255, 255, 0);}
#cd-menu-trigger.is-clicked .cd-menu-icon::before, #cd-menu-trigger.is-clicked .cd-menu-icon::after {background-color: white;}
#cd-menu-trigger.is-clicked .cd-menu-icon::before {
bottom: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
#cd-menu-trigger.is-clicked .cd-menu-icon::after {
top: 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
@media only screen and (min-width: 768px) {#cd-menu-trigger {width: 110px; padding-left: 1.25em;}
#cd-menu-trigger .cd-menu-text {display: inline-block;line-height: 70px;}
#cd-menu-trigger .cd-menu-icon { left: auto;right: 1.25em;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
}
#cd-lateral-nav {z-index:555; position: fixed;height:100%;
right:-40%;
top: 0;
/* the secondary navigation is covered by the main element */
width:40%;
box-shadow: 0px 0px 5px #adadad;
background-color:#ffffff;
overflow-y: auto;
/* Force Hardware Acceleration in WebKit */
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property: transform;
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
transition-duration: 0.4s;
/* this creates the subtle slide in animation of the navigation */
-webkit-transform: translateX(100%);
-moz-transform: translateX(100%);
-ms-transform: translateX(100%);
-o-transform: translateX(100%);
transform: translateX(100%);
}
#cd-lateral-nav .cd-navigation { margin:0px;}
#cd-lateral-nav .sub-menu { display:none;padding:10px 10px 10px 10px;box-sizing: border-box;width: 100%; display: none;position: absolute;background: #f1efe1; z-index: 999;}
#cd-lateral-nav .sub-menu li{height: 32px;line-height: 32px;overflow: hidden;}
li.item-has-children{ height:50px; line-height:50px; }
li.item-has-childrens{ height:50px; line-height:50px; }
#cd-lateral-nav a {border-bottom:1px solid #f1f1f1;display: block;font-size:0.75rem; color:#000;text-align:center;}
#cd-lateral-nav a.current { background-color: #3a4a4d; color: #FFF;}
.no-touch #cd-lateral-nav a:hover {color: #FFF;}
@media only screen and (min-width: 768px) { #cd-lateral-nav .cd-navigation { margin: 20px 0;}}
#cd-lateral-nav.lateral-menu-is-open {
-webkit-transform: translateX(-100%);
-moz-transform: translateX(-100%);
-ms-transform: translateX(-100%);
-o-transform: translateX(-100%);
transform: translateX(-100%);
/* smooth the scrolling on touch devices - webkit browsers */
-webkit-overflow-scrolling: touch;
}
/* style menu items which have a submenu */
#cd-lateral-nav .item-has-children > a {position: relative;text-transform: uppercase;/* this is the right arrow to show that the item has a submenu */}
#cd-lateral-nav .item-has-children > a::after {
content: '';
display: block;
height: 11px;
width: 8px;
position: absolute;
top: 50%;
bottom: auto;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
right: 1em;
/* background: url("../img/cd-arrow.svg") no-repeat center center;
background-size: 8px 11px;*/
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property: transform;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
transition-duration: 0.2s;
}
#cd-lateral-nav .item-has-children > a.submenu-open::after {
-webkit-transform: translateY(-50%) rotate(90deg);
-moz-transform: translateY(-50%) rotate(90deg);
-ms-transform: translateY(-50%) rotate(90deg);
-o-transform: translateY(-50%) rotate(90deg);
transform: translateY(-50%) rotate(90deg);
}
#cd-lateral-nav .socials { padding: 0 32px;}
#cd-lateral-nav .socials:after { content: "";display: table; clear: both;}
#cd-lateral-nav .socials a {
height: 32px;
width: 32px;
float: left;
padding: 0;
background-image: url("../img/cd-socials.svg");
background-repeat: no-repeat;
background-size: 128px 64px;
background-color: #FFF;
margin-right: .5em;
border-radius: 0.25em;
}
#cd-lateral-nav .socials a.cd-twitter {background-position: 0 0;}
#cd-lateral-nav .socials a.cd-github {background-position: -32px 0;}
#cd-lateral-nav .socials a.cd-facebook {background-position: -64px 0;}
#cd-lateral-nav .socials a.cd-google { background-position: -96px 0;}
.no-touch #cd-lateral-nav .socials a:hover { background-color: #4e6361;}
.no-touch #cd-lateral-nav .socials a:hover.cd-twitter { background-position: 0 -32px;}
.no-touch #cd-lateral-nav .socials a:hover.cd-github { background-position: -32px -32px;}
.no-touch #cd-lateral-nav .socials a:hover.cd-facebook {background-position: -64px -32px;}
.no-touch #cd-lateral-nav .socials a:hover.cd-google { background-position: -96px -32px;}
/*手机右侧滑出样式*/
/*单选、多选、开关*/
.aui-radio,
.aui-checkbox {
width: 1.3rem;
height: 1.3rem;
background:rgba(255, 235, 205, 0);
border: solid 1px #dddddd;
-webkit-border-radius:10rem;
border-radius: 10rem;
font-size: 0.8rem;
margin: 0;
padding: 0;
position: relative;
display: inline-block;
vertical-align: top;
cursor: default;
-webkit-appearance: none;
-webkit-user-select: none;
user-select: none;
-webkit-transition: background-color ease 0.1s;
transition: background-color ease 0.1s;
}
.aui-checkbox {
border-radius:10rem;
}
/**/
.aui-radio:checked,
.aui-radio.aui-checked,
.aui-checkbox:checked,
.aui-checkbox.aui-checked {
background-color: #09ba07;
border: solid 1px #09ba07;
text-align: center;
background-clip: padding-box;
}
.aui-radio:checked:before,
.aui-radio.aui-checked:before,
.aui-checkbox:checked:before,
.aui-checkbox.aui-checked:before,
.aui-radio:checked:after,
.aui-radio.aui-checked:after,
.aui-checkbox:checked:after,
.aui-checkbox.aui-checked:after {
content: '';
width: 0.5rem;
height: 0.3rem;
position: absolute;
top: 50%;
left: 50%;
margin-left: -0.25rem;
margin-top: -0.25rem;
background: transparent;
border: 1px solid #ffffff;
border-top: none;
border-right: none;
z-index: 2;
-webkit-border-radius: 0;
border-radius: 0;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.aui-radio:disabled,
.aui-radio.aui-disabled,
.aui-checkbox:disabled,
.aui-checkbox.aui-disabled {
background-color: #dddddd;
border: solid 1px #dddddd;
}
.aui-radio:disabled:before,
.aui-radio.aui-disabled:before,
.aui-radio:disabled:after,
.aui-radio.aui-disabled:after,
.aui-checkbox:disabled:before,
.aui-checkbox.aui-disabled:before,
.aui-checkbox:disabled:after,
.aui-checkbox.aui-disabled:after {
content: '';
width: 0.5rem;
height: 0.3rem;
position: absolute;
top: 50%;
left: 50%;
margin-left: -0.25rem;
margin-top: -0.25rem;
background: transparent;
border: 1px solid #ffffff;
border-top: none;
border-right: none;
z-index: 2;
-webkit-border-radius: 0;
border-radius: 0;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
/*兼容*/
@media screen and (min-device-width:500px){ html, body{ width:500px; margin:auto;}}
@media screen and (min-width: 400px) and (max-device-width:420px){
}
@media screen and (min-width: 350px) and (max-device-width:365px){
}
@media screen and (min-width: 310px) and (max-device-width:330px){
}