html {
font-size: 20px;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
font-family: sans-serif;
}
.text-yellow {
color: #feb312;
}
.text-orange {
color: #ff741d;
}
.text-blue {
color: #50b6fe;
}
.text-red {
color: #fd5454;
}
.diy-richtext {
min-height: 20px;
display: block;
margin: 0;
padding: 0;
height: auto;
overflow: hidden;
}
.diy-banner {
display: block;
margin: 0;
padding: 0;
height: auto;
overflow: hidden;
position: relative;
}
.diy-banner img {
display: none;
width: 100%;
}
.diy-banner img:first-child {
display: block;
}
.diy-banner .dots {
height: 14px;
padding: 0 10px;
position: absolute;
left: 0;
right: 0;
bottom: 10px;
opacity: 0.5;
}
.diy-banner .dots.left {
text-align: left;
}
.diy-banner .dots.center {
text-align: center;
}
.diy-banner .dots.right {
text-align: right;
}
.diy-banner .dots.rectangle span {
height: 12px;
width: 20px;
}
.diy-banner .dots.square span {
height: 12px;
width: 12px;
}
.diy-banner .dots.round span {
height: 12px;
width: 12px;
border-radius: 12px;
}
.diy-banner .dots span {
display: inline-block;
}
.fui-icon-group {
position: relative;
overflow: hidden;
border-top: 1px solid #ebebeb;
background: #fff;
}
.fui-icon-group .fui-icon-col {
width: 25%;
height: auto;
position: relative;
padding: 0;
margin: 10px 0;
text-align: center;
transition: background-color 300ms;
-webkit-transition: background-color 300ms;
float: left;
}
.fui-icon-group .fui-icon-col:active {
background: #ececec;
}
.fui-icon-group .fui-icon-col .icon {
height: 44px;
margin: auto;
text-align: center;
line-height: 44px;
}
.fui-icon-group.col-3 .fui-icon-col {
width: 33.3%;
}
.fui-icon-group.col-5 .fui-icon-col {
width: 20%;
}
.fui-icon-group .fui-icon-col .icon img {
height: 44px;
width: 44px;
}
.fui-icon-group.radius .fui-icon-col img {
border-radius: 10px;
}
.fui-icon-group.circle .fui-icon-col img {
border-radius: 44px;
}
.fui-icon-group.col-3 .fui-icon-col.radius img {
border-radius: 33.3%;
}
.fui-icon-group.col-5 .fui-icon-col.radius img {
border-radius: 20%;
}
.fui-icon-group .fui-icon-col .text {
font-size: 12px;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 4px;
color: #7a7a7a;
}
.fui-icon-group.noborder {
border-top: 0;
}
.fui-icon-group.noborder .fui-icon-col:before {
border: 0;
}
.fui-icon-group .fui-icon-col .icon i {
color: #aaa;
font-size: 32px;
margin-top: 7px;
}
.fui-icon-group .fui-icon-col .badge {
background: red none repeat scroll 0 0;
border-radius: 10px;
color: white;
font-size: 12px;
height: 16px;
left: 50%;
line-height: 16px;
margin-left: 7px;
min-width: 16px;
padding: 0 4px;
position: absolute;
top: 10px;
vertical-align: top;
text-align: center;
z-index: 100;
}
.fui-icon-group.pb10 {
padding-bottom: 10px;
}
.fui-icon-group .fui-icon-group-pagination {
height: 10px;
position: absolute;
left: 0;
right: 0;
bottom: 8px;
text-align: center;
padding: 0;
margin: 0;
line-height: 10px;
}
.fui-icon-group .fui-icon-group-pagination a {
height: 8px;
width: 8px;
background: #000;
border-radius: 8px;
display: inline-block;
opacity: 0.3;
}
.fui-icon-group .fui-icon-group-pagination a.active {
opacity: 0.5;
}
.diy-search {
background: #f1f1f2;
padding: 10px 10px;
}
.diy-search .inner {
height: 30px;
background: #fff;
overflow: hidden;
}
.diy-search.radius .inner {
border-radius: 5px;
}
.diy-search.round .inner {
border-radius: 30px;
}
.diy-search .inner .search-icon {
height: 30px;
width: 30px;
text-align: center;
line-height: 30px;
font-size: 18px;
color: #b4b4b4;
}
.diy-search .inner .search-input {
height: 30px;
width: 100%;
line-height: 30px;
font: 12px;
color: #999999;
}
.diy-search .inner .search-input span {
padding: 0 10px 0;
}
.diy-search .inner.left .search-icon {
float: left;
}
.diy-search .inner.right .search-icon {
float: right;
}
/* notice æ ·å¼ */
.fui-notice {
height: auto;
font-size: 16px;
background: #fff;
padding: 6px;
overflow: hidden;
position: relative;
border-top: 1px solid #e2e2e2;
border-bottom: 1px solid #e2e2e2;
}
.fui-notice .image {
height: 20px;
width: auto;
position: relative;
float: left;
padding-right: 4px;
}
.fui-notice .image img {
height: 100%;
max-width: 100px;
display: block;
}
.fui-notice .image:before {
content: " ";
position: absolute;
width: 0;
top: 2px;
right: 0;
bottom: 2px;
border-right: 1px solid #e2e2e2;
}
.fui-notice .icon {
height: 20px;
padding-left: 4px;
float: left;
color: #fd5454;
line-height: 22px;
}
.fui-notice .text {
height: 20px;
padding-left: 4px;
font-size: 12px;
color: #333;
line-height: 20px;
overflow: hidden;
}
.fui-notice .text ul li {
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.fui-notice a {
color: #333;
}
/**/
.fui-goods-group {
height: auto;
overflow: hidden;
background: #f9f9f9;
}
.fui-goods-item {
position: relative;
height: auto;
padding: 10px;
border-bottom: 1px solid #e7e7e7;
background: #fff;
overflow: hidden;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.fui-goods-item .image img {
height: 100%;
width: 100%;
display: block;
}
.fui-goods-item .detail {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
background: #fff;
padding-left: 10px;
}
.fui-goods-item .detail .name {
height: 60px;
font-size: 14px;
color: #262626;
}
.fui-goods-item .detail .price {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
font-size: 14px;
margin-top: 6px;
}
.fui-goods-item .detail .price .text {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
color: #ed2822;
}
.fui-goods-item .detail .price .minprice {
font-size: 15px;
}
.fui-goods-item .detail .price .productprice {
color: #777;
font-size: 11px;
}
.color {
color: #fd5454;
}
.bgcolor {
background: #fd5454
}
.fui-goods-group.block .fui-goods-item {
width: 50%;
float: left;
border-bottom: 0;
background: none;
padding: 5px;
display: block;
}
.fui-goods-group.block .fui-goods-item .image {
width: 100%;
height: 0;
overflow: hidden;
margin: 0;
padding-bottom: 100%; /* 关键就在这里 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.fui-goods-group.block {
padding: 4px;
}
.fui-goods-group.block .fui-goods-item .image {
float: none;
}
.fui-goods-group.block .fui-goods-item .detail {
padding: 4px;
overflow: hidden;
}
.fui-goods-group.block .fui-goods-item .detail .name {
height: 40px;
overflow: hidden;
}
.fui-goods-group.block .fui-goods-item .center-image {
max-width: 100%;
height: 0;
padding-bottom: 100%;
background-size: contain;
}
.fui-goods-group.block .fui-goods-item .detail .name {
height: 40px;
overflow: hidden;
}
.fui-goods-group.block.one .fui-goods-item {
width: 100%;
float: none;
}
.fui-goods-group.block.three .fui-goods-item {
width: 33.33%;
}
/**/
.fui-cube {
height: 0;
width: 100%;
margin: 0;
padding-bottom: 50%;
position: relative;
}
.fui-cube .fui-cube-left {
width: 50%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.fui-cube .fui-cube-right {
width: 50%;
height: 100%;
position: absolute;
top: 0;
left: 50%;
}
.fui-cube .fui-cube-right1 {
width: 100%;
height: 50%;
position: absolute;
top: 0;
left: 0;
}
.fui-cube .fui-cube-right2 {
width: 100%;
height: 50%;
position: absolute;
top: 50%;
left: 0;
}
.fui-cube .fui-cube-right2 .left {
width: 50%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.fui-cube .fui-cube-right2 .right {
width: 50%;
height: 100%;
position: absolute;
top: 0;
left: 50%;
}
.fui-cube img {
width: 100%;
height: 100%;
}
.diy-followbar {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 50px;
background: #444444;
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 6px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
overflow: hidden;
z-index: 887;
}
.diy-followbar .logo {
width: 38px;
height: 38px;
background: #f4f4f4;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-box-lines: single;
-moz-box-lines: single;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
box-sizing: border-box;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
margin-right: 8px;
position: relative;
overflow: hidden;
}
.diy-followbar .logo img {
height: inherit;
width: inherit;
display: block;
}
.diy-followbar .logo.radius {
border-radius: 5px;
}
.diy-followbar .logo.circle {
border-radius: 40px;
}
.diy-followbar .text {
height: 38px;
position: relative;
width: 100%;
overflow: hidden;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
color: #fff;
}
.diy-followbar .text .inner {
height: auto;
max-height: 38px;
overflow: hidden;
}
.diy-followbar .btn {
background: #04be02;
height: 10px;
margin-left: 4px;
height: 24px;
padding: 0 6px;
line-height: 22px;
font-size: 12px;
color: #fff;
}
.fui-cell-group {
margin-top: 10px;
background-color: #fff;
line-height: 1.4;
font-size: 16px;
overflow: hidden;
position: relative;
}
.fui-cell-group.sm * {
font-size: 14px;
}
.fui-cell-group.fui-cell-group-o {
margin: 0 10px;
margin-top: 10px;
border-radius: 10px;
}
.fui-cell-group.fui-cell-group-o:active a:last-child {
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}
.fui-cell-group.fui-cell-group-o:active a:first-child {
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}
.fui-cell-group:not(.fui-cell-group-o):before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-cell-group:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
border-bottom: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-cell-group .fui-cell {
position: relative;
padding: 8px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-moz-transition-duration: 300ms;
-webkit-transition-duration: 300ms;
transition-duration: 300ms;
-webkit-transition-property: background-color;
transition-property: background-color;
}
.fui-cell-group .fui-cell:before {
content: " ";
position: absolute;
left: 10px;
right: 10px;
top: 0;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-cell-group .fui-cell.must .fui-cell-label:after {
content: "*";
position: absolute;
right: 4px;
top: 4px;
color: #f30;
font-size: 16px
}
.fui-cell-group-o:after,
.fui-cell-group .fui-cell:first-child:before {
display: none;
}
.fui-cell-group.fui-cell-click .fui-cell:active,
.fui-cell-group .fui-cell.fui-cell-click:active {
background: #ececec;
}
.fui-cell-title {
color: #333;
font-size: 15px;
padding: 10px 14px;
}
.fui-cell-tip {
color: #999;
font-size: 12px;
padding: 6px 14px;
}
.fui-cell-group .fui-cell .fui-cell-info {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
font-size: 15px;
color: #666;
}
.fui-cell-group .fui-cell .fui-cell-info.overflow {
word-break: break-all;
overflow: auto;
white-space: normal;
height: auto;
}
.fui-cell-group .fui-cell .fui-cell-info .checkbox-inline,
.fui-cell-group .fui-cell .fui-cell-info .radio-inline {
float: left;
margin-bottom: 4px;
}
.fui-cell-group .fui-cell .fui-cell-label {
position: relative;
display: block;
width: 80px;
padding: 0 4px;
font-size: 15px;
}
.fui-cell-group .fui-cell .fui-cell-label.big {
display: block;
width: 90px;
padding: 0 4px;
font-size: 16px;
}
.fui-cell-group .fui-cell .fui-cell-info select {
-webkit-appearance: none;
border: 0;
outline: 0;
background-color: transparent;
width: 100%;
font-size: inherit;
height: 24px;
position: relative;
z-index: 1;
padding-left: 15px;
}
.fui-cell-group .fui-cell .fui-cell-info select {
padding: 0;
}
.fui-cell-group .fui-cell .fui-cell-icon {
color: #333;
margin-right: 6px;
width: 16px;
color: #999;
text-align: center;
}
.fui-cell-group .fui-cell .fui-cell-icon.pull-left {
font-size: 17px;
}
.fui-cell-group .fui-cell .fui-cell-text {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
color: #333;
font-size: 14px;
}
.fui-cell-group .fui-cell .fui-cell-remark {
color: #888;
text-align: right;
font-size: 13px;
margin-right: 4px;
}
.fui-cell-group .fui-cell .fui-cell-remark:after {
content: " ";
display: inline-block;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
height: 6px;
width: 6px;
border-width: 2px 2px 0 0;
border-color: #C8C8CD;
border-style: solid;
position: relative;
top: -1px;
margin-left: 6px;
}
.fui-cell-group .fui-cell .fui-cell-remark.noremark:after {
display: none;
margin-left: 0;
}
.fui-cell-group .fui-cell.fui-cell-textarea .fui-cell-label {
margin-top: -30px;
}
.headinfo {
position: relative;
height: auto;
background: #fe5455;
padding-top: 20px;
border-top: 1px #b2423f solid;
border-bottom: 1px #fa9d9d solid;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
}
.headinfo .setbtn {
height: 24px;
width: 24px;
position: absolute;
top: 4px;
right: 10px;
font-size: 24px;
color: #fff;
line-height: 24px;
text-align: center;
}
.headinfo .child {
width: 30%;
height: auto;
padding-bottom: 24px;
text-align: center;
}
.headinfo .child.userinfo {
width: 40%;
color: #fff;
}
.headinfo .child.userinfo .face {
height: 56px;
width: 56px;
background: #fff;
margin: auto;
border-radius: 56px;
border: 2px solid #fff;
}
.headinfo .child.userinfo .face img {
height: 52px;
width: 52px;
border-radius: 52px;
display: block;
}
.headinfo .child.userinfo .face.radius {
border-radius: 10px;
}
.headinfo .child.userinfo .face.radius img {
border-radius: 10px;
}
.headinfo .child.userinfo .name {
height: 20px;
padding-top: 4px;
font-size: 12px;
color: inherit;
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.headinfo .child.userinfo .level {
font-size: 12px;
color: inherit;
text-align: center;
}
.headinfo .child .title {
padding-top: 24px;
font-size: 14px;
color: #fff;
text-align: center;
}
.headinfo .child .num {
font-size: 14px;
color: #fef31f;
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.headinfo .child .btn {
width: 52px;
height: 20px;
padding: 0;
margin: 4px auto 0;
color: #fff;
font-size: 12px;
line-height: 18px;
text-align: center;
border-radius: 20px;
border: 1px solid #fff;
}
.headinfo.style-2 {
padding: 15px 15px;
}
.headinfo.style-2 .face {
height: 60px;
width: 60px;
border-radius: 60px;
float: left;
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-box-lines: single;
-moz-box-lines: single;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
box-sizing: border-box;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
}
.headinfo.style-2 .face img {
height: 60px;
width: 60px;
border-radius: 60px;
display: block;
}
.headinfo.style-2 .face.radius {
border-radius: 10px;
}
.headinfo.style-2 .face.radius img {
border-radius: 10px;
}
.headinfo.style-2 .inner {
height: auto;
position: relative;
width: 100%;
overflow: hidden;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
display: block;
padding-left: 10px;
color: #fff;
}
.headinfo.style-2 .inner .name {
font-size: 16px;
}
.headinfo.style-2 .inner .level,
.headinfo.style-2 .inner .credit {
font-size: 14px;
}
.headinfo.style-2 .inner span {
color: #fef31f;
}
.headinfo.commission {
height: auto;
background: #FE5455;
border-top: 1px #b94749 solid;
border-bottom: 1px #fa9d9d solid;
display: block;
padding-top: 0;
}
.headinfo.commission .userinfo {
height: 4rem;
padding: 0.3rem 0.6rem;
border-bottom: 1px solid #fe9292;
position: relative
}
.headinfo.commission .userinfo .fui-list {
padding: 0rem;
padding-top: .2rem;
}
.headinfo.commission .userinfo .fui-list:active {
background: transparent
}
.headinfo.commission .userinfo .fui-list-media img {
height: 2.5rem;
width: 2.5rem;
border-radius: 2.5rem;
border: 2px solid #fff;
}
.headinfo.commission .userinfo .fui-list .fui-list-info .title {
color: #fff;
font-size: 0.7rem;
line-height: 1rem;
}
.headinfo.commission .userinfo .fui-list .fui-list-info .subtitle {
color: #fef31f;
font-size: 0.65rem;
}
.headinfo.commission .userinfo .fui-list .fui-list-info .text {
color: #fff;
font-size: 0.6rem;
}
.headinfo.commission .userinfo .setbtn {
position: absolute;
height: 1.4rem;
width: 1.2rem;
font-size: 1.2rem;
color: #fff;
line-height: 1.4rem;
text-align: center;
right: .5rem;
top: .5rem;
}
.headinfo.commission .userblock {
height: auto;
padding: 0 0.6rem;
}
.headinfo.commission .userblock .line {
height: auto;
padding: 0.9rem 0 0;
color: #fff;
overflow: hidden;
}
.headinfo.commission .userblock .line.total {
height: auto;
}
.headinfo.commission .userblock .line.total .title {
font-size: 0.7rem;
}
.headinfo.commission .userblock .line.total .num {
font-size: 1.4rem;
line-height: 1.7rem;
font-weight: 100;
}
.headinfo.commission .userblock .line.usable {
height: auto;
padding-bottom: 0.9rem;
padding-top: 1.1rem;
}
.headinfo.commission .userblock .line.usable .btn {
height: 1.2rem;
width: auto;
padding: 0 0.4rem;
border: 1px solid #fff;
line-height: 1.2rem;
border-radius: 0.6rem;
font-size: 0.7rem;
float: right;
color: inherit;
}
.headinfo.commission .userblock .line.usable .btn.disabled {
height: 1.2rem;
width: auto;
padding: 0 0.4rem;
border: 1px solid #ccc;
line-height: 1.2rem;
border-radius: 0.6rem;
font-size: 0.7rem;
float: right;
color: #ccc;
}
.headinfo.commission .userblock .line.usable .text {
padding-right: 4rem;
}
.headinfo.commission .userblock .line.usable .text .title {
font-size: 0.6rem;
line-height: 0.6rem;
}
.headinfo.commission .userblock .line.usable .text .num {
font-size: 1rem;
font-weight: 100;
line-height: 1.4rem;
}
/* tab */
.fui-tab {
-webkit-align-self: center;
align-self: center;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-lines: single;
-moz-box-lines: single;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
margin-bottom: 2px;
background: white;
position: relative;
}
.fui-tab:after {
content: '';
position: absolute;
left: 0;
bottom: 0;
right: auto;
top: auto;
height: 1px;
width: 100%;
background-color: #d0d0d0;
display: block;
z-index: 0;
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
.fui-tab nav {
text-align: center;
cursor: default;
color: #666;
font-size: 0.8rem;
width: 100%;
height: 2rem;
line-height: 2rem;
-webkit-box-flex: 1;
-ms-flex: 1;
border: 0;
border-bottom: 2px solid transparent;
border-radius: 0;
}
.fui-tab.fui-tab-danger nav.active {
color: #ef4f4f;
border-color: #ef4f4f;
z-index: 100;
}
.diy-swipe {
height: auto;
overflow: hidden;
}
.diy-swipe img {
height: auto;
width: 100%;
display: block;
}
.diy-swipe .dots {
height: 14px;
padding: 0 10px;
position: absolute;
left: 0;
right: 0;
bottom: 10px;
opacity: 0.5;
}
.diy-swipe .dots.left {
text-align: left;
}
.diy-swipe .dots.center {
text-align: center;
}
.diy-swipe .dots.right {
text-align: right;
}
.diy-swipe .dots.rectangle span {
height: 12px;
width: 20px;
}
.diy-swipe .dots.square span {
height: 12px;
width: 12px;
}
.diy-swipe .dots.round span {
height: 12px;
width: 12px;
border-radius: 12px;
}
.diy-swipe .dots span {
display: inline-block;
}
.fui-navbar,.fui-footer {
width: 100%;
bottom: 0;
height: 2.5rem;
background: #fff;
box-shadow:0 0 4px rgba(0,0,0,0.1);
-webkit-box-shadow:0 0 4px rgba(0,0,0,0.1);
-moz-box-shadow:0 0 4px rgba(0,0,0,0.1);
}
.fui-navbar .nav-item.btn {
color:#fff; border-radius: 0;
}
.fui-navbar .nav-item {
position: relative;
display: table-cell;
height: 2.5rem;
text-align: center;
vertical-align: middle;
width: 1%;
color:#999;
}
.fui-navbar .nav-item.active,
.fui-navbar .nav-item:active {
color: red
}
.fui-navbar .nav-item .label {
display: block;
font-size: 0.55rem;
position: relative;
top: -0.1rem;
background: none;
color: #999;
}
.fui-navbar .nav-item .icon {
font-size: 1rem;
padding: 0;
}
.fui-navbar .nav-item .badge {
background: red none repeat scroll 0 0;
border-radius: 0.5rem;
color: white;
font-size: 0.6rem;
height: 0.8rem;
left: 50%;
line-height: 0.8rem;
margin-left: 0.1rem;
min-width: 0.8rem;
padding: 0 0.2rem;
position: absolute;
top: 0.1rem;
vertical-align: top;
z-index: 100;
}
.fui-navbar .cartbtn {
background: #fe9402;
}
.fui-navbar .buybtn {
background: #fd5555;
}
.fui-detail-group {
margin-top: 0
}
.fui-detail-group .fui-cell {
padding: 0 0.5rem;
}
.fui-detail-group .fui-cell:before {
border: 0;
}
.fui-detail-group .fui-cell .price {
font-size: 1rem;
color: #fd5454;
line-height: 1.4rem;
font-weight: 100;
font-weight: bold;
}
.fui-detail-group .fui-cell .price .original {
font-size: 0.6rem;
color: #C0C0C0;
text-decoration: line-through;
padding-left: 0.2rem;
font-weight: normal
}
.fui-detail-group .fui-cell .name {
padding: 0.4rem 0 0;
font-size: 0.75rem;
}
.fui-detail-group .fui-cell .share {
padding-left: 0.8rem;
margin-top: 0.4rem;
position: relative;
text-align: center;
}
.fui-detail-group .fui-cell .share:before {
content: " ";
border-left: 1px solid #C0C0C0;
height: 100%;
left: 0rem;
position: absolute;
}
.fui-detail-group .fui-cell .share:after {
display: none;
}
.fui-detail-group .fui-cell .flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
font-size: 0.6rem;
color: #C0C0C0;
padding-bottom: 0.4rem;
}
.fui-detail-group .fui-cell .flex span {
width: 100%;
text-align: center;
}
.fui-detail-group .fui-cell .flex span:first-child {
text-align: left;
}
.fui-detail-group .fui-cell .flex span:last-child {
text-align: right;
}
.goods-subtitle span {
font-size: .65rem;
padding: .2rem 0
}
.fui-cell-group .fui-cell .row-time {
padding: 0 0 .5rem .5rem;
overflow: hidden;
}
.fui-cell-group .fui-cell .fui-labeltext .text .number {
font-weight: bold;
}
.fui-cell-group .fui-cell .fui-labeltext .text .time {
font-size: .65rem;
padding: 0 .1rem;
}
.fui-cell-group.fui-sale-group:before {
border: 0;
}
.fui-cell-group.fui-sale-group .fui-cell .fui-cell-text,
.fui-cell-group.fui-sale-group .fui-according-header .text {
font-size: 0.65rem;
color: #666;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.fui-cell-group.fui-sale-group .fui-according-header .text .title {
font-weight: bold;
}
/* é™æ—¶è´ */
.fui-labeltext {
position: relative;
border:1px solid #d9d9d9;
display: table-cell;
border-radius: .2rem;
height:1.5rem;
}
.fui-labeltext.fui-labeltext-success {border:1px solid #04ab02 }
.fui-labeltext.fui-labeltext-primary{border:1px solid #0290be }
.fui-labeltext.fui-labeltext-warning {border:1px solid #ff9326 }
.fui-labeltext.fui-labeltext-danger { border:1px solid #ef4f4f }
.fui-labeltext .label {
background:#d9d9d9;
font-size:0.75rem;
float:left;
height:1.5rem; line-height:1.5rem;
padding:0 .2rem;
}
.fui-labeltext.fui-labeltext-success .label {background: #04ab02;color:#fff; }
.fui-labeltext.fui-labeltext-primary .label{background:#0290be;color:#fff; }
.fui-labeltext.fui-labeltext-warning .label {background:#ff9326;color:#fff; }
.fui-labeltext.fui-labeltext-danger .label { background:#ef4f4f;color:#fff; }
.fui-labeltext .text {
float:left;
height:1.5rem; line-height:1.5rem;
padding:0 .2rem;
}
/* åº—é“ºä¿¡æ¯ */
.fui-shop-group .fui-cell:before {
display: none;
}
.fui-shop-group .fui-cell {
padding: 0 0.5rem;
}
.fui-shop-group .fui-cell .shopname {
height: 2rem;
width: 100%;
padding-left: 0.5rem;
margin-top: 0.5rem;
font-size: 0.8rem;
line-height: 1rem;
}
.fui-shop-group .fui-cell .center {
text-align: center;
margin: 0.4rem 0;
position: relative;
font-size: 0.7rem;
}
.fui-shop-group .fui-cell .center:before {
height: 100%;
width: 1px;
content: " ";
position: absolute;
left: 0;
top: 0;
background: #dbdbdb;
}
.fui-shop-group .fui-cell .center:first-child:before {
background: none;
}
.fui-shop-group .fui-cell .center p {
color: #7c7c7c;
font-size: 0.6rem;
}
.fui-shop-group .fui-cell .btn-default-o {
width: 4rem;
height: 1.2rem;
border-color: #7c7c7c;
color: #7c7c7c;
font-size: 0.7rem;
padding: 0;
margin: 0 0.5rem 0.2rem;
line-height: 1.2rem;
display: inline-block;
}
.fui-shop-group .fui-list:after {
display: none
}
.fui-shop-group .title {
font-size: 0.8rem;
}
.fui-shop-group .subtitle {
font-size: 0.7rem;
}
.fui-list-media.radius img {
border-radius: 0.3rem;
}
.fui-list-media.circle img {
border-radius: 2.5rem;
}
/*评论组*/
.fui-comment-group .fui-cell:before {
border: 0;
}
.fui-comment-group .fui-cell {
padding: 0 0.5rem;
}
.fui-comment-group .fui-cell .comment {
padding: 0;
position: relative;
}
.fui-comment-group .fui-cell .comment:before {
content: " ";
width: 100%;
height: 1px;
border-top: 1px solid #eee;
top: 0;
left: 0;
position: absolute;
}
.fui-comment-group .fui-cell .comment .info {
color: #7C7C7C;
font-size: 0.6rem;
width: 100%;
}
.fui-comment-group .fui-cell .comment .info.head {
height: 1.3rem;
line-height: 1.2rem;
}
.fui-comment-group .fui-cell .comment .info .img {
float: left;
}
.fui-comment-group .fui-cell .comment .info .img img {
width: 1.2rem;
height: 1.2rem;
border-radius: .6rem;
}
.fui-comment-group .fui-cell .comment .info .nickname {
float: left;
padding-left: .3rem;
}
.fui-comment-group .fui-cell .comment .info .star {
float: left;
color: #666;
}
.fui-comment-group .fui-cell .comment .info .star span {
padding: 0;
margin: 0
}
.fui-comment-group .fui-cell .comment .info .star .shine {
color: #fd5454;
}
.fui-comment-group .fui-cell .comment .info .star.star1 {
clear: both
}
.fui-comment-group .fui-cell .comment .info .date {
text-align: right;
}
.fui-comment-group .fui-cell .comment .remark {
font-size: 0.7rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
}
.fui-comment-group .fui-cell .comment .remark .img {
padding: 0.2rem 0.2rem 0 0;
}
.fui-comment-group .fui-cell .comment .remark .img img {
height: 50px;
}
.fui-comment-group .fui-cell .desc.label {
font-size: 0.6rem;
text-align: right;
background: none;
font-weight: 100;
}
.fui-comment-group .fui-cell .desc.label span {
color: #fd5454;
}
.fui-comment-group .fui-cell .desc {
font-size: 0.6rem;
color: #7c7c7c;
line-height: 1.5rem;
padding: .2rem 0
}
.comment-block.in {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.comment-block .fui-icon-group {
font-size: .65rem;
}
/** According **/
.fui-according-group {
margin-top: 0.5rem;
background-color: #fff;
line-height: 1.4;
font-size: 0.8rem;
overflow: hidden;
position: relative;
}
.fui-according-group.fui-according-group-o {
margin: 0 .5rem;
border-radius: .5rem;
margin-top: 0.5rem;
}
.fui-according-group:not(.fui-according-group-o):before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-according-group:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
border-bottom: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-according {
position: relative;
}
.fui-according:before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
left: .5rem;
}
.fui-according:first-child:before {
display: none;
}
.fui-according-header {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 100%;
padding: 0.5rem 0.5rem;
-moz-transition-duration: 300ms;
-webkit-transition-duration: 300ms;
transition-duration: 300ms;
-webkit-transition-property: background-color;
transition-property: background-color;
}
.fui-according-header:active {
background: #d9d9d9;
}
.fui-according-header .text {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
color: #333;
font-size: 0.75rem;text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
padding: 0 0.2rem;
}
.fui-according-header .remark {
color: #888;
text-align: right;
font-size: 0.75rem;
}
.fui-according-header .remark:after {
content: " ";
display: inline-block;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
height: 0.3rem;
width: 0.3rem;
border-width: 2px 2px 0 0;
border-color: #C8C8CD;
border-style: solid;
position: relative;
top: -1px;
margin-left: .3em;
}
.fui-according.expanded .remark:after,
.fui-according-header:active .remark:after {
content: " ";
display: inline-block;
-webkit-transform: rotate(135deg);
-ms-transform: rotate(135deg);
transform: rotate(135deg);
height: 0.3rem;
width: 0.3rem;
border-width: 2px 2px 0 0;
border-color: #C8C8CD;
border-style: solid;
position: relative;
top: -1px;
margin-left: .3em;
}
.fui-according-content .content-block {
padding: .5rem .5rem;
color: #666;
box-sizing: border-box;
}
.package-goods {
padding: 0.2rem 0.5rem;
}
.package-goods .package-goods-img {
width: 6.4rem;
width: 6.4rem;
}
.package-goods p {
color: #fd5454;
font-size: 0.6rem;
}
.package-goods span {
height: 1.6rem;
line-height: 0.8rem;
overflow: hidden;
display: block;
color: #333;
font-size: 0.6rem;
}
.package-list {
padding: 0;
overflow-y: auto;
}
.package-buy {
height: 2.4rem;
}
.package-buy a.package-buy-a {
height: 2.4rem;
display: block;
line-height: 2.4rem;
color: #fff;
text-align: center;
background: #ef4f4f;
}
.package-list-inner {
white-space: nowrap;
height: 7rem;
}
.package-list-inner .package-goods {
width: 33.33333333%;
float: left;
}
/* 按钮组2*/
.fui-menu-group {
height: auto;
background: #fff;
margin-top: 0.5rem;
}
.fui-menu-group .fui-menu-item {
padding: 0.5rem;
text-align: center;
position: relative;
color: #666;
font-size: 0.75rem;
width: 1%;
display: table-cell;
-webkit-user-select: none;
-moz-user-select: none;
transition:background-color 300ms;
-webkit-transition: background-color 300ms;
}
.fui-menu-group .fui-menu-item:active {
background: #ececec;
}
.fui-menu-group .fui-menu-item:before {
content: '';
position: absolute;
left: 0;
top: 0.5rem;
bottom: 0.5rem;
border-left: 1px solid #eee;
}
.fui-menu-group .fui-menu-item:first-child:before {
border: 0;
}
.fui-menu-group .fui-menu-item i {
vertical-align: top;
}
/*LIST*/
.fui-list-group {
background-color: #fff;
position: relative;
}
.fui-list-group.fui-list-group-o {
margin: 0 .5rem;
border-radius: .5rem;
margin-top: 0.5rem;
}
.fui-list-group:not(.fui-list-group-o):before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #d9d9d9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-list-group:not(.fui-list-group-o):after {
content: " ";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
border-top: 1px solid #d9d9d9;
color: #D9D9D9;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.fui-list {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: .5rem;
-webkit-transition-duration: 300ms;
transition-duration: 300ms;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
overflow: hidden;
}
.fui-list:before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
left: .5rem;
}
.fui-list:first-child:before {
display: none;
}
.fui-list:active {
background: #ECECEC;
}
.fui-list-media {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
-webkit-flex-shrink: 0;
flex-shrink: 0;
-webkit-box-lines: single;
-moz-box-lines: single;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
box-sizing: border-box;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
margin-right:.5rem;
}
.fui-list-media img {
display: block;
width:2.5rem;
}
.fui-list-media img.round {
border-radius: .3rem;
}
.fui-list-media .badge {
background: red none repeat scroll 0 0;
border-radius: 0.5rem;
color: white;
font-size: 0.7rem;
height: 0.9rem;
right: -.35rem;
line-height: 0.9rem;
min-width: 0.9rem;
padding: 0 0.15rem;
position: absolute;
top: -.3rem;
text-align: center;
vertical-align: top;
z-index: 100;
}
.fui-list-inner {
position: relative;
width: 100%;
overflow: hidden;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
display: block;
}
.fui-list-inner .subtitle {
position: relative;
font-size: 0.7rem;
color: #666;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.fui-list-inner .text {
position: relative;
font-size: 0.65rem;
color: #666;
}
.fui-list-inner .title {
position: relative;
font-size: 0.85rem;
color: #333;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
height:1rem;
line-height:1rem;
}
.fui-list-inner .row {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin: 0;
height:1rem;
line-height:1rem;
}
.fui-list-inner .row .row-text {
font-size: 0.85rem;
color: #333;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.fui-list-inner .row .row-remark {
font-size: 0.75rem;
color: #666;
text-align: right;
}
.fui-list .angle:after {
content: " ";
display: inline-block;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
height: 0.3rem;
width: 0.3rem;
border-width: 2px 2px 0 0;
border-color: #C8C8CD;
border-style: solid;
position: relative;
top: -.2rem;
margin-right: .1rem;
}
.fui-list-angle {
position: relative;
vertical-align: middle;
margin-right: .5rem;
}
.fui-list-angle .angle:after {
position: absolute;
top: 50%;
margin-top:-.3rem;
}
/* 秒æ€ç»„ */
.seckill-group {
margin-top: 0.5rem;
background-color: #fff;
line-height: 1.4;
font-size: 0.8rem;
overflow: hidden;
position: relative;
}
.seckill-group:before {
content: " ";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 1px;
border-top: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.seckill-group:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
border-bottom: 1px solid #D9D9D9;
color: #D9D9D9;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.seckill-group.noborder:before,
.seckill-group.noborder:after {
border: 0;
}
.seckill-group .seckill-title {
position: relative;
padding: 0.5rem 0.5rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-moz-transition-duration: 300ms;
-webkit-transition-duration: 300ms;
transition-duration: 300ms;
-webkit-transition-property: background-color;
transition-property: background-color;
}
.seckill-group .seckill-title .seckill-text {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
font-size:.75rem;
color:#666;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.seckill-group .seckill-title .seckill-remark {
color: #888;
text-align: right;
font-size: 0.7rem;
margin-right: .2rem;
}
.seckill-group .seckill-title .seckill-remark:after {
content: " ";
display: inline-block;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
height: 0.3rem;
width: 0.3rem;
border-width: 2px 2px 0 0;
border-color: #C8C8CD;
border-style: solid;
position: relative;
top: -1px;
margin-left: .3em;
}
.seckill-group .seckill-goods {
padding: 0 0.5rem 0.5rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.seckill-group .seckill-goods .swiper-wrapper {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.swiper-container-autoheight .swiper-wrapper {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.seckill-group .seckill-goods .item {
height: auto;
width: 4rem;
float: left;
}
.seckill-group .seckill-goods .item.last-item {
height: auto;
width: 1.5rem;
font-size: 0.55rem;
color: #666;
text-align: center;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-left: -0.5rem;
}
.seckill-group .seckill-goods .item.last-item .inner {
width: 1rem;
text-align: right;
}
.seckill-group .seckill-goods .item .thumb {
height: 4rem;
width: 4rem;
margin: auto;
position: relative;
}
.seckill-group .seckill-goods .item .thumb img {
height: 4rem;
width: 4rem;
display: block;
}
.seckill-group .seckill-goods .item .thumb .tag {
position: absolute;
bottom: 0;
left: 0;
background: #ef4f4f;
color: #fff;
font-size: 0.5rem;
padding: 0 0.1rem;
line-height: 0.65rem;
}
.seckill-group .seckill-goods .item .thumb .tag.orange {
background: #fe9402;
}
.seckill-group .seckill-goods .item .thumb .tag.purple {
background: #7e42fd;
}
.seckill-group .seckill-goods .item .thumb .tag.green {
background: #4fd88a;
}
.seckill-group .seckill-goods .item .marketprice {
color: #ef4f4f;
text-align: center;
font-size: 0.8rem;
line-height: 1.2rem;
font-weight: bold;
}
.seckill-group .seckill-goods .item .productprice {
color: #999;
text-decoration: line-through;
font-size: 0.6rem;
text-align: center;
line-height: 0.6rem;
}
.seckill-group .killtime {
display: inline-block;
font-size: 0.65rem;
color: #444;
}
.seckill-group {
height: auto;
}
.seckill-group img {
height: 0.9rem;
max-width: 5rem;
margin-right: 0.2rem
}
.seckill-group .title {
font-size: 0.7rem;
color: #444;
margin-right: 0.2rem;
}
.seckill-group .killtime span {
display: inline-block;
padding: 0;
margin: 0;
}
.seckill-group .killtime .item {
height: 0.8rem;
line-height: 0.75rem;
border: 1px solid #ddd;
padding: 0 0.1rem;
margin: 0 1px;
}
.fui-audio {
height: auto;
background: #f1f1f1;
margin: 0.8rem;
padding: 0.6rem;
border: 1px solid #ededed;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
}
.fui-audio .horn {
width: 1.4rem;
height: 1.25rem;
background-image: url(../images/icon_audio_reading_3.png);
background-size: auto 100%;
background-repeat: no-repeat;
}
.fui-audio .horn.playing {
-webkit-animation: audio_playing 1s infinite;
}
.fui-audio .center {
width: 100%;
padding-right: 0.2rem;
font-size: 0.75rem;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.fui-audio .center p {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.fui-audio .time {
font-size: 0.7rem;
color: #666;
}
.fui-audio .speed {
position: absolute;
bottom: -1px;
left: -1px;
width: 20%;
height: 0.1rem;
background: #44b549;
-webkit-transition: width .3s;
transition: width .3s;
}
.fui-chat-item {
height: 2.2rem;
margin: 0.8rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
justify-content: flex-start;
}
.fui-chat-item .face {
height: 2.2rem;
width: 2.2rem;
background: #eee;
-webkit-box-shadow:0 0 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow:0 0 2px rgba(0, 0, 0, 0.1);
box-shadow:0 0 2px rgba(0, 0, 0, 0.1);
}
.fui-chat-item .face img {
height: inherit;
width: inherit;
display: block;
}
.fui-chat-item .msg {
margin: 0 2.7rem 0 0.5rem;
background: #fefefe;
padding: 0 0.8rem;
position: relative;
border-radius: 0.25rem;
border: 1px solid rgba(195, 195, 195, 0.3);
-webkit-box-shadow:0 0 1px rgba(195, 195, 195, 0.1);
-moz-box-shadow:0 0 1px rgba(195, 195, 195, 0.1);
box-shadow:0 0 1px rgba(195, 195, 195, 0.1);
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
justify-content: flex-start;
min-width: 4rem;
}
.fui-chat-item .msg:before {
content: "";
position: absolute;
top: 50%;
left: -0.28rem;
height: 0.4rem;
width: 0.4rem;
background: #fefefe;
margin-top: -0.2rem;
transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-o-transform:rotate(45deg);
border: 1px solid rgba(195, 195, 195, 0.3);
-webkit-box-shadow:0 0 1px rgba(195, 195, 195, 0.1);
-moz-box-shadow:0 0 1px rgba(195, 195, 195, 0.1);
box-shadow:0 0 1px rgba(195, 195, 195, 0.1);
}
.fui-chat-item .msg:after {
content: "";
position: absolute;
top: 50%;
left: -0.2rem;
height: 0.45rem;
width: 0.45rem;
background: #fefefe;
margin-top: -0.18rem;
transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-o-transform:rotate(45deg);
}
.fui-chat-item .msg .horn {
height: 1rem;
width: 1.4rem;
background-image: url(../images/icon_audio_reading_gray_3.png);
background-size: auto 100%;
background-repeat: no-repeat;
}
.fui-chat-item .msg .horn.playing {
-webkit-animation: chat_playing_gray 1s infinite;
}
.fui-chat-item.right {
justify-content: flex-end;
}
.fui-chat-item.right .msg {
border: 1px solid rgba(20, 80, 36, 0.15);
-webkit-box-shadow:0 0 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow:0 0 1px rgba(0, 0, 0, 0.1);
box-shadow:0 0 1px rgba(0, 0, 0, 0.1);
background: #a0e75a;
margin: 0 0.5rem 0 2.7rem;
transform:rotate(180deg);
-ms-transform:rotate(180deg);
-moz-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
-o-transform:rotate(180deg);
}
.fui-chat-item.right .msg:before {
content: "";
position: absolute;
top: 50%;
left: -0.28rem;
height: 0.4rem;
width: 0.4rem;
background: #a0e75a;
margin-top: -0.2rem;
transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-o-transform:rotate(45deg);
border: 1px solid rgba(20, 80, 36, 0.15);
-webkit-box-shadow:0 0 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow:0 0 1px rgba(0, 0, 0, 0.1);
box-shadow:0 0 1px rgba(0, 0, 0, 0.1);
}
.fui-chat-item.right .msg:after {
content: "";
position: absolute;
top: 50%;
left: -0.2rem;
height: 0.5rem;
width: 0.5rem;
background: #a0e75a;
margin-top: -0.20rem;
transform:rotate(45deg);
-ms-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-o-transform:rotate(45deg);
}
.fui-chat-item.right .msg .horn {
height: 1rem;
width: 1.4rem;
background-image: url(../images/icon_audio_reading_green_3.png);
background-size: auto 100%;
background-repeat: no-repeat;
}
.fui-chat-item.right .msg .horn.playing {
-webkit-animation: chat_playing_green 1s infinite;
}
.seckill-page {
position: relative;
overflow: hidden;
}
.seckill-page .swiper-container.room-container {
width:100%;
position:relative;
}
.seckill-page .swiper-container.room-container .swiper-wrapper {
display: flex;
}
.seckill-page .swiper-container.room-container:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
border-bottom: 1px solid #D9D9D9;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.seckill-page .swiper-container.room-container .room-slide {
text-align: center;
font-size:.7rem;
color:#666;
float:left;
width:20%;
padding:5px 0;
}
.seckill-page .swiper-container.time-container {
width:100%;
padding-top:.1rem;
text-align: center;
}
.seckill-page .swiper-container.time-container .swiper-wrapper{
}
.seckill-page .swiper-slide.time-slide {
width:20%;
text-align: center;
padding:.1rem 0;
float:left;
}
.seckill-page .swiper-slide.time-slide.current{
color:#ff3300;
}
.seckill-page .swiper-slide.time-slide .text,
.seckill-page .swiper-slide.time-slide .time {
display: block;
-moz-transition-duration: 100ms;
-webkit-transition-duration: 100ms;
transition-duration: 100ms;
-webkit-transition-property: color,font-size;
transition-property: color,font-size;
}
.seckill-page .swiper-slide.time-slide .time {
font-size:.7rem;
height:1.2rem;
padding-top:.2rem;
}
.seckill-page .swiper-slide.time-slide .text {
font-size:.5rem;
height:1rem;
}
.seckill-page .swiper-slide.time-slide.current .time {
font-size:.9rem;
height:1.2rem;
padding-top:0rem;
}
.seckill-page .swiper-slide.time-slide.current .text {
padding-top:-.2rem;
}
.seckill-page .swiper-container.adv-container {
width:100%;
}
.seckill-page .swiper-slide.adv-slide {
width:33.33%;
text-align: center;
background:#fff;
padding:2px;
float:left;
}
.seckill-page .swiper-slide.adv-slide img {
width:100%;
}
.seckill-page .fui-list {
padding-top:.2rem;
padding-bottom:.5rem;
}
.seckill-page .fui-list .fui-list-media{
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: start
}
.seckill-page .fui-list .fui-list-media img {
width:4rem;
height:4rem;
}
.seckill-page .fui-list .fui-list-inner .text{
color: #444;
display: block;
font-size:.7rem;
padding-bottom:.5rem;
}
.seckill-page .fui-list .fui-list-inner .info {
display:block;width:100%;
}
.seckill-page .fui-list .fui-list-inner .info .button {
float:right;
margin-top:-.2rem;
}
.seckill-page .fui-list .fui-list-inner .info .price {
color:#f02b2b;
font-size:.9rem;
} .seckill-page .fui-list .fui-list-inner .info .price1 {
color:#949598;
font-size:.6rem;
text-decoration: line-through;
}
.seckill-page .fui-list .fui-list-inner .info.info1{
height:.4rem;
line-height:.4rem;
}
.seckill-page .fui-list-group-title {
padding:5px 0;
}
.seckill-page .fui-list-group-title .timer {
float:right;
color:#6b6b6b;
}
.seckill-page .fui-list-group-title .timer span {
display: inline-block;
background:#464553;
color:#fff;
width:20px;height:20px;
border-radius: .1rem;
line-height:20px;
margin:0 2px;
font-size:12px; text-align: center;
}
.seckill-page .fui-list:before {
left: 0;
right:0;
}
.seckill-page .fui-list .fui-list-inner .info .process-text {
float:left;
font-size:10px;
color:#d0d1d2;
padding-right:5px;
padding-top:1px;
height:10px;
}
.seckill-page .fui-list .fui-list-inner .info .process {
float:left;
width:80px;
height:8px;
border:1px solid #ff8f8f;
border-radius: 2px;
overflow:hidden;
margin-top:2px;
}
.seckill-page .fui-list .fui-list-inner .info .process .inner {
width:5rem;
height:.5rem;
background:#ff8f8f;
}
.seckill-page .fui-list .fui-list-inner .btn.btn-success{
background:#04be02;border:1px solid #04ab02;color:#fff;
}
.seckill-page .swiper-container.goods-container {
width:100%;
}
.seckill-page .fui-list-group .fui-list.align-start {
-webkit-box-align: start;
-webkit-align-items: start;
-ms-flex-align: start;
align-items: start
}
.page-goods-detail .seckill-container {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.page-goods-detail .seckill-container .seckill-list,
.page-goods-detail .seckill-container .seckill-list1 {
}
.page-goods-detail .seckill-container.notstart .seckill-list,
.page-goods-detail .seckill-container.notstart .seckill-list1,
.page-goods-detail .seckill-container.notstart .seckill-list2 {
}
.page-goods-detail .seckill-container .seckill-list{
flex:1;
color:#fff;
padding:0em .5rem;
margin-top:-1px;
}
.page-goods-detail .seckill-container .seckill-list .fui-list-inner .text{
color:#fff;
height:.9rem;
}
.page-goods-detail .seckill-container .seckill-list .seckill-price{
font-size:1rem;
color:#fff;
-webkit-box-align: baseline;
-webkit-align-items: baseline;
-ms-flex-align: baseline;
align-items: baseline;
width:auto;
}
.page-goods-detail .seckill-container .seckill-list .seckill-price span{
font-size:1.85rem;
}
.page-goods-detail .seckill-container .seckill-list .oldprice{
color:rgba(255,255,255,.5);
}
.page-goods-detail .seckill-container .seckill-list .fui-list-media{
}
.page-goods-detail .seckill-container .seckill-list .stitle{
display: inline-block;
border:1px solid #fff;
border-radius: .2rem;
font-size:.4rem;
padding:0 .2rem;
}
.page-goods-detail .seckill-container .seckill-list1 .fui-list-inner .text{
text-align: center;
color:#fff;
}
.page-goods-detail .seckill-container .seckill-list1 .fui-list-inner .text .process {
float:left;
width:4rem;
height:.6rem;
border:1px solid #efd74f;
border-radius: .5rem;
overflow:hidden;
margin-top:.3rem;
}
.page-goods-detail .seckill-container .seckill-list1 .fui-list-inner .text .process .inner {
width:5rem;
height:.6rem;
background:#efd74f;
}
.page-goods-detail .seckill-container .seckill-list2 .fui-list-inner .text {
font-size:.6rem;
text-align: center;
height:.95rem;
color:#ef4f4f
}
.page-goods-detail .seckill-container .seckill-list2 .fui-list-inner .text.timer span {
display: inline-block;
background:#582e19;
color:#fff;
width:.9rem;height:.9rem;
border-radius: .1rem;
line-height:.9rem;
font-size:.5rem; text-align: center;
}
.page-goods-detail .seckill-container .seckill-list2{
padding:0;
width:5rem;
background:#ffef32;
}
.page-goods-detail .seckill-container .seckill-list2,
.page-goods-detail .seckill-container .seckill-list1 {
margin-top:-.1rem;
}
.page-goods-detail .seckill-container.notstart .seckill-list2 .fui-list-inner .text {
color:#fff;
}
.page-goods-detail .seckill-container.notstart .seckill-list2 .fui-list-inner .text.timer span{
background:rgba(0,0,0,.7);
}
.page-goods-detail .buybtn.seckill-notstart {
background:#00b950;
}
/* å…‘æ¢é¡µé¢ å…‘æ¢è§„则 */
.diy-exchange-rule {
padding: 0.5rem 0 1.4rem;
background: #fafafa;
}
.diy-exchange-rule .head {
height: 2rem;
line-height: 2rem;
text-align: center;
position: relative;
}
.diy-exchange-rule .head:before {
position: absolute;
top: 50%;
left: 0;
right: 0;
border-top: 1px solid #efefef;
content: "";
height: 0;
z-index: 1;
}
.diy-exchange-rule .head .title {
height: 2rem;
background: #f9f9f9;
max-width: 80%;
padding: 0 0.6rem;
position: relative;
z-index: 2;
display: inline-block;
position: relative;
overflow: hidden;
color: #555;
}
.diy-exchange-rule .head .title:before,
.diy-exchange-rule .head .title:after {
content: '';
position: absolute;
top: 50%;
left: 0;
height: 0.2rem;
width: 0.2rem;
background: #cdcdcd;
border-radius: 0.2rem;
margin-top: -0.07rem;
}
.diy-exchange-rule .head .title:after {
left: auto;
right: 0;
}
.diy-exchange-rule .info {
padding: 0 1rem;
color: #666;
font-size: 0.7rem;
}
/* å…‘æ¢ä¸å¿ƒ ä¸éƒ¨åŒºåŸŸ */
.diy-exchange-input {
height: auto;
overflow: hidden;
padding-bottom: 10px;
background: #fafafa;
}
.diy-exchange-input .title {
text-align: center;
font-size: 16px;
padding: 12px 18px 14px;
line-height: 16px;
}
.diy-exchange-input .title .num {
font-size: 12px;
color: #999;
}
.diy-exchange-input .input {
height: auto;
overflow: hidden;
border: 1px solid #efefef;
margin: 0 48px 12px;
border-radius: 4px;
}
.diy-exchange-input .input input {
height: 30px;
width: 100%;
border-radius: 0.2rem;
border: 0;
padding: 0 0.4rem;
font-size: 0.7rem;
text-align: center;
color: #666;
-webkit-appearance: none;
}
.diy-exchange-input .btn-danger{
margin: 0 2.4rem;
border: 0;
}
.diy-exchange-input .btn-default {
margin: 0.5rem 1rem 0;
overflow: hidden;
}
.diy-exchange-input .list {
background: #fff;
margin: 0 1rem;
border-radius: 0.2rem;
}
.diy-exchange-input .list .item {
padding: 0.6rem;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
position: relative;
}
.diy-exchange-input .list .item:after {
content: '';
position: absolute;
bottom: 0;
right: 0.5rem;
left: 3rem;
border-bottom: 1px solid #efefef;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.diy-exchange-input .list .item:last-child:after {
display: none;
}
.diy-exchange-input .list .item .ico {
height: 2rem;
width: 2rem;
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center;
}
.diy-exchange-input .list .item .ico.money {
background-image: url("../images/default/icon_money.png");
}
.diy-exchange-input .list .item .ico.credit {
background-image: url("../images/default/icon_credit.png");
}
.diy-exchange-input .list .item .ico.coupon {
background-image: url("../images/default/icon_coupon.png");
}
.diy-exchange-input .list .item .ico.redbag {
background-image: url("../images/default/icon_redbag.png");
}
.diy-exchange-input .list .item .info {
width: 100%;
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
padding: 0 0.5rem;
line-height: 0.9rem;
}
.diy-exchange-input .list .item .info .t1 {
font-size: 0.75rem;
color: #444;
}
.diy-exchange-input .list .item .info .t2 {
color: #aaa;
font-size: 0.65rem;
}
.diy-exchange-input .list .item .btn-exc {
margin: 0;
padding: 0;
text-align: center;
width: 3.2rem;
}
.diy-exchange-input .list .item .btn-exc.disabled {
background: #ccc;
color: #fff;
border: 0;
}
.fui-danmu {
height: 32px;
max-width: 240px;
border-radius: 16px;
position: absolute;
top: 20px;
left: 10px;
z-index: 999;
padding: 3px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
font-size: 14px;
color: #fff;
overflow: hidden;
}
.fui-danmu:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #000;
z-index: 1;
opacity: 0.7;
}
.fui-danmu.style2 {
border-radius: 4px;
}
.fui-danmu.style2 .thumb {
border-radius: 4px;
}
.fui-danmu .thumb {
height: 26px;
width: 26px;
border-radius: 50%;
background: #fff;
position: relative;
z-index: 2;
}
.fui-danmu .text {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
padding-left: 4px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
z-index: 2;
}
.fui-danmu .time {
text-align: right;
padding: 0 4px;
font-size: 13px;
position: relative;
z-index: 2;
}
.fui-startadv {
position: absolute;
top: 0;
left: 0;
top: 0;
right: 0;
bottom: 0;
z-index: 10000;
}
.fui-startadv:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #000;
opacity: 0.6;
}
.fui-startadv .inner {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #fff;
z-index: 10001;
}
.fui-startadv .inner img {
display: none;
}
.fui-startadv .inner img:first-child {
display: block;
}
.fui-startadv.small-bot .inner,
.fui-startadv.small-top .inner {
width: 80%;
height: 70%;
position: relative;
margin: 14% auto 0;
}
.fui-startadv.small-top .inner {
margin: 22% auto 0;
}
.fui-startadv .inner img {
width: 100%;
height: 100%;
}
.fui-startadv.default .inner .close-adv {
position: absolute;
top: 14px;
right: 14px;
z-index: 10002;
background: rgba(0,0,0,0.5);
color: #fff;
font-size: 14px;
padding: 2px 8px;
border-radius: 20px;
}
.fui-startadv.small-bot .inner .close-adv,
.fui-startadv.small-top .inner .close-adv {
width: 100%;
height: 90px;
position: absolute;
bottom: -90px;
}
.fui-startadv.small-top .inner .close-adv {
top: -60px;
height: 60px;
bottom: 0;
}
.fui-startadv.small-bot .inner .close-adv:before,
.fui-startadv.small-top .inner .close-adv:before {
position: absolute;
height: 42px;
content: "";
width: 1px;
background: #fff;
left: 50%;
margin-left: -0.5px;
display: none;
}
.fui-startadv.small-top .inner .close-adv:before {
left: auto;
right: 18px;
bottom: 0;
height: 24px;
}
.fui-startadv.small-bot .inner .close-adv .close-btn,
.fui-startadv.small-top .inner .close-adv .close-btn {
height: 48px;
width: 48px;
position: absolute;
bottom: 0;
left: 50%;
margin-left: -24px;
}
.fui-startadv.small-top .inner .close-adv .close-btn {
height: 36px;
width: 36px;
top: 0;
left: auto;
right: 0;
}
.fui-startadv.small-bot .inner .close-adv .close-btn:before,
.fui-startadv.small-top .inner .close-adv .close-btn:before {
height: 48px;
width: 48px;
position: absolute;
content: "×";
color: #fff;
line-height: 38px;
text-align: center;
font-size: 56px;
font-weight: 100;
border: 1px solid #fff;
border-radius: 48px;
left: -1px;
top: -1px;
}
.fui-startadv.small-top .inner .close-adv .close-btn:before {
height: 36px;
width: 36px;
line-height: 30px;
font-size: 42px;
}
.fui-startadv .fui-swipe {
height: 100%;
}
.fui-startadv .fui-swipe-bullet {
background: #fff;
margin: 0 3px;
}
.fui-startadv .dots {
height: 14px;
padding: 0 10px;
position: absolute;
left: 0;
right: 0;
bottom: 10px;
text-align: center;
}
.fui-startadv .dots span {
height: 10px;
width: 10px;
background: #fff;
display: inline-block;
opacity: 0.5;
border-radius: 10px;
}
.fui-startadv .dots span:first-child {
opacity: 1;
}
.fui-tab a {
color: #666;
font-size: 14px;
width: 100%;
height: 38px;
line-height: 38px;
-webkit-box-flex: 1;
-ms-flex: 1;
border: 0;
border-bottom: 2px solid transparent;
border-radius: 0;
text-align: center;
}
.fui-tab.fui-tab-danger a.active {
color: #ef4f4f;
border-color: #ef4f4f;
z-index: 2;
}