html							    { width:100%; height:100%; }
body 							    { width:100%; height:100%; color:#555; background: #F5F5F8; padding:0px; margin:0px; font-size:1rem; line-height:1.75rem; font-family:微软雅黑,arial,verdana; }
body.home                           { background:#fff url(/images/bg.jpg) center 5rem no-repeat; background-size:auto 32rem; }

.header                             { border-bottom: solid 1px #e4e4e4; box-shadow: 0 0 0.35rem #DDD; background: #fff;
                                      position: fixed; left: 0; top: 0; right: 0; z-index: 999; }
.frame 							    { width:75rem; margin:0px auto; }
.header ~ .frame                    { padding-top: 7.5rem; }

.nav-bar  						    { height:5rem; display:flex; flex-direction:row; flex-flow:row nowrap; }
.nav-bar .home					    { display:flex; align-items:center; justify-items:center; padding-right:1rem; }
.nav-bar .home a  				    { display:flex; align-items:center; justify-items:center; }
.nav-bar .home a img 			    { height:2.8rem; width:auto; }

.nav-bar .flex-large 			    { display:flex; align-items:center; flex: 1; color:#05a6da; font-size:1.35rem; padding-top:0.5rem; }

.nav-bar .button 				    { display:flex; align-items:center; justify-items:center; padding-left:1rem; padding-right:1rem; font-size:1.00rem; }

.nav-bar .uitem 				    { height:5rem; line-height:5rem; padding-left:1rem; padding-right:1rem; border-left:solid 1px #CCC; font-size:1rem; }
.nav-bar .uitem:hover 			    { background:#fff; cursor:pointer; color:#f60; }

.login 							    { position:relative; height:32rem; }

.lft 							    { position:absolute; top:5rem; left:0px; color:#fff; text-shadow: #555 1px 0 0, #555 0 1px 0, #555 -1px 0 0, #555 0 -1px 0; }
.lft .ft-title					    { padding-left:0.5rem; font-size:2rem; font-weight:bold; line-height:3rem; height:3rem; }
.lft .ft-second 				    { padding-left:0.5rem; font-size:1.5rem; color:rgba(255,255,255,0.95); line-height:2.5rem; margin-top:1rem; }

.rgt 							    { position:absolute; bottom:6rem; right:0px; width: 16rem; height: 20.2rem; border-radius:0.5rem;
                                      background: rgba(255,255,255,0.75); box-shadow: 0 0 1rem #888; }
.rgt .title                         { font-size: 1.5rem; text-align: center; height: 3.5rem; line-height: 3.5rem; }
.rgt .img                           { padding:0 1rem; }
.rgt .img img 						{ width:100%; }
.rgt .more                          { text-align: center; line-height: 1.5rem; }

.list2 							    { display:flex; flex-direction:row; justify-content:space-between; padding:0; margin:1.5rem 0; }
.list2 li 						    { display:flex; flex-direction:column; justify-content:center; align-items:center;
                                      list-style:none; width:31.5%; margin:1.25rem 0px; border:solid 1px #dcdcdc; height:13.5rem; padding:1.5rem; box-sizing: border-box; border-radius:3px;  }
.list2 li .first				    { display:flex; justify-content:center; align-items:center; flex-direction:column; }
.list2 li .first .eIcon			    { display:flex; height:5.5rem; width:5.5rem; background:#0cb5ec; border-radius:5rem; justify-content:center; align-items:center; }
.list2 li .first .eIcon img 	    { width:4rem; height:4rem; }
.list2 li .first .eText			    { text-align:center; padding:0.5rem 0; font-size:1.1rem; }
.list2 li .first .eMore			    { text-align:center; color:#666; }
.list2 li .second 				    { display:none; justify-content:center; align-items:center; flex-direction:column; }
.list2 li .second .eButton		    { width:8rem; height:2.5rem; background:#00cc00; color:#fff; border-radius:3px; display:flex; justify-content:center; align-items:center; }
.list2 li .second .eLinks 		    { text-align:center; padding-top:1rem; }
.list2 li:hover .first			    { display:none; }
.list2 li:hover .second			    { display:flex; }

.footer 						    { font-size:0.85rem; line-height:1.75rem; padding-top:0.75rem; margin-bottom: 0.5rem; border-top: solid 1px #DCDCDC; }
.footer .foot                       { display: flex; flex-direction: row; }
.footer .foot-content 			    { flex:1; }
.footer .foot-logo 				    { display:flex; justify-content:center; align-items:center; }
.footer .foot-logo img 			    { width:auto; height: 2.35rem; }

.container                          { display: flex; flex-direction: row; margin-bottom: 1.5rem; border: solid 1px #E4E4E4; background: #fff; }

.header1                            { display: flex; flex-direction: column; width: 19rem; background: #FAFAFA; }
.header1 .prod                      { display: flex; flex-direction: row; border-bottom: solid 1px #EDEDED; padding: 0.35rem 0.5rem; border-right: solid 1px #e4e4e4; }
.header1 .prod.select               { border-right-width: 0; background: #fff; }
.header1 .prod .logo                { width: 3rem; height: 3rem; margin-right: 0.5rem; }
.header1 .prod .name                { display: flex; flex-direction: column; flex:1; line-height: 1.6rem; }
.header1 .prod .name .version       { font-size: 0.9rem; line-height: 1.35rem; color: #777; }
.header1 .prod:hover                { cursor: pointer; color: #333; }
.header1 .more                      { display: flex; flex: 1; border-right: solid 1px #e4e4e4; }

.list1                              { padding: 1rem; margin: 0; display: flex; flex-direction: row; flex: 1; flex-wrap: wrap; }
.list1 li                           { display: flex; width: 33.33%; padding: 1rem; list-style: none; box-sizing: border-box; }

.product                            { background: #fff; border:solid 1px transparent; }
.product img                        { width: 100%; line-height: 0; }
.product .price                     { color: #f50; font-size:1.25rem; }
.product .price .unit               { font-size:0.85rem; color: #555; font-weight: normal; margin-left: 0.25rem; }
.product .price .sale               { float: right; font-size: 0.85rem; color: #555; font-weight: normal; margin-top: 0.15rem; }
.product:hover                      { border-color: #D8D8D8; box-shadow: 0 0 0.35rem #CCC; }
.product:hover img                  { transform:scale(0.95); }
.product:hover div                  { transform:scale(0.95) translateY(-0.5rem); }

.goods                              { display: flex; flex-direction: row; background: #fff; border: solid 1px #e4e4e4; }
.goods .picture                     { width: 28rem; height: 28rem; padding:0.75rem; display:flex; justify-content: center; align-items: center; }
.goods .catalog                     { display:flex; flex:1; flex-direction:column; border-left: solid 1px #e4e4e4; padding-left: 2rem; padding-right: 2rem; }
.goods .catalog .cat-name           { padding-top:1.5rem; font-size:1.5rem; }
.goods .catalog .cat-detail         { display: flex; flex:1; align-items: flex-start; }

.catalog-table                      { margin-top:1rem; border-top: dotted 1px #D4D4D4; }
.catalog-table tr td:first-child    { font-size: 0.85rem; padding-left: 0.75rem; width: 3rem; }
.catalog-table tr.price             { background: #fff2e8; }
.catalog-table tr.price td.money    { color: #ff4000; font-size:1.5rem; height: 2.5rem; font-weight: bold; }
.catalog-table tr.price .unit       { font-size:0.85rem; color: #777; font-weight: normal; margin-left: 0.25rem; }
.catalog-table tr td                { border-bottom:dotted 1px #D4D4D4; }
.catalog-table tr td .iconfont      { font-size:1rem !important; color: #2cb228; margin-right: 0.25rem; }

.goods .buyCount                    { width: 8rem; height: 1.8rem; display: flex; flex-direction: row; border: solid 1px #CCC; border-radius: 0.15rem; overflow: hidden; float: left; }
.goods .buyCount .cnt               { display: flex; flex:5; border-left: solid 1px #CCC; border-right: solid 1px #CCC; }
.goods .buyCount .cnt input         { border: none; padding: 0; margin: 0; width: 100%; text-align: center; outline: none; color: #484848; }
.goods .buyCount .btn               { display: flex; flex:2.5; justify-content: center; align-items: center; margin: 0; padding: 0; color: #555; }
.goods .buyCount .btn:hover         { cursor: pointer; color: #f40; }
.goods .buyCount .disabled          { background: #f5f5f5; color: #A8A8A8 !important; }

.goods .buyIntro                    { font-size: 0.85rem; color:#707070; margin-left: 8.5rem; padding-top: 0.20rem; }

.goods .buyWrapper                  { padding-bottom: 1.5rem; }
.goods .buyButton                   { padding: 0.45rem 1.5rem; background: #0cb5ec; border: none; color: #fff; font-size: 1.05rem; }
.goods .buyButton:hover             { cursor: pointer; background: #0893c1; }

.detail                             { display: flex; flex-direction: row; margin-top:1rem; border:solid 1px #e4e4e4; margin-bottom: 1.5rem; background: #fff; }
.detail .header2                    { border-bottom: solid 1px #e4e4e4; }
.detail .header2 .head-item         { display: inline-block; line-height: 3rem; height: 3rem; padding:0 2rem; border-right: solid 1px #e4e4e4; color: #f40; font-weight: bold; font-size:1.15rem; }

.detail .com                        { width: 16rem; border-right: solid 1px #E4E4E4; }
.detail .com ul                     { padding: 1rem; margin: 0; display: flex; flex-direction: column; }
.detail .com ul li                  { padding-bottom: 1rem; }

.detail .tro                        { display: flex; flex-direction: column; flex:1; }
.detail .tro .content               { text-indent: 2rem; padding:1rem; }
.detail .tro .images                { padding:0.75rem; }
.detail .tro .images img            { width: 100%; line-height: 0; display: block; }

.frame .intro 					    { line-height:2rem; padding:0.75rem 1.5rem; text-indent:2em; }
.frame .block 					    { font-size:1.6rem; border-bottom:solid 1px #E4E4E4; line-height:3.25rem; padding-top:3.25rem; margin-bottom:0.75rem; }

.frame.fixed 					    { height:73%; display:flex; align-items:center; justify-content:center; }
.frame.fixed .pnd 				    { width:20rem; border-radius:0.75rem; box-shadow:0px 0px 0.75rem #ccc; padding:1rem 1.5rem; }
.frame.fixed .pnd .head			    { font-size:1.6rem; font-weight:bold; text-align:center; height:3.5rem; line-height:3.5rem; }





.frame .text 					{ padding:0.75rem 1rem; line-height:2rem; text-indent:2em; }
.frame .point 					{ display:inline-block; border:solid 1px #E4E4E4; padding:0px 5px; border-radius:3px; margin:0px 3px; text-indent:0rem; }






.center 						{ text-align:center; }

a 								{ color:#555; text-decoration:none; }
a:hover 						{ color:#0cb5ec; text-decoration:none; }

input, select 					{ font-size:0.9rem; }




.ft-button 						{ display:inline-block; border:solid 1px rgba(255,255,255,0.65); color:#fff; height:3.25rem; line-height:3rem; padding:0px 2.5rem; border-radius:0.5rem; font-size:1.5rem; }
.ft-button:hover 				{ background:rgba(255,255,255,0.35); cursor:pointer; }
.ft-button.ft-go 				{ border-color:#0cb5ec; color:#0cb5ec; margin-top:1rem; }
.ft-button.ft-go:hover 			{ background:#0cb5ec; color:#fff; }




.list3  						{ display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; padding:0px; margin:10px auto; }
.list3 li 						{ list-style:none; padding:10px; border:solid 1px #E4E4E4; border-radius:3px; width:30%; margin:12px 0px; }