﻿@charset "utf-8";
/* CSS Document */
html,body{ font:normal 100% Helvetica, 微软雅黑, sans-serif; width:100%; padding:0px; margin:0px; border:0px;  font-size:12px; }
div { word-break: normal; word-wrap: break-word; }

a img { border:0; }

a:link{ text-decoration:none; }

a:hover,a:visited,a:active{text-decoration:underline;}

/*top style*/
#quickAndLogin{ width:100%; height:30px; line-height:30px; font-size:13px; background:#FFF; border-bottom:solid 1px #DDD;  }

.quickAndLogin{ width:1190px; margin:0 auto; padding:0 5px; }

#loginState{ float:left; color:#555; }

#loginState a{ color:#EB8B1C; margin:0 8px; }

#cityPanel{ display:none; float:left; height:30px; line-height:30px; font-size:13px; color:#36B0BF; padding:0 15px; font-weight:bold; margin-left:20px; border-left:solid 1px #DDD; border-right:solid 1px #DDD; cursor:default; }

#quickTool{ float:right; height:30px; margin-right:10px; }

#quickTool > div{ float:right; padding:0 10px; height:30px; line-height:30px; cursor:pointer; letter-spacing:1px; position:relative; z-index:39; }

.noLinkMenu{ cursor:default; } .noLinkMenu a{ color:#247E83; }

.menuTopArrow{ background:url(../../Images/common/topArrow.png) no-repeat bottom center; }

.floatQrCode{ background:#E2E0E0; padding:10px; position:absolute; z-index:66; display:none; }

.floatQrCode img{ width:180px; height:180px; }

.quickSpan{ color:#239BA5; font-size:13px; }

.quickPanel{ position:absolute; z-index:38; padding-top:30px; background:#FFF; border:solid 1px #BBB; border-top:0; display:none; }

.quickPanel > div{ line-height:26px; width:100%; text-align:center; } .quickPanel a{ color:#555; }

#touch{ position:fixed; z-index:36; top:0; left:0; width:100%; height:100%; display:none;}

/*logo and search style*/
#logoAndSearch{ width:100%; height:91px; clear:both; background:#FFF; padding-bottom:0.6em; }

.logoAndSearch{ width:1190px; margin:0 auto; height:60px; padding:5px; }

#logo{ float:left; height:90px; width:auto; cursor:pointer; vertical-align:middle; margin-right:60px; }

#searchTool { height: 46px; border: solid 2px #0BACA7; width: 592px; margin-top: 8px;border-radius:24px }

#searchText { float: left; border: 0; padding: 0px; padding-left: 20px; margin: 0; width: 507px; height: 100%; line-height: 38px; font-size: 16px; color: #666; letter-spacing: 2px;background:none }

#searchText:focus { outline: none; }

#searchButton { border: 0; margin: 0; padding: 0; height: 46px; width: 64px; cursor: pointer; float: right; position: relative; border-bottom-right-radius: 23px; border-top-right-radius: 23px; background: #0BACA7;margin-right:-1px }

#searchKeyWord{ height:25px; letter-spacing:1px; clear:both; margin-top:10px; }

#searchKeyWord a{ font-size:12px; color:#777; margin-right:20px; }

#searchKeyPanel{ display:none; position:fixed; z-index:66; width:510px; border:solid 1px #DDD; background:#FFF; box-shadow:0 0 0.2rem rgba(0,0,0,0.2); }

.searchKeyLimit{ height:406px; overflow-x:hidden; overflow-y:auto; }

#searchKeyPanel div{ height:40px; line-height:40px; width:475px; padding:5px 10px; border-bottom:solid 1px #EEE; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; cursor:pointer; }

#searchKeyPanel div img{ height:38px; width:auto; vertical-align:middle; border:0; margin-right:10px; box-shadow:0 0 0.15rem rgba(0,0,0,0.2); }

.floatSearch{ position:fixed; z-index:58; top:0; left:0; background:#36B7BF; -webkit-box-shadow:1px 1px 2px 1px rgba(0,0,0,0.3); -moz-box-shadow:1px 1px 2px 1px rgba(0,0,0,0.3); box-shadow:1px 1px 2px 1px rgba(0,0,0,0.3); }

.minSearch { background:#36B7BF; -webkit-box-shadow:1px 1px 2px 1px rgba(0,0,0,0.4); -moz-box-shadow:1px 1px 2px 1px rgba(0,0,0,0.4); box-shadow:1px 1px 2px 1px rgba(0,0,0,0.4);}

#shopcarBox{ float:right; height:35px; padding:5px 10px;  line-height:35px; cursor:pointer; font-size:16px; color:#AAA; font-weight:bold; margin:12px 40px 0 0; letter-spacing:2px;position:relative }

#shopcarBox img{ height:86%; width:auto; vertical-align:middle; margin-right:5px; }

#serviceImg{ height:100%; width:auto; margin:0 10px; vertical-align:middle; }

/*menus style*/
#menuChannel{ width:100%; border-bottom:solid 2px #239BA5; background:#FFF; clear:both; padding-top:10px;  }

#menuPanel{ width:1200px; height:45px; margin:0 auto; }

#productClassTitle { float: left; background: #078C89; padding-left: 20px; width: 180px; height: 45px; line-height: 45px; font-size: 16px; font-weight: bold; letter-spacing: 1px; color: #FFF;z-index:0 }

#productClassTitle img{ width:28px; height:28px; vertical-align:middle; margin-right:10px;margin-left:10px }

#menuList{ float:left; height:45px; padding-left:1.5em; }

#menuList > div{ padding:0 20px; float:left; height:45px; line-height:45px; }

#menuList a{ font-size:16px; font-weight:bold; letter-spacing:3px; color:#444; }

.menuMove { font-weight:bold; text-decoration:underline; }

.menuSelected{ background:url(../../Images/common/menuArrow.png) no-repeat center bottom; font-weight:bold; }

#productClassFloat { display: none; position: absolute; z-index: 55; height: 350px; flex-direction:column }

.productClassPanel{ float:left; width:199px; height:349px; background:#2A8C97; border:1px solid #2A8C97; border-top:0; border-right:0; }

.productClassPanel > div{ padding:10px 0 10px 20px; height:30px; line-height:30px; font-size:17px; color:#FFF; letter-spacing:2px; cursor:default; }

.commonProductClass { width: 200px; background: #239BA5; }

.commonProductClass a { font-size: 15px; color: #FFF; }

.productClassPanel > div img{ height:26px; width:auto; vertical-align:middle; margin-right:10px; }

.selectProductClass{ width:199px; position:relative; z-index:88; background:url(../../Images/common/menuBG.png); }

.selectProductClass a{ font-size:15px; color:#000; }

.menuTitleFloat{ position:relative; z-index:78; }

/*product classification float window style*/
#classificationFloat { position: absolute; z-index: 55; padding: 10px; width: 760px; background: #FFF; border: solid 1px #2A8C97; display: none; }

.classificationPanel { display:none; }

.classificationList{ clear:both; }

.classificationTitle{ width:140px; line-height:30px; font-size:14px; color:#444; text-align:right; float:left; }

.classificationTitle a{ font-size:14px; color:#555; font-weight:bold; }

.classificationContent{ float:right; width:600px; line-height:30px; border-bottom:dashed 1px #DDD; padding-bottom:5px; }

.classificationContent > a{ color:#555; margin-right:20px; font-size:14px; }

/*bottom style*/
#bottom{ clear:both; width:100%; }

#linkPanel{ background:#2A8C97; width:100%; height:20px; line-height:20px; padding:15px 0; color:#FFF; font-size:16px; text-align:center; margin-bottom:20px; }

#linkPanel a{ color:#FFF; margin:0 5px; font-size:15px; }

#bottomHelpPanel{  width:1200px; height:200px; margin:0 auto; border-bottom:solid 1px #DDD; }

#bottomHelpPanel > div{ float:left; height:180px; }

#serviceListPanel{ width:660px;  padding:0 20px; border-right:solid 1px #DDD; }

#serviceListPanel > div{ float:left; width:145px; margin:0 10px; }

#serviceListPanel span{ line-height:25px; font-size:14px; }

#serviceListPanel b{ line-height:50px; font-size:20px; letter-spacing:2px; color:#696969; }

#serviceListPanel a{ color:#767676; }

#qrCodePanel{ width:210px; padding:0 15px; float:right; text-align:center; }

#qrCodePanel img{ width:70%; height:auto; vertical-align:text-top; margin:5px 0; }

#qrCodePanel span{ line-height:25px; font-size:16px; color:#767676; }

#servicePhoneAndAddress{ width:210px; padding-left:40px; text-align:left; font-size:16px; color:#767676; }

#servicePhoneAndAddress div{ line-height:40px; height:40px; }

#servicePhoneAndAddress b{ font-size:26px; margin-bottom:10px; color:#767676; }

#servicePhoneAndAddress span{ font-size:16px; color:#767676; }

#butMap{ height:20px; line-height:20px; padding:8px 16px; font-size:16px; color:#FFF; cursor:pointer; position:relative; z-index:4; background:#196469; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }

#butMap img{ height:20px; width:auto; vertical-align:middle; margin-left:3px; }

#bottomCertificate{ clear:both; width:1200px; padding:15px 0; margin:0 auto; }

#record{ margin:10px 0; clear:both; height:30px; width:100%; text-align:center; }

#record ul{ text-align:center; list-style-type:none; }

#record ul li{ padding:0 5px; width:100px; height:30px; font-size:12px; color:#555; border-right:solid 2px #CCC; text-align:center; display:inline; word-break:break-all; word-wrap:break-word ; }

#record img{ height:30px; width:auto; cursor:pointer; vertical-align:middle; } #record a{ border:0; }

#statement{ line-height:30px; clear:both; text-align:center; font-size:13px; color:#555; letter-spacing:1px; }

#statement a{ color:#555; }

/*tools style*/
#toolbarSetting{ width:50px; position:fixed; z-index:69; bottom:80px; right:0; }

#toolbarSetting > div{ width:50px; margin-bottom:2px; background:#DDD; }

#toolbarSetting img{ width:100%; height:auto; vertical-align:text-bottom; cursor:pointer; }

.clewToolbar{ background:url(../../Images/common/leftArrow.png) no-repeat left center; background-color:#2A8C97; }

.clewToolbarText{ background:#2B9197; height:40px; line-height:40px; padding:0 10px; font-size:13px; color:#FFF; letter-spacing:1px; display:none; position:fixed; z-index:72; cursor:pointer; }

#noClew{ font-size:17px; color:#FFF; letter-spacing:1px; text-align:center; }

#noClew img{ margin-bottom:1px; }

.shopNum { position: absolute; top: 0; left: 30px; z-index: 70; background: #F43530; width: 20px; height: 20px; text-indent: 1px; line-height: 20px; text-align: center; font-size: 12px; font-weight: bold; color: #FFF; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 20px;transform:scale(0.9) }

/*data load panel style*/
#toolLoadPanel{ position:fixed; z-index:68; width:380px; height:480px; background:#FFF; display:none; -webkit-box-shadow:1px 2px 2px 1px rgba(0,0,0,0.2); -moz-box-shadow:1px 2px 2px 1px rgba(0,0,0,0.2); box-shadow:1px 2px 2px 1px rgba(0,0,0,0.2); }

#toolLoadTop{ height:40px; width:360px; padding:5px 10px; background:#F2F2C7; }

#toolLoadTitle{ float:left; line-height:40px; font-size:16px; letter-spacing:3px; color:#444; margin-left:8px; }

#toolLoadClose{ float:right; height:40px; width:auto; cursor:pointer; }

#toolLoadContent{ width:360px; height:410px; padding:10px; overflow-x:auto; overflow-y:hidden; }

#toolPanelTitle{ padding-left:10px; font-size:15px; color:#666; letter-spacing:1px; margin-bottom:25px; }

.loading { width:220px; height:auto; }

.text{ background:#FFF; margin-bottom:25px; height:40px; color:#333; -webkit-box-shadow:0 0 3px 0 #AAA; -moz-box-shadow:0 0 3px 0 #AAA; box-shadow:0 0 3px 0 #AAA; }

.text img{ width:40px; height:40px; float:left; vertical-align:text-bottom; margin:0; margin-right:5px; border:0; padding:0; }

.text input{ float:right; border:0; margin:0; padding:0; background:none; width:155px; height:30px; line-height:30px; color:#666; font-size:16px; letter-spacing:1px;  }
 
#submit{ background:#EA8A1C; width:100%; height:40px; line-height:40px; border:0; margin-bottom:25px; padding:0; color:#FFF; font-size:18px; letter-spacing:5; font-weight:bold; cursor:pointer; }

#registeredOrForgot{ font-size:14px; letter-spacing:1px; padding:0 5px; }

#registeredOrForgot > div{ float:right; margin-right:8px; } #registeredOrForgot > div a{ color:#239BA5; font-size:14px; }

/*select city panel */
#selectCityPanel{ display:none; position:fixed; z-index:99; width:280px; height:160px; padding:20px; background:#FFF; border-radius:5px; box-shadow:0 0 5px rgba(0,0,0,0.3); }

#selectCityPanel .title{ background:#EEE; height:40px; line-height:40px; text-align:center; font-size:14px; color:#2A8C97; }

#selectCityPanel .select{ height:30px; padding:5px 0; }

.weui_select { color: #444; background: #FFF; padding: 0 5px; width:280px; height: 30px; line-height: 30px; font-size: 13px; }

#selectCityPanel .button{ background:#2A8C97; color:#FFF; font-size:14px; text-align:center; height:40px; line-height:40px; cursor:pointer; }

/*other style*/
.floatBlackBG{ width:100%; height:100%; position:fixed; z-index:88; left:0; top:0; display:none; background:rgba(0,0,0,0.4); }

#shopMapIFrame{ width:720px; height:480px; position:fixed; z-index:99; display:none; -webkit-box-shadow:0 0 0 8px rgba(0,0,0,0.4); -moz-box-shadow:0 0 0 8px rgba(0,0,0,0.4); box-shadow:0 0 0 8px rgba(0,0,0,0.4); }

#shopMapIFrame #mapPanel{ width:100%; height:100%; }

#floatClose{ width:35px; height:35px; cursor:pointer; position:fixed; z-index:108; background:url(../../Images/common/floatClose.png); display:none; }

#clewMeg { position:fixed; z-index:999; padding:1.5em 3em; color:#EB8B1C; font-size:22px; font-weight:bold; letter-spacing:2px; background:rgba(0,0,0,0.6); cursor:pointer; display:none; }

#clewMeg b{ color:#EB8F22; }

#clewBG{ position:fixed; z-index:888; top:0; left:0; width:100%; height:100%; display:none; background:rgba(0,0,0,0.1); }

#clewLoading{ position:fixed; z-index:9999; width:250px; height:250px; display:none; }

#clewLoading img{ width:100%; height:100%; border:0; margin:0; }

#clewLoadBG{ position:fixed; z-index:8888; top:0; left:0; width:100%; height:100%; display:none; background:rgba(0,0,0,0.4); }

.floatWhiteBG{ width:100%; height:100%; position:fixed; z-index:88; left:0; top:0; display:none; background:rgba(255,255,255,0.4); cursor:default; }

.floatImage{ position:fixed; z-index:99; padding:2rem; box-shadow:0 0 0 8px rgba(0,0,0,0.4); background:#FFF; cursor:pointer; }

.floatImage .title{ background:#EEE; font-size:18px; color:#5895CB; font-weight:bold; text-align:center; height:35px; line-height:35px; margin-bottom:5px; letter-spacing:1px; }

.floatImage img{ width:360px; height:360px; border:0; margin:0; }

#clewConfirm{ position:fixed; z-index:888; width:350px; background:#FFF; display:none; border:solid 1px #EEE; border-radius:6px; box-shadow:0 0 2px 0 rgba(0,0,0,0.2); }

#confirmTitle{ width:100%; text-align:center; height:30px; line-height:35px; font-size:16px; font-weight:bold; color:#000; }

#confirmHtml{ padding:20px; line-height:25px; font-size:14px; color:#555; }

#confirmInput{ height:40px; }

#confirmInput button{ padding:0; width:50%; text-align:center; height:40px; line-height:40px; font-size:16px; margin:0; border:0; cursor:pointer; }

#confirmInput #butConfirm{ background:#279CA5; color:#FFF; }

#confirmInput #butCancel{ background:#E2E2E2; color:#454545; }

#touch { position: fixed; z-index: 36; top: 0; left: 0; width: 100%; height: 100%; display: none; }