:root{
    --maincolor: #933;
    --menucolor:#c96;
    --actcolor: #003;
}
body{font-size: 14px;color:#333;font-family: -apple-system,"Source Sans Pro","Noto Sans CJK SC","PingFang SC","Segoe UI","Microsoft YaHei",Helvetica,Arial,sans-serif;max-width: 640px;margin: auto; padding:3em 0 4em;}
*{padding: 0;margin: 0; font-style: normal; list-style: none; font-size:1em; box-sizing: border-box;}
img{max-width: 100%;}
a{color: #666; text-decoration:none;}
a:hover{color: var(--actcolor, #6cf);}

.fixed{position: fixed;left: 0;right: 0;max-width: 640px;margin: auto; z-index: 1;}
.ell{white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.tc{text-align: center;}
.top {text-align: center;background-color: var(--maincolor,#f63);font-size: 1.25em;color: #fff;padding: .3em; top: 0;}
.top h1{line-height: 1.8;}
.empty{text-align: center; color: #777;}
.empty:before{content: ""; display: block; margin: 1em auto; width: 0; padding: 5em; background: url("empty.gif") center no-repeat; background-size: contain;}

@font-face{font-family:'FontAwesome';src:url('webfont.eot') format('embedded-opentype'),
    url('webfont.woff') format('woff'),url('webfont.ttf') format('truetype');font-weight:normal;font-style:normal}
.sorter:before{}
.sorter.cur:before{content: "\f0de"; color: #39c;}
.sorter.desc:before{content: "\f0dd"; color: #c30;}

.homebar{position: relative;}
.homebar a{display: block; padding: 25%; background: center no-repeat; background-size: cover;}
.homebar .hd{position: absolute; left: 0; right: 0; bottom: 1em; z-index: 1; text-align: center;}
.homebar .hd li{display: inline-block; font-size: 0; background-color: #0009; padding:4px; border-radius: 50%; margin: 0 4px;}
.homebar .hd li.on{background-color: red;}

.links{columns: 3;}
.links a{display: block; padding: 0 5%;}

#footbar {display: flex; bottom: 0;text-align: center; border-top: 1px solid var(--maincolor); line-height: 1;}
#footbar a{flex:1; color: var(--maincolor); background-color: #fff; cursor: pointer; padding: 6px 0;}
#footbar a.main{flex: 3; background-color: var(--maincolor); color: #fff;}
#footbar a:before{ font-family:"FontAwesome"; display: block; font-size: 20px;}
#footbar a#home:before{	content: "\f015";}
#footbar a#footfav:before{	content: "\f006";}
#footbar a#copy:before{	content: "\f045";}
#footbar a#tel:before{	content: "\f095";}
#footbar a#footfav.cur:before{	content: "\f005"; color: #c30;}

#menu {display: table;display: flex;}
#menu a{display: table-cell; text-align: center; line-height: 2; background-color: var(--menucolor, #6cf); color: #fff; flex:1}
#menu a:hover,#menu a.cur{ background-color: var(--actcolor, #6cf);}
.btn{border: 0; background-color: var(--menucolor, #f36); color: #fff; padding: 3px 1em; border-radius: 5px;}

.content h2{text-align: center; font-size: 18px; margin: 1em;}
.content h6{text-align: center; font-weight: normal; color: #777; margin-bottom: 1em; border-bottom: 1px solid ;}
.content > div{line-height: 1.8; padding: 0.5em; text-align: justify; word-break: break-all;}
.content #cover{width: 100%;}
#attr a{display: block; width: 50%;margin: 1em auto; line-height: 2.2; background-color: var(--maincolor, #6cf); color: #fff;text-indent: 0;text-align: center;border-radius: .5em;}

#attr{padding:3em 1em 2em;background-color: #ffa3; margin:.5em; box-shadow: 0 0 1em var(--maincolor); border-radius: .5em;}
#attr #captcha{width: 36%; padding: 5px; outline: none; border: 1px solid #ddd; border-radius: 5px;}
#attr b{background-color: var(--menucolor, #f36); display: inline-block; color: #fff; vertical-align: middle; padding: 0 0.5em; margin: 0 8px 8px 0;}
#attr i{display: inline-block; text-align: center; min-width: 4em; background-color: #fff; border: 1px solid #eee; cursor: pointer; margin: 0 8px 8px 0; white-space: nowrap; vertical-align: middle;}
#attr i.cur{background-color:var(--maincolor, #f36); border-color:var(--maincolor, #f36); color:#fff}
#attr #colors i{font-size: 0; padding: 24px; background-size: cover; background-position: center;}
#attr #colors i.noimg{padding: 0 3px;}
#attr i.btnmini{border: none; background-color: #39c; color: #fff; float: right; margin: 0 5px; border-radius: 3px;}
#colors i.noimg:before{content: attr(title); font-size: 14px; }
#price em, .price em{font-size:20px; color:#f30; font-weight: bold; margin: 3px;}
#price span{margin-top: .5em; float: right}
.price a{float: right; padding: 0 1em; margin-top: .5em; border-radius: 1em; color: #fff; background-image: linear-gradient(90deg, #f30, #fa0);}

#attr textarea{width: 100%; display: block; border: 1px solid #ddd; padding: .5em; height: 6em; margin: .5em auto; resize: vertical; font-size: 1em; border-radius: .5em;}

.box {padding: 0 .5em; line-height: 1.67;}
.box dt {border-bottom: 1px solid #ddd;}
.box dt b {display: inline-block; border-left: 5px solid;padding-left: 1em;margin: .5em 0;color: var(--maincolor);}
.box dt a{float: right; line-height: 2.5; margin-left: 1em;}
.box .key{float: right; margin-top: .5em; width: 40%; font-size: 1em; border: 1px solid #ddd; outline: none; border-radius: 1em; padding: 3px 1em; color:#777; transition: width 0.3s;}
.box .key:focus{box-shadow: 0 0 0.5em #39c; width: 48%;}
.box nav {background-color: var(--menucolor); margin-bottom: .5em; line-height: 2; border-radius: 1em;}
.box nav a{display: inline-block; padding: 0 0.5em; white-space: nowrap; color: #fff}
.box nav a.cur{background-color: var(--actcolor); font-weight: bold; opacity: 0.85;}

.attr b{display: inline-block; width: 4em; line-height: 2; text-align: justify; text-align-last: justify;}
.attr .aimg{display: block; width: 49%; margin: 0.5%; float: left; border-radius: .5em;}

.contact i{float: left; clear: left; width: 5em; text-align: right; font-weight: bold;}
.contact:after, .pimg:after{clear:both;content: "";display: block;}
.contact p{overflow: hidden;}

.offer p{color: #999; border-bottom: 1px solid #eee; padding: .5em 0;}
.offer em{float: right; font-weight: bold; color: #f36;}


.pimg li {float: left; width: 48%; margin: 1%;  border-radius: 8px;  border: 1px solid #f3f3f3;  overflow: hidden;}
.pimg li:hover{background-color: #f7f7f7;}

.news em {display: block;padding-right: 1em;}
.news .time{float: right; color:#777}

.footer{margin-top: 5em; border-top: 1px solid #ddd; padding-top: 1em; text-align: center; line-height: 1.8; font-size: 14px; color: #777;}
.footer a{color:var(--menucolor); font-weight: bold;}
.footer em{color:red}