@charset "utf-8";
@import url("bootstrap-icons.min.css");
/* CSS Document */
body { margin: 0; padding: 0; color: #333; font: 14px/1.5 "Microsoft YaHei", Arial, Verdana; background: #f4f4f4; }
a { color: #333; text-decoration: none; }
a:hover { color: #333; text-decoration: none; }
h1, h2, h3, h4, form, p, dl, dt, dd, ul, li { margin: 0; padding:0; }
ul { list-style:none;}
img { border: none; margin: 0px; padding:0; }
em { font-style: normal; }
table { font-size: 14px; }
td { margin: 0px; padding: 2px; }
.clearfloat2 { clear:both; height:0; font-size: 1px; line-height: 0;}
.clearfloat:before, .clearfloat:after{ display: block; clear: both; content: ""; visibility: hidden; height: 0; }
.clearfloat{ zoom:1 }
.autohide { display: none; }
::-webkit-input-placeholder { color: #BFBFBF; } /* WebKit, Blink, Edge */
:-moz-placeholder { color: #BFBFBF; opacity: 1; } /* Mozilla Firefox 4 to 18 */
::-moz-placeholder { color: #BFBFBF; opacity: 1; } /* Mozilla Firefox 19+ */
:-ms-input-placeholder { color: #BFBFBF; } /* Internet Explorer 10-11 */
/* header */
#header { margin:0 auto; max-width:750px; padding: 0; height: 50px; }
#main { margin:0 auto; max-width:750px; padding: 0;}
section { margin: 10px; padding: 10px; background: #FFF; border-radius: 8px; }
#footer { margin:0 auto; max-width:750px; padding: 0; height: 54px; }
.nav {}

.wrap{ margin:0 auto; max-width:750px; padding: 0;}

.header-index { height: 50px; }
.header-index .logo { position: relative; text-align: center; margin: 0px 50px; }
.header-index .logo img { padding-top: 15px; height: 22px; }
.header-index .menu { float: left; width: 50px; height: 50px; text-align: left; }
.header-index .menu i { font-size: 24px; line-height: 50px; padding-left: 15px; }
.header-index .contact { float: right; width: 50px; height: 50px; text-align: right; }
.header-index .contact i { font-size: 24px; line-height: 50px; padding-right: 15px; }
.header-index h1 { font-size: 22px; line-height: 50px; margin: 0px 50px; color: #333; font-weight: normal; text-align: center; }

.header { height: 50px; background: #fff; position: fixed; top: 0; width: 100%; max-width: 750px; z-index: 99; }
.header h1 { font-size: 18px; line-height: 50px; margin: 0px 50px; color: #333; font-weight: normal; text-align: center; }
.header .goback { float: left; width: 50px; height: 50px; text-align: left; }
.header .goback i { font-size: 22px; line-height: 50px; padding-left: 10px; }
.header .gohome { float: right; width: 50px; height: 50px; text-align: right; }
.header .gohome i { font-size: 22px; line-height: 50px; padding-right: 15px; }

.header-bar { height: 44px; text-align: center; background: #FFFFFF; border-bottom: 1px solid #E3E3E3; }
.header-bar .goback, .goback-order { float: left; background: url(../img/icon_goback.png) no-repeat center center; background-size:24px 24px; width: 40px; height: 36px; margin-top: 5px; }
.header-bar h1 { font-size: 16px; line-height: 44px; font-weight: normal; margin: 0px 80px; color: #333; }
.header-city { height: 44px; text-align: center; background: #FFFFFF; }
.header-city h1 { font-size: 22px; line-height: 44px; font-weight: normal; color: #333; }

.hero { background: #F5F5F5; }
.hero img { width: 100%; max-width:750px; height: auto; display: block; }

.local-city { height: 42px; line-height: 42px; padding: 0px 7px; background: #FFF; }
.local-city em { padding: 0px 5px; color: #666; }

.header-navbar { margin: 10px; padding: 15px 0; background: #FFF; border-radius: 8px; }
.header-navbar ul { list-style: none; margin: 0; padding: 0; font-size: 14px; color: #333; text-align: center; line-height: 1; width: 100%; float: left; }
.header-navbar ul li { float: left; width: 25%; }
.header-navbar ul li i { font-size: 30px; color: #FF3B51; display: block; margin-bottom: 8px; }
.header-navbar ul li a { color: #333; display: inline-block; padding: 0 10px; }
.header-navbar:after { display: block; clear: both; content: ""; height: 0; }

.brand-navbar { margin: 10px; padding: 20px 0; background: #FFF; border-radius: 8px; }
.brand-navbar h3 { font-size: 20px; text-align: center; margin: 10px 0 20px; font-weight: bold; }
.brand-navbar ul { font-size: 14px; font-weight: bold; color: #333; line-height: 1; width: 100%; float: left; }
.brand-navbar ul li { float: left; width: 50%; margin-bottom: 20px; box-sizing: border-box; text-align: center; }
.brand-navbar ul li i { font-size: 32px; width: 32px; height: 32px; color: #FF3B51; display: block; border: 2px solid #FF3B51; border-radius: 50%; padding: 8px; margin: 10px auto; }
.brand-navbar:after { display: block; clear: both; content: ""; height: 0; }


.nav { margin: 10px; padding: 10px 0; border-radius: 8px; background: #FFF; }
.nav ul li { float:left; display: inline; width: 25%; letter-spacing: 1px; text-align: center; font-size: 12px; position:relative; }
.nav ul li a { display:block; width: 100%; }
.nav ul li span { width:60px; height:60px; display: block; margin:0 auto; background: url(../img/nav_img.jpg) no-repeat; background-size:60px 240px; -moz-background-size:60px 240px; -o-background-size:60px 240px; -webkit-background-size:60px 240px;border-radius: 30px;}
.nav ul li .n1 span { background-position:0 0; }
.nav ul li .n2 span { background-position:0 -60px; }
.nav ul li .n3 span { background-position:0 -120px; }
.nav ul li .n4 span { background-position:0 -180px; }

.subnav { height: 50px; width: 100%; overflow: hidden; border-top: 1px solid #E9E9E9; }
.subnav .sub { float: left; width: 25%; height: 50px; background: #FFF; text-align: center; line-height: 50px; }
.subnav .on { color: #E42B2B; }
.more { background: #FFF; text-align: center; padding: 8px; margin: 15px 0px; border: 1px solid #E4E4E4; }

.pro-navbar { margin: 10px 10px 0 10px; }
.pro-navbar:after { display: block; clear: both; content: ""; height: 0; }
.pro-navbar .proA { float: left; width: calc(50% - 5px); }
.pro-navbar .proB { float: right; width: calc(50% - 5px); }
.pro-navbar .proC { float: right; width: calc(50% - 5px); margin-top: 8px; }
.pro-navbar img { width: 100%; display: block; border-radius: 8px; }

.probox { width: 100%; }
.probox .pro_ad { display: block; padding-top: 10px; }
.probox .pro_ad img { display: block; width: 100%; overflow: hidden; }
.probox h1 { margin-left: 10px; font-size: 16px; line-height: 32px; height: 32px; }
.probox h2 { line-height: 1.4; text-align: center; font-size: 22px; font-weight: normal; margin: 20px 0 10px 0; }
.probox h3 { line-height: 1.4; text-align: center; font-size: 22px; font-weight: normal; margin: 20px 0 10px 0; }
.probox h2 span, .probox h3 span { display: block; font-size: 14px; color: #999; padding-top: 10px; }

.proList { margin: 0 5px; }
.proList li { width: calc(50% - 10px); float: left; margin: 10px 5px 0 5px; background: #FFF; border-radius: 8px; overflow: hidden; }
.proList li a { display: block; }
.proList li img { width: 100%; display: block; }
.proList li .title { font-size: 14px; margin: 8px 10px 0px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.proList li .title em { padding-left: 6px; }
.proList li .price { font-size: 18px; color: #FF3B51; margin: 6px 10px 10px; display: block; }

.menu-item { padding: 20px 10px; }
.menu-item h3, .pro_menu h4 { font-size: 18px; font-weight: bold; }
.menu-item ul li { width: 25%; float: left; font-size: 14px; text-align: center; box-sizing: border-box; margin-top: 20px; }
.menu-item ul li a { display: block; color: #333; background: #F7F9FA; border-radius: 4px; margin: 0 5px; padding: 10px 0; }

.footer-menu { margin-top: 10px; padding: 25px 0; background: #FFF; }
.footer-menu ul li { width: 25%; float: left; font-size: 14px; text-align: center; margin: 20px 0; box-sizing: border-box; }
.footer-menu ul li a { padding: 10px 15px; color: #333; background: #E9ECF0; border-radius: 4px; }

.footer { margin:0px auto; min-width:320px; max-width:640px; padding-bottom: 20px; color: #999; }
.footer .loginbar { border-bottom: 1px solid #E5E5E5; padding: 10px; }
.footer .loginbar em { float:right; }
.footer .loginbar span { font-size: 12px; color: #960; }
.footer p { text-align: center; padding-top: 10px; }
.footer a { padding: 6px; color: #999; }
.footer .copr { font-size: 12px; color: #999; }

.pro-info { position: relative; z-index: 99; margin-top: -12px; background: #f4f4f4; border-radius: 12px; padding: 10px 15px; }
.pro-info .pro-price { padding-top: 10px; }
.pro-price i { font-size: 16px; color: #FF3B51; font-style: normal; margin-right: 2px; }
.pro-price .price { font-size: 30px; line-height: 26px; font-weight: bold; color: #FF3B51; display: inline-block; }
.pro-price .price-all { color: #999999; margin-left: 15px; text-decoration: line-through; font-size: 16px; }
.pro-price .coupon { float: right; color: #FF3B51; }
.pro-info h2 { font-size: 16px; font-weight: bold; padding-top: 10px; color: #333; }
.pro-info h2 em { padding-right: 8px; }

.pro-box-title { width: 6em; margin: 0 auto; background: #f4f4f4; text-align: center; padding: 20px 0; font-size: 16px; line-height: 1; font-weight: bold; }
.pro-box-title::before { content: ""; display: block; width: 2em; height: 0; border-top: 1px solid #b4babf; margin: auto auto -0.5em -2em; }
.pro-box-title::after { content: ""; display: block; width: 2em; height: 0; border-top: 1px solid #b4babf; margin: -0.5em auto auto 6em; }

.pro-box { background: #FFF; margin: 10px 10px 0 10px; padding: 10px; font-size: 14px; border-radius: 8px; }
.pro-box h3 { font-size: 16px; border-bottom: 1px solid #F2F2F2; padding: 0px 10px 6px; }
.pro-box img { width: 100%; margin-bottom: 6px; display: block; }
.pro-box p { display: block; overflow:auto; zoom:1; padding: 10px 0; }
.pro-box p strong { float: left; font-weight: normal; color: #999; }
.pro-box p em { display: block; margin-left: 40px; }
.pro-box p .last { padding-bottom: 0px; border-bottom: 0px; }
.pro-box dl { padding: 10px 0px; letter-spacing: 1px; font-size: 14px; }
.pro-box dl dt { font-weight: bold; background: #F8F8F8; padding: 5px 10px; }
.pro-box dl dd { padding: 5px 10px; }
.pro-box dl dd a { color: #00F; }
.pro-box .sdate { padding: 10px; }

.pro-images { margin: 10px 10px 0 10px; }
.pro-images img { width: 100%; margin-bottom: 10px; display: block; }
.mb-footer { margin-bottom: 72px; }
.mt-header { margin-top: 60px; }
.mtb-hf { margin-top: 60px; margin-bottom: 64px; }

.bz1 { border: 1px solid #E4393C; padding:6px 25px; margin-right:8px; background: #FFF url(../img/selected.png) no-repeat right bottom; cursor: pointer; }
.bz2 { border: 1px solid #E0E0E0; padding:6px 25px; margin-right:8px; background-color:#FFF; cursor: pointer; }

.myprolist { background: #FFF; border-bottom: 1px solid #F5F5F5; padding: 10px; margin: 10px; border-radius: 8px; font-size: 12px; line-height: 2; }
.myprolist img { display: block; float: left; height: 80px; width: 80px; border-radius: 4px; }
.myprolist p { float: left; margin: 5px 0 0 10px; font-size: 14px; }
.myprolist p em { display: block; color: #FF3B51; }
.myprolist .renew { float: right; margin: 5px 0 0 5px; text-align: right; }
.myprolist .renew .set_num { border: 1px #E5E5E5 solid; width: 84px; height: 22px; border-radius: 12px; margin-top: 20px; color: #999; }
.myprolist .renew .input_num { float: right; border: none; width: 30px; height: 20px; text-align: center; }
.myprolist .renew .btn_add { float: right; width: 24px; height: 22px; line-height: 22px; border-left: 1px solid #E5E5E5; text-align: center; font-size: 16px; cursor: pointer; }
.myprolist .renew .btn_sub { float: right; width: 24px; height: 22px; line-height: 22px; border-right: 1px solid #E5E5E5; text-align: center; font-size: 16px; cursor: pointer; }
.myprolist .renew .pro_del { font-size: 12px; color: #999; }
.cart_empty { padding: 50px 0px; background: #FFF; text-align: center; margin: 10px; border-radius: 8px; }
.cart_empty a { margin: 20px auto; color: #FF3B51; display: block; width: 120px; line-height: 30px; height: 30px; border-radius: 16px; border: 1px solid #FF3B51; }
.cart_jiesuan { text-align: center; margin: 20px 10px; font-size: 16px; }
.cart_jiesuan a { display: block; color: #FFF; border-radius: 2px; border: 0px; background: #FF3B51; padding: 10px; }
.cart_jiesuan input{ color: #FFF; border-radius: 2px; border: 0px; background: #FF3B51; width: 100%; padding: 10px; font-size: 16px; }

.order { background: #FFF; margin-top: 10px; padding: 6px; }
.order h2 { font-size: 14px; font-weight: bold; border-bottom: 1px solid #E5E5E5; color: #C60; }
.order p { margin: 5px; }
.order p strong { text-align: right; width: 90px; display: inline-block; font-weight: normal; }
.order p .beizhu { color: #999; font-size: 12px; }

.comment { padding: 0 10px; }
.comment ul { font-size: 14px; }
.comment ul li { padding: 10px 0; border-bottom: 1px solid #F2F2F2; }
.comment ul li em { float: right; color: #CCC; font-size: 12px; }
.comment ul li span { display: block; height: 32px; line-height: 32px; color: #333; padding-bottom: 6px; }
.comment ul li span i { float: left; width: 32px; height: 32px; margin-right: 10px; }
.comment ul li span .pl_img { background: url(../img/user.png) no-repeat center center; background-size: 36px 36px; border-radius: 50%; overflow: hidden; }
#site_zz { text-align: center; font-size: 12px; color: #aaa; padding: 6px; }
/*底部浮动条*/
.footer_detail { position: fixed; bottom: 0px; height: 49px; width: 100%; z-index: 99; max-width: 640px; text-align: center; background: #F5F5F5; }
.footer_detail a { display: block; height: 49px; color: inherit; box-sizing: border-box; }
.footer_detail [class^="icon-"] { display: inline-block; width: 24px; height: 24px; vertical-align: middle; background-repeat: no-repeat; -webkit-background-size: contain; background-size: contain; background-position: center; }
.footer_detail .icon-cart { background-image: url("../img/icon_cart.png"); }
.footer_detail .icon-chat { background-image: url("../img/icon_chat.png"); }
.footer_detail:after { content: ""; display: block; height: 0; clear: both; }
.footer_detail_list { float: left; width: 40%; }
.footer_detail_list:after { content: ""; display: block; height: 0; clear: both; }
.footer_detail_list li { float: left; width: 50%; height: 49px; font-size: 10px; box-sizing: border-box; }
.footer_detail_list li [class^="icon-"] { display: block; margin: 0 auto; }
.footer_detail_list li a { padding: 6px 0; line-height: 0.9; }
.footer_detail_list li + li { border-left: 1px solid #DDDDDD; }
.footer_detail_buy { float: left; width: 60%; color: #fff; }
.footer_detail_buy li { float: left; width: 50%; height: 49px; line-height: 49px; background-color: #FE9402; box-sizing: border-box; }
.footer_detail_buy li.buy { background-color: #FE0036; }
.footer_detail_buy { font-size: 14px; }

.footer-cart { position: fixed; bottom: 64px; height: 54px; width: 100%; z-index: 99; max-width: 750px; line-height: 44px; font-size: 16px; text-align: left; padding: 5px 10px; background: #fff; box-sizing: border-box; }
.footer-cart em { color: #FF3B51; font-weight: bold; }
.footer-cart a { background: #FF3B51; float: right; color: #FFF; width: 138px; border-radius: 22px; text-align: center; }

.footer-detail { max-width:750px; width: 100%; position: fixed; bottom: 0; text-align: center; background: #fff; padding: 5px 10px 5px 0; z-index: 999; box-shadow: 0px -2px 15px rgba(0, 0, 0, 0.1); box-sizing: border-box; }
.footer-detail ul { list-style: none; margin: 0; padding: 0; color: #333; text-align: center; line-height: 1; width: 100%; float: left; }
.footer-detail ul li { float: left; }
.footer-detail ul li i { font-size: 18px; display: block; margin-bottom: 5px; }
.footer-detail ul li a { color: inherit; display: block; padding: 0; }
.footer-detail ul li .active { color: #FF3B51; }
.footer-detail ul .item-3 { width: 12%; font-size: 10px; padding: 5px 0; }
.footer-detail ul .item-cart { width: 32%; font-size: 16px; line-height: 45px; background-color: #FEF5F6; color: #FF3B51; border-radius: 8px 0 0 8px; }
.footer-detail ul .item-buy { width: 32%; font-size: 16px; line-height: 45px; background-color: #FF3B51; color: #fff; border-radius: 0 8px 8px 0; }

.footer_wrap{ margin:0 auto; min-width:320px; max-width:640px; padding: 0px;}

.footer-navbar { width: 100%; max-width:750px; position: fixed; bottom: 0; text-align: center; background: #F8F8F8; padding: 8px 0; z-index: 999; box-shadow: 0px -2px 15px rgba(0, 0, 0, 0.1); }
.footer-navbar ul { list-style: none; margin: 0; padding: 0; font-size: 12px; color: #333; text-align: center; line-height: 1; width: 100%; float: left; }
.footer-navbar ul li { float: left; width: 20%; }
.footer-navbar ul li i { font-size: 20px; display: block; margin-bottom: 5px; }
.footer-navbar ul li a { color: #333; display: inline-block; padding: 0 10px; }
.footer-navbar ul li .active { color: #FF3B51; }

.swiper-container { background: #FFF; }
.swiper-slide img { margin: 0px auto; display: block; max-width:750px; width: 100%; }
.swiper-pagination { width: 4em!important;left:auto!important;bottom: 22px!important; right: 5px; background: rgba(0, 0, 0, .3); border-radius: 2em;color: white; font-size: 12px; }


.orderList{ height: 73px; overflow: hidden; margin-top: 10px; padding: 0px 10px; }
.orderList ul{ width: 100%; height: 73px; margin: 0px auto; }
.orderList li{ width: 100%; height: 36px; line-height: 36px; font-size: 14px; border-bottom: 1px solid #F2F2F2; }
.orderList ul li em { float:left; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; }
.orderList ul li em:nth-child(1) { width: 15%; text-align: left; }
.orderList ul li em:nth-child(2) { width: 28%; text-align: left; }
.orderList ul li em:nth-child(3) { width: 39%; text-align: left; }
.orderList ul li em:nth-child(4) { width: 18%; text-align: right; color: #FF3B51; }

.city_content { padding: 10px; background: #FFF; margin-top: 10px; font-size: 12px;  }
.city_content p { line-height: 1.8; }

.comment_box { padding: 10px; background: #FFF; margin-top: 10px; line-height: 2; }
.comment_box h3 { font-size: 16px; font-weight: normal; margin-bottom: 10px; border-bottom: 1px solid #F2F2F2; }
.comment_box li { height: 60px; padding: 10px 0px; border-bottom: 1px solid #F2F2F2; }
.comment_box li img { float: left; border-radius: 8px; height: 60px; width: 60px; }
.comment_box li p { margin-left: 70px; line-height: 20px; }
.comment_box li .user { color: #999; font-size: 14px; }
.comment_box li .user em { float: right; }

.city_box { padding: 10px; background: #FFF; margin-top: 10px; line-height: 2; }
.city_box .local { margin: 10px 0px; }
.city_box .local em { margin: 0px 5px; color: #999; }
.city_box h3 { font-size: 16px; font-weight: normal; border-bottom: 1px solid #F2F2F2; }
.city_box ul li { float: left; font-size: 14px; margin: 5px 15px; }