@charset "utf-8";
* {
    -webkit-backface-visibility:hidden;         /*ios闪屏*/
}
html {
    font-size: 20px;
}
body {
    color: #333;
    background-color: #f5f5f5;
}
.wrap {
    width: 100%;
    height: 100%;
    background-color: #f2f4f7;
}
/* 清除浮动 */
.clear {
    clear: both;
    overflow: hidden;
    height: 0;
}
.clearfix {
    display: block;
    zoom: 1;
}
.clearfix:after {
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    clear: both;
    visibility: hidden;
}
*html .clearfix {
    height: 1%;
    zoom: 1;
}
a {
    color: #666;
    text-decoration: none;
}
* {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
}
html,body {
    width:100%;
    height:100%;
}
.hide {
    display: none;
}
.over {
    overflow: hidden;
}
.flex {
  display: box;           /* OLD - Android 4.4- */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  display: -webkit-box;   /* OLD - iOS 6-, Safari 3.1-6 */
  display: -webkit-flex;     /* NEW - Chrome */
  -webkit-box-orient: horizontal;
  
}
.flex-one {
    -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 */
    -webkit-flex: 1;          /* Chrome */            /* IE 10 */
    flex: 1; 
}
.flex-two {
    display: block;
    -webkit-box-flex: 2;      /* OLD - iOS 6-, Safari 3.1-6 */
    -webkit-flex: 2;          /* Chrome */            /* IE 10 */
    flex: 2; 
}
.flex-three {
    display: block;
    -webkit-box-flex: 3;      /* OLD - iOS 6-, Safari 3.1-6 */
    -webkit-flex: 3;          /* Chrome */            /* IE 10 */
    flex: 3; 
}
.flex-four {
    display: block;
    -webkit-box-flex: 4;      /* OLD - iOS 6-, Safari 3.1-6 */
    -webkit-flex: 4;          /* Chrome */            /* IE 10 */
    flex: 4; 
}
/*===============================下拉加载样式开始====================================  */
.pullDown,
.pullUp {
    font-family: Arial, Microsoft YaHei;
    font-size: 0.62rem;
    line-height: 1rem !important;
    text-align: center;
    color: #888;
} 
.pullDown {
    height: 3.42rem;
}
.pullUp {
    height:3rem;
}
.pullDown .loader {
    width:100%;
    height:2.42rem;
    background:url('../img/common/loading.png') no-repeat center 0.22rem;
    background-size: 2.16rem;
}
.loader {
    font-size: 0;
    display: inline-block;
    display: none;
    padding: 0;
}
.pullDownImg {
    width:100%;
    height:2.42rem;
    background:url('../img/common/pic-refresh.png') no-repeat center 0.22rem;
    background-size: 2.08rem 2.16rem;
}
.pullDownLabel {
    font-size:0.62rem;
}
.pullUpLabel {
    font-size:0.62rem;
    line-height:2rem;
}
.loader span {
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    margin: 0 2px;
    -webkit-animation: loader .8s linear infinite alternate;
            animation: loader .8s linear infinite alternate;
    vertical-align: middle;
    border-radius: 100%;
}
.loader span:nth-child(1) {
    -webkit-animation-delay: -1s;
            animation-delay: -1s;

    background: rgba(245, 103, 115,.6);
}
.loader span:nth-child(2) {
    -webkit-animation-delay: -.8s;
            animation-delay: -.8s;

    background: rgba(245, 103, 115,.8);
}
.loader span:nth-child(3) {
    -webkit-animation-delay: -.26666s;
            animation-delay: -.26666s;

    background: rgba(245, 103, 115,1);
}
.loader span:nth-child(4) {
    -webkit-animation-delay: -.8s;
            animation-delay: -.8s;

    background: rgba(245, 103, 115,.8);
}
.loader span:nth-child(5) {
    -webkit-animation-delay: -1s;
            animation-delay: -1s;

    background: rgba(245, 103, 115,.4);
}
@keyframes loader {
    from {
        transform: scale(0, 0);
    }
    to {
        transform: scale(1, 1);
    }
}
@-webkit-keyframes loader {
    from {
        -webkit-transform: scale(0, 0);
    }
    to {
        -webkit-transform: scale(1, 1);
    }
}
.swing{
    -webkit-animation:swinging 1s ease 0.1s infinite;
    animation:swinging swinging 10s ease 0.1s infinite;
    -webkit-transform-origin:50% 0;
    transform-origin:50% 0;
}
@keyframes swinging{
     0% { -webkit-transform: rotate(0)  translateX(0); }
    5% { -webkit-transform: rotate(-1deg) translateX(-0.125rem); }
    10% { -webkit-transform: rotate(-2deg) translateX(-0.25rem); }
    15% { -webkit-transform: rotate(-3deg) translateX(-0.325rem); }
    20% { -webkit-transform: rotate(-4deg) translateX(-0.5rem); }
    25% { -webkit-transform: rotate(-5deg) translateX(-0.725rem); }
    30% { -webkit-transform: rotate(-4deg) translateX(-0.5rem); }
    35% { -webkit-transform: rotate(-3deg) translateX(-0.325rem); }
    40% { -webkit-transform: rotate(-2deg) translateX(-0.25rem); }
    45% { -webkit-transform: rotate(-1deg) translateX(-0.125rem); }
    50% { -webkit-transform: rotate(0deg) translateX(0rem); } 
    55% { -webkit-transform: rotate(1deg) translateX(0.125rem); } 
    60% { -webkit-transform: rotate(2deg) translateX(0.25rem); } 
    65% { -webkit-transform: rotate(3deg) translateX(0.325rem); } 
    70% { -webkit-transform: rotate(4deg) translateX(0.5rem); } 
    75% { -webkit-transform: rotate(5deg) translateX(0.725rem); } 
    80% { -webkit-transform: rotate(4deg) translateX(0.5rem); } 
    85% { -webkit-transform: rotate(3deg) translateX(0.325rem); }
    90% { -webkit-transform: rotate(2deg) translateX(0.25rem); } 
    95% { -webkit-transform: rotate(1deg) translateX(0.125rem); } 
    100% { -webkit-transform: rotate(0) translateX(0rem); } 
}
@-webkit-keyframes swinging{
     0% { -webkit-transform: rotate(0)  translateX(0); }
    5% { -webkit-transform: rotate(-1deg) translateX(-0.125rem); }
    10% { -webkit-transform: rotate(-2deg) translateX(-0.25rem); }
    15% { -webkit-transform: rotate(-3deg) translateX(-0.325rem); }
    20% { -webkit-transform: rotate(-4deg) translateX(-0.5rem); }
    25% { -webkit-transform: rotate(-5deg) translateX(-0.725rem); }
    30% { -webkit-transform: rotate(-4deg) translateX(-0.5rem); }
    35% { -webkit-transform: rotate(-3deg) translateX(-0.325rem); }
    40% { -webkit-transform: rotate(-2deg) translateX(-0.25rem); }
    45% { -webkit-transform: rotate(-1deg) translateX(-0.125rem); }
    50% { -webkit-transform: rotate(0deg) translateX(0rem); } 
    55% { -webkit-transform: rotate(1deg) translateX(0.125rem); } 
    60% { -webkit-transform: rotate(2deg) translateX(0.25rem); } 
    65% { -webkit-transform: rotate(3deg) translateX(0.325rem); } 
    70% { -webkit-transform: rotate(4deg) translateX(0.5rem); } 
    75% { -webkit-transform: rotate(5deg) translateX(0.725rem); } 
    80% { -webkit-transform: rotate(4deg) translateX(0.5rem); } 
    85% { -webkit-transform: rotate(3deg) translateX(0.325rem); }
    90% { -webkit-transform: rotate(2deg) translateX(0.25rem); } 
    95% { -webkit-transform: rotate(1deg) translateX(0.125rem); } 
    100% { -webkit-transform: rotate(0) translateX(0rem); } 
}
.spin{
     -webkit-animation:spining 1s ease 0.1s infinite;
    animation:spining spining 10s ease 0.1s infinite;
}
@-webkit-keyframes spining{
    from{-webkit-transform:rotate(0deg)}
    to{-webkit-transform:rotate(360deg)}
}
.pull {
    height: 100%;
}
/*===============================下拉加载样式结束====================================  */
.no-imformation {
    font-family: Arial, Microsoft YaHei;
    font-size: 0.6rem;
    line-height: 1rem !important;
    height: 2rem;
    text-align: center;
    color: #888;
}
.no-imformation-label {
    line-height: 2rem;
}

/*===============================列表暂无数据样式start==================================  */
.no-data {
    height:100%;
}
.empty {
    height:100%;
    background:#fff;
}
#sorry {
    padding-top: 0.1px;
}
/* #sorry .empty-ad {
    margin-top: 4rem;
} */
.empty-ad {
    height:6.8rem;
    background:url('../img/common/search-no.png') no-repeat 50% 0.2rem;
    background-size: 5.23rem 6.3rem;
}
.empty p{
    font-size:0.67rem;
    color:#999;
    text-align:center;
    line-height: 2.2rem;
    padding-bottom: 1rem;
}
.nothing {
    color: #A9A9A9;
}
/*===============================列表暂无数据样式end====================================  */

.img-father
{
    position: relative;
    /*padding: 10px;*/
}
.img-father .img-container {
   /* height: 80px;
    width: 80px;*/
}
.img-father .img-container img {
    width: 100%;
    height: 100%;
    vertical-align: middle;
    object-fit: cover;
    /*border-top-left-radius: 3px;
    border-top-right-radius: 3px;*/
    
    border-radius: 3px;
}

.shake {
    -webkit-transform-origin: center center;
    -webkit-animation-name: shake-rotate;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
}
.shakecontainer .img-container img {
    border: 1px solid #CCCCCC;
    border-radius: 6px;
}
.shakecontainer .img-content {
    display: none;
}
.shakecontainer .img-remove,
.shakecontainer .img-index {
    display: block;
}
.design-of-all  li[draggable=true] {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
}
.design-of-all  li[draggable=true]>div {
    -webkit-animation-name: none;
}
.design-of-all  li[draggable=true] .img-remove,
.design-of-all  li[draggable=true] .img-index {
    display: none;
}
.sort-handle {
    cursor: move;
    cursor: -webkit-grabbing;
}
.sort-ghost {
    opacity: 0;
}
.sort-chosen {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transition: transform .3s;
    -webkit-transition: transform .3s;
}
.sort-chosen:last-child {
    transition: none;
    -webkit-transition: none;
}
@-webkit-keyframes shake-rotate {
    0% {
        -webkit-transform: rotate(0deg);
    }
    12.5% {
        -webkit-transform: rotate(1.25deg);
    }
    25% {
        -webkit-transform: rotate(2.5deg);
    }
    37.5% {
        -webkit-transform: rotate(1.25deg);
    }
    50% {
        -webkit-transform: rotate(0deg);
    }
    62.5% {
        -webkit-transform: rotate(-1.25deg);
    }
    75% {
        -webkit-transform: rotate(-2.5deg);
    }
    87.5% {
        -webkit-transform: rotate(-1.25deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
    }
}
/*===============================列表暂无数据样式end====================================  */
/*===============================头部样式start====================================  */
.fix-header-wrap {
    position: relative;
    width: 100%;
    height: 100%;
}
.fix-header-content{
    position: absolute;
    top: 2.1rem;
    bottom: 0;
    overflow: hidden;
    width: 100%;
    height: auto;
}
.fix-header-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: auto;
}

header {
    width: 100%;
    height: 2.1rem;
    background-color: #1e82d2;
    position: fixed;
}
.header-item {
    position: relative;
    width: 100%;
    height: 2.1rem;
    background-color: #1e82d2;
    font-size: 0;
    line-height: 2.1rem;
    color: #fff;
    z-index: 3;
}
.header-back {
    display: inline-block;
    width: 12%;
    height: 2.1rem;
    background: url(../img/common/icon-back.png) center center no-repeat;
    background-size: 0.42rem;
}
.header-item span {
    display: inline-block;
    width: 63%;
    vertical-align: top;
    font-size: 0.8rem;
    text-align: center;
    text-indent: 13%;
}
.header-other-item span {
    width: 68%;
}
.header-more {
    display: inline-block;
    width: 25%;
    vertical-align: top;
    font-size: 0.67rem;
    text-align: center;
    color: #fff;
}
.header-share {
    display: inline-block;
    width: 15%;
    height: 2.1rem;
    vertical-align: top;
    background: url(../img/common/share.png) center center no-repeat;
    background-size: .56rem;
    float: right;
}
.header-other-more {
    width: 20%;
}
/*===============================头部样式end====================================  */
/*===============主题色相关样式start==================*/
.topic-bg {
    background-color: #1e82d2 !important;
    color: #fff !important;
}
.topic-fc {
    color: #1e82d2 !important;
}
.topic-border {
    border: 1px solid  #1e82d2 !important;
}
.tab-current {
    border-bottom: 0.1rem solid #1e82d2 !important;
    color: #1e82d2 !important;
}
/*===============主题色相关样式end==================*/
/*===============================toast样式开始====================================  */
.toast {
    position: fixed;
    padding: 0.2rem;
    z-index: 9999;
    max-width: 90%;
    background-color: #999;
    color: #fff;
    font-size: 0.7rem;
    line-height: 1.1rem;
    border-radius: 5px;
}
/*===============================toast样式结束====================================  */
/* iOS下禁用文本选择输入框将不能输入文字，将文本框单独添加此样式start */
/* android 4.4以下禁用文本选择输入框将不能输入文字，将文本框单独添加此样式start */
input,
textarea {
    -webkit-touch-callout: text;
    -webkit-user-select: text;
    user-select: text;
}
.clickCancle {
    pointer-events: none;
}
/*===============请求数据遮罩start======================*/
#mask {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 100;
    width: 100%;
    background: rgba(0,0,0,0.5);
}
#mask .please-hold {
    position: absolute;
    left: 37%;
    top: 37%;
    z-index: 99999;
    width: 5rem;
    height: 6rem;
}
#mask img {
    width: 3.71rem;
    position: absolute;
    left: 0;
}
#mask p {
    position: absolute;
    bottom: 0;
    width: 100%;
    line-height: 1.5rem;
    color: #fff;
    font-size: .7rem;
    text-align: center;
}
#mask .loading {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../img/common/icon_loading1.png) top center no-repeat;
    background-size: 3.71rem 4.37rem;
    -webkit-animation: loading .8s linear infinite alternate;
            animation: loading .8s linear infinite alternate;
}

@keyframes loading {
    0% { 
        background: url(../img/common/icon_loading1.png) top center no-repeat;
        background-size: 3.71rem 4.37rem;
    }
    33% {
        background: url(../img/common/icon_loading2.png) top center no-repeat;
        background-size: 3.71rem 4.37rem;
    }
    66% { 
        background: url(../img/common/icon_loading3.png) top center no-repeat;
        background-size: 3.71rem 4.37rem;
    }
    100% { 
        background: url(../img/common/icon_loading1.png) top center no-repeat;
        background-size: 3.71rem 4.37rem; 
    }
}
@-webkit-keyframes loading {
     0% { 
        background: url(../img/common/icon_loading1.png) top center no-repeat;
        background-size: 3.71rem 4.37rem;
    }
    33% {
        background: url(../img/common/icon_loading2.png) top center no-repeat;
        background-size: 3.71rem 4.37rem;
    }
    66% { 
        background: url(../img/common/icon_loading3.png) top center no-repeat;
        background-size: 3.71rem 4.37rem;
    }
    100% { 
        background: url(../img/common/icon_loading1.png) top center no-repeat;
        background-size: 3.71rem 4.37rem; 
    }
}
.invisible-mask {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    width: 100%;
}
/*===============请求数据遮罩start======================*/