/* NOTE: 名片首页头部 2016.12.18 */
/*body{*/
    /*opacity: 0;*/
/*}*/
.m-header {
    border-radius: 0 0 10px 10px;
}

.m-bg-per {
    height: 8.75rem;
    z-index: -1;
}

.m-bg-per img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.m-bg-per>.m-btn-shortcut {
    top: 0;
    right: 0;
    padding: .45rem .4rem 0 0;
}

.m-bg-per>.m-btn-shortcut>a, .m-card-edit, .m-collect{
    width: 1.7rem;
    line-height: 1.7rem;
    height: 1.7rem;
    margin-left: .36rem;
}

.m-header-btn-left{
    top: .45rem;
    left: .4rem;
}
.m-card-edit, .m-collect{
    margin-left: 0;
    margin-right: .36rem;
    transition: all .2s linear;
    -webkit-transition: all .2s linear;
}
.m-card-edit i, .m-collect i{
    line-height: 1.7rem;
}
.m-collect.action{
    color: #fc6719;
}

.m-collect em{
    padding: 0 .1rem;
    line-height: normal;
    top: 50%;
    right: 0;
    transform: translate(100%,-50%);
    border-radius: 3px;
}
.m-bg-per>.m-btn-shortcut>a:nth-of-type(1) {
    margin-left: 0;
}

.m-music-edit {
    animation: palying 5s linear paused infinite;
    -webkit-animation: palying 5s linear paused infinite;
}

@keyframes palying {
    0% {
        transform: rotateZ(0);
    }
    100% {
        transform: rotateZ(360deg);
    }
}

@-webkit-keyframes palying {
    0% {
        -webkit-transform: rotateZ(0);
    }
    100% {
        -webkit-transform: rotateZ(360deg);
    }
}

.m-bg-per .m-message-view>i {
    top: 0;
    right: 0;
    width: .5rem;
    line-height: .5rem;
}

.m-info-per {
    z-index: 1;
}

.m-info-per .m-head {
    width: 4.9rem;
    height: 4.9rem;
    border: .125rem solid #ffffff;
    top: -3.25rem;
    left: calc((100% - 4.9rem)/2);
    left: -webkit-calc((100% - 4.9rem)/2);
    box-shadow: 0 0 .83rem #d1cfce;
    background: #fff;
}

.m-info-per .m-head img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.m-phone {
    padding: 0 1.75rem;
}

.m-phone>a {
    width: 1.9rem;
    height: 1.9rem;
    line-height: 1.9rem;
    border: 1px solid #fc6719;
    position: relative;
}

.m-phone>a>img {
    width: 100%;
}

.m-name-per {
    padding: .2rem 0 .58rem;
}

.m-name-per h1 {
    margin-bottom: .2rem;
}

.m-circular {
    width: 62.5rem;
    height: 62.5rem;
    top: 7.65rem;
    left: calc((100% - 62.5rem)/2);
    left: -webkit-calc((100% - 62.5rem)/2);
    z-index: 0;
}


/* NOTE: 名片资料展示 */

.m-profile {
    padding: 0 .4rem;
}

.m-profile>ul>li {
    padding-top: .2rem;
}

.m-profile>ul>li i {
    width: .8rem;
    line-height: 1.6rem;
}

.m-profile>ul>li>p {
    width: calc((100% - 1.25rem)/1);
    width: -webkit-calc((100% - 1.25rem)/1);
    border-bottom: 1px solid #e7e7e7;
    margin-left: .4rem;
}

.m-profile>ul>li:last-of-type>p {
    border-bottom: none;
}

.m-profile>ul>li>p span {
    padding: .4rem 0;
    line-height: .8rem;
    min-height: 1.6rem;
}

.m-profile>ul>li>p a {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.m-scanning a{
    line-height: 1.88rem;
    border: 1px solid #fc6719;
}
.m-scanning .f-scanning{
    width: 1.88rem;
    height: 1.88rem;
    vertical-align: top;
    margin-right: .4rem;
    background: url(../../img/icon/scanning.png) center center/60% no-repeat;
    display: inline-block;
}


/* NOTE: 文章 */

.m-section-title {
    /*height: 1.66rem;*/
}

.m-section-title i, .m-section>i {
    width: 1.66rem;
    height: 1.66rem;
    line-height: 1.66rem;
}

.m-section {
    width: 100%;
}

.m-section-title span {
    margin-left: 1.875rem;
    width: -webkit-calc(100% - 3.75rem);
    width: calc(100% - 3.75rem);
    padding: .4rem 0;
    min-height: 1.66rem;
    line-height: .86rem;
    -webkit-user-select:text
}

.m-section-title .m-section-dele {
}

.m-section-title i:nth-of-type(1) {
    transform: rotateZ(90deg);
}

.m-section-content {
    padding: .4rem;
    line-height: 1.5;
    min-height: 2.6rem;
    border: none;
}

.m-section-content iframe {
    width: 100% !important;
}

.m-section-content ul, .m-section-content ul li {
    list-style-type: disc;
}

.m-section-content ul {
    padding-left: .4rem;
    margin-left: .2rem;
}

.wangEditor-mobile-txt {
    -webkit-touch-callout: none;
    -webkit-user-select: auto;
}

.wangEditor-mobile-txt a, .m-section-content a {
    text-decoration: underline;
}

.wangEditor-mobile-txt ul, .wangEditor-mobile-txt ul li {
    list-style-type: disc;
}

.m-section-content img, .wangEditor-mobile-txt img {
    max-width: 100%;
   /* margin: .4rem 0;*/
}

.m-section-add>a {
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    margin-bottom: 5px;
}

.m-section-add {
    width: 2.5rem;
    bottom: .83rem;
    margin-left: calc((100% - 2rem)/2);
    margin-left: -webkit-calc((100% - 2rem)/2);
    padding: .4rem 0;
}


/* NOTE: 推广 */

.m-popularize {
    border-radius: 10px 10px 0 0;
    padding-bottom: 4rem;
}

.m-popularize .m-popularize-list1 {
    padding: 0.5rem .9rem;
}

.m-popularize .m-popularize-list1 .f-tac {
    width: 33.333%;
    height: 5.1rem;
}

.m-popularize .m-popularize-list1 .item {
    width: 3rem;
    margin: 0 auto;
}

.m-popularize .m-popularize-list1 .item a {
    width: 100%;
    height: 3rem;
    line-height: 3rem;
    margin-bottom: .4rem;
    border: 1px solid #fc6719;
}
.m-popularize .m-popularize-list1 .item span{
    line-height: 1.5em;
}
.m-popularize-edit {
    bottom: .83px;
    width: 100%;
}

.m-popularize-add, .m-popularize-dele {
    width: 2.29rem;
    margin: 0 .83rem;
}

.m-popularize-add>a, .m-popularize-dele>a {
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    margin-bottom: 5px;
}


/* NOTE: map */

.m-map {
    margin: 0 12px;
}

#allmap {
    height: 8.33rem;
}

.m-navigation {
    top: .2rem;
    left: .2rem;
    line-height: 1.25rem;
    width: 2.5rem;
    border-radius: 5px;
    border: 1px solid #fc6719;
    background: rgba(255, 255, 255, 0.8);
    z-index: 1;
}


/* NOTE: footer */

.m-footer {
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 3;
}

.m-footer-content {
    border-top: 1px solid #7d7f7d;
}

.m-user-register {
    width: 150px;
    height: 150px;
    border: 3px solid #7d7f7d;
    right: 27px;
    top: -55px;
}

.m-user-register>var {
    width: 152px;
    height: 95px;
    top: 52px;
    left: -4px;
}

.m-user-register>span {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    border: 6px solid #ffffff;
    padding: 6px;
    background: -webkit-linear-gradient(top, rgba(117, 118, 119, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: linear-gradient(to bottom, rgba(117, 118, 119, 1) 0%, rgba(232, 232, 232, 1) 100%);
}

.m-user-register>span>a {
    width: 100%;
    height: 100%;
}

.m-user-register>span>a i {
    margin: 10px 0 5px;
}

.m-user-register>span>a strong {
    display: block;
    font-weight: normal;
}


/* NOTE: menu */

.m-menu-content {
    width: 80%;
    height: 2.3rem;
}

.m-menu-list {
    width: 3rem;
    height: 2.3rem;
}

.m-menu-list>div>a {
    padding: .3rem 0;
}

.m-menu-list>div>a>strong {
    font-weight: normal;
    line-height: 1.5em;
    white-space: nowrap;
    overflow: hidden;
}

.m-menu-edit {
    padding: .83rem 0 .4rem;
}

.m-menu-edit a {
    width: 1.25rem;
}

.m-menu-edit a i {
    width: 100%;
    height: 1.25rem;
    line-height: 1.25rem;
    margin-bottom: .2rem;
}

.m-menu-edit>div {
    margin: 0 .83rem;
}

.m-dele .dropzone {
    -webkit-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.dropzone.active {
    opacity: 1;
    pointer-events: none;
}

.m-mask-dele {
    width: 1.3rem;
    height: 2.1rem;
    top: 2.2rem;
    left: calc(100%/2);
    left: -webkit-calc(100%/2);
}

.m-mask-dele2 {
    width: 2.29rem;
    height: 3rem;
    top: .95rem;
    left: calc(100%/2 + .83rem);
    left: -webkit-calc(100%/2 + .83rem);
}


/* NOTE: 编辑状态时  控件添加active */

.active2 {
    border: 1px dashed #33cccc;
}


/* NOTE: 弹出框- */

.layui-layer {
    background: none;
}

.m-mask {
    width: 12rem;
    padding: .4rem;
}

.m-mask .content textarea {
    border: 1px solid #666;
    height: 3.33rem;
    resize: none;
    padding: .4rem;
    margin: .4rem 0;
}

.m-mask .content input, .m-mask .content>.add-mess p {
    height: 1.66rem;
    width: 100%;
    border: 1px solid #666;
    text-indent: 1em;
}

.m-mask .content>.add-mess p label {
    line-height: 1.66rem;
}

.m-mask .content .btn-group a {
    height: 1.6rem;
    line-height: 1.6rem;
    width: 5.6rem;
}

.m-mask .content .btn-group a:first-child {
    border: 1px solid #fc6719;
}

.nav-list {
    width: 100%;
    max-height: 6.29rem;
    left: 0;
    top: 1.6875rem;
    background: #FFF;
    border: 1px solid #666;
    overflow-y: auto;
    border-radius: 0 0 10px 10px;
    z-index: 1;
}

.nav-list li {
    line-height: 1.25rem;
    width: 100%;
    border-bottom: 1px solid #999;
    padding-left: .4rem;
}

.nav-list li:last-child {
    border-bottom: none;
}

.m-icon-select {
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    margin: .4rem auto .2rem;
}

.m-mask-icon {
    width: 12rem;
    height: 16.58rem;
    border: .38rem solid #fff;
}

.m-mask-icon .m-icon-content {
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

.m-mask-icon i {
    color: #464646;
    width: 2.25rem;
    height: 2.25rem;
    text-align: center;
    line-height: 2.25rem;
    border: 1px solid #eee;
}

.m-mask-icon i:hover {
    background-color: #464646;
    color: #fff;
}


/* NOTE: 编辑器 */

.m-textarea-container {
    width: 100%;
    background-color: #fff;
    border-radius: 0 0 20px 20px;
}

.m-textarea {
    width: 100%;
    height: calc(100% - 100px);
    height: -webkit-calc(100% - 100px);
}

.wangEditor-mobile-txt {
    min-height: 244px;
    overflow-y: auto;
    padding-bottom: 40px;
}


/* NOTE: 插入图片/视频*/

.m-file {
    /*width: 7.29rem;*/
    height: 1.66rem;
    padding-left: .5rem;
    top: 0;
    right: 0;
    border-radius: 50px 0 0 50px;
    margin-top: 2rem;
}

.m-file>div {
    height: 100%;
}

.m-itp-title {
    height: 80px;
    width: 400px;
}

.m-file a {
    width: 2rem;
    height: 100%;
    line-height: 1.66rem;
    border-bottom: none;
}


/* NOTE: 音乐 */

.musicmask .content h3.musictitle {
    text-align: center;
    color: #ff671b;
}

.musicmask .content .btn-group {
    height: 72px;
    width: 100%;
    margin-top: 10px;
}

.musicmask .content .btn-group .btn {
    display: block;
    height: 72px;
    line-height: 72px;
    width: 235px;
    border: 1px solid #ff671b;
    text-align: center;
    margin-top: 20px;
}

.musicmask .content .btn-group .btn:first-child {
    float: left;
    color: #ff671b;
}

.musicmask .content .btn-group .btn:last-child {
    float: right;
    background: #ff671b;
    color: #ffffff;
}


/*switch btn start*/

.music-switch {
    line-height: 1.45rem;
    width: 100%;
    background: #ffffff;
    padding: 0 .3rem;
    margin-top: .4rem;
}

.music-switch span {
    height: 1.45rem;
    line-height: 1.45rem;
}

.music-switch .checkbox {
    float: right;
    position: relative;
    display: inline-block;
    height: 1.16rem;
    width: 2.5rem;
}

.music-switch .checkbox label {
    width: 100%;
    height: 100%;
    position: relative;
    display: inline-block;
    border-radius: 46px;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    background: #efefef;
    box-shadow: 0 0 1px 2px rgba(0, 0, 0, 0.15);
    padding: 0;
}

.music-switch .checkbox label:after {
    content: '';
    position: absolute;
    width: 1.16rem;
    height: 1.16rem;
    border-radius: 100%;
    left: 0;
    z-index: 2;
    background: #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-transition: 0.2s;
    transition: 0.2s;
    top: 0;
}

.music-switch .checkbox input {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    opacity: 0;
    cursor: pointer;
    outline: none;
    box-shadow: none;
    margin: 0;
    border: 0;
}

.music-switch .checkbox input:checked+label {
    background: #4BD865;
}

.music-switch .checkbox input:checked+label:after {
    left: 52%;
}


/*switch btn end*/

.menu {
    display: none;
}

.menu.on {
    display: block;
}

.music_box {
    background: #fff;
}

.music_box .music-tab {
    display: block;
    padding: .4rem;
}

.music_box .music-tab li {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #ccc;
    vertical-align: top;
}

.music_box .music-tab li.tab_on {
    background: #ff671b;
    line-height: 2rem;
}

.music_box .music-tab li.audition {
    width: calc(100% - 2.9rem);
    width: -webkit-calc(100% - 2.9rem);
    height: 2rem;
    margin-left: .2rem;
    border: none;
    position: relative;
    overflow: hidden;
    word-break: keep-all;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
}

.music_box .music-tab li.audition p {
    color: #999;
    font-weight: bold;
    margin-bottom: .2rem;
}

.music_box .music-tab li.audition span {
    font-size: .58rem;
    line-height: 1.2;
}

.music_box .music-tab li.audition .m-play-music {
    width: 2rem;
    height: 2rem;
    position: absolute;
    right: -.4rem;
    top: 0;
    line-height: 2rem;
}

.music-list {
    height: 8.33rem;
    overflow: auto;
}

.music-list li {
    height: 1.66rem;
    line-height: 1.66rem;
    width: 100%;
    overflow: hidden;
    word-break: keep-all;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.music-list li p {
    float: right;
    width: calc(100% - .6em);
    width: -webkit-calc(100% - 1.25em);
    height: 1.66rem;
    border-top: 1px solid #cccccc;
}

.music-list li:nth-of-type(1) p{
    border-top: none;
}


/* NOTE: 编辑按钮 */

.m-edit {
    position: fixed;
    z-index: 3;
    right: -1.77rem;
    width: 3.54rem;
    height: 3.54rem;
    bottom: 6.25rem;
    background: url(../../img/icon/edit1.svg) center/100% 100% no-repeat;
    font-family: "Microsoft YaHei UI", sans-serif;
    color: #fff;
    opacity: .6;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

.m-edit.action {
    transform: translateX(-2.29rem);
    -webkit-transform: translateX(-2.29rem);
    opacity: 1;
}

.m-edit.action::before, .m-edit::before {
    position: absolute;
    margin: 0 auto;
    bottom: .52rem;
    left: 1.375rem;
    font-size: .58rem;
    text-align: center;
    color: #fff;
}

.m-edit.true::before {
    /*content: "编辑";*/
}

.m-edit.false::before {
    /*content: "保存";*/
    /*content: "SAVE";*/
    /*content: "保";*/
}
/* 24.10.10 因以上中文字偶尔乱码，将其挪到index.html正文中观察出错情况 */

.m-edit.false {
    background-image: url(../../img/icon/edit2.svg);
}


/*NOTE  qrcode*/

.qrcore-group li {
    width: 100%;
    height: 11.25rem;
    padding: .4rem;
}

.qrcore-group li img {
    width: 100%;
    height: 100%;
}

.tab.btn-group {
    padding: 0.4rem;
}

.tab.btn-group .btn {
    height: 1.25rem;
    line-height: 1.25rem;
    width: 100%;
    margin: .4rem 0;
}

.tab.btn-group .btn.active {
    background-color: #fff;
    border: 1px solid #fc6719;
    color: #fc6719;
}

.m-prompt {
    margin: .8rem 0 1.6rem;
}

#real_name_uploadfile {
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
}


/* login */

.m-login {
    width: 2.5rem;
    height: 1.25rem;
   /* top: -1.77rem;*/
    right: .75rem;
    z-index: 998;
}

.m-login p {
    line-height: 1.25rem;
    width: 2.5rem;
    border-radius: 5px;
    border: 1px solid #fc6719;

    box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#FF9237), to(#fc6719));
    background-image: -moz-linear-gradient(#FF9237, #fc6719);
    animation: ease-in-out breath 1500ms infinite alternate;
    -webkit-animation: ease-in-out breath 1500ms infinite alternate;
    cursor: pointer;
}

/*注册呼吸灯*/
@keyframes breath {
    0% {
        opacity: .2;
        box-shadow: 0 1px 2px rgba(255, 255, 255, 0.1);
    }
    100% {
        opacity: 1;
        border: 1px solid rgba(255, 145, 55, 1);
        box-shadow: 0 1px 10px rgba(255, 145, 55, 1);
    }
}

@-webkit-keyframes breath {
    0% {
        opacity: .2;
        box-shadow: 0 1px 2px rgba(255, 255, 255, 0.1);
    }
    100% {
        opacity: 1;
        border: 1px solid rgba(255, 145, 55, 1);
        box-shadow: 0 1px 10px rgba(255, 145, 55, 1);
    }
}

/*名片复制*/

.mask-card-copy .m-prompt {
    margin-bottom: .83rem;
}

.mask-card-copy .content input {
    text-indent: 0;
    vertical-align: middle;
}

.mask-card-copy ul li label {
    line-height: 1.66rem;
    padding-left: 2.29rem;
}

.mask-card-copy ul li label i {
    width: .83rem;
}

.mask-card-copy p {
    padding-left: 2.29rem;
    color: red;
    margin: .4rem 0 .625rem;
    font-size: .4rem;
}

.m-mask.mask-card-copy .btn-group a {
    width: 6.875rem;
    margin: .4rem 0;
}


/* 复制应用按钮 */

.footer_btn {
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 3;
}

.footer_btn>a {
    font-size: .29rem;
    width: 50%;
    height: 2rem;
    line-height: 2rem;
    text-align: center;
    display: block;
    font-size: .625rem;
}

.footer_btn>a:nth-child(1) {
    color: black;
    background-color: #fff;
    float: left;
}

.footer_btn>a:nth-child(2) {
    color: #fff;
    background-color: #fc6719;
    float: right;
}


/* 商城 */

.m-mall-tiitle {
    height: 1.66rem;
    line-height: 1.66rem;
    border-radius: 10px 10px 0 0;
}

.m-mall-tiitle i {
    width: 1.66rem;
    height: 1.66rem;
    line-height: 1.66rem;
    top: 0;
    right: 0;
}
.m-mall-tiitle span{
    width: 1.9rem;
    height: 1rem;
    top: .33rem;
    left: .41rem;
    border-radius: .5rem;
    transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    padding: .05rem;
}
.m-mall-tiitle span strong{
    width: .9rem;
    height: .9rem;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
}
.m-mall-tiitle span.action{
    background-color: #a31e03;
}
.m-mall-tiitle span.action strong{
    background-color: #fff;
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
}
.m-goods-list ul {
    padding: .4rem .4rem 0;
}

.m-goods-list ul li {
    width: calc((100% - .4rem)/2);
    width: -webkit-calc((100% - .4rem)/2);
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
    margin: 0 .4rem .4rem 0;
}

.m-goods-list ul li:nth-of-type(2n) {
    margin-right: 0;
}

.m-goods-list ul li a {
    height: 7rem;
}

.m-goods-list ul li a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.m-goods-list ul li p{
    width: 100%;
    background: rgba(255,255,255,1);
    padding-bottom: .58rem;
    line-height: 1.2em;
    padding: .2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.m-goods-list ul li p .m-goods-price{
    line-height: normal;
    text-align: right;
    line-height: 1.5em;
}
.m-shop {
    padding: .4rem;
}

.m-shop a {
    line-height: 1.83rem;
    border: 1px solid #fc6719;
}

.m-shop a i {
    width: 1.83rem;
    height: 1.83rem;
    vertical-align: top;
    margin-right: .4rem;
}

.m-shop p:first-of-type i {
    background: url(../../img/icon/shop.png) center center/60% no-repeat;
}

.m-shop p:nth-of-type(2) i {
    background: url(../../img/icon/non_shop.png) center center/60% no-repeat;
}

.mask-goods-list{
    height: 18rem;
    overflow-y: auto;
}
.mask-goods-list ul li{
    padding: .4rem 0;
    border-top: 1px solid #999;
}
.mask-goods-list ul li:first-of-type{
    border: none;
}
.mask-goods-list ul li i{
    line-height: 2rem;
    width: 1rem;
}
.mask-goods-list ul li i.action{
    color: #fc6719;
}
.mask-goods-list ul li div{
    width: 2rem;
    height: 2rem;
}
.mask-goods-list ul li img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.mask-goods-list ul li p{
    width: 8.125rem;
    padding-left: .4rem;
    line-height: 1rem;
}
.mask-goods-list ul li p span{
    color: red;
}
.mask-goods-btn a{
    height: 1.66rem;
    line-height: 1.66rem;
}
.mask-goods-btn a:first-of-type{
    width: 40%;
    border: 1px solid #fc6719;
}
.mask-goods-btn a:nth-of-type(2){
    width: 60%;
}
.opacity{
    -webkit-animation: opacity 0.3s linear;
    animation: opacity 0.3s linear;
}
@-webkit-keyframes opacity {
    0% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
@keyframes opacity {
    0% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}
/*音乐搜索*/

.search_box {
    margin: .2rem;
    border: 1px solid #ccc;
    border-radius: 5px;
    position: relative;
    clear: both;
}

.search_box input {
    margin: 0;
    box-shadow: none;
    width: 78%;
    height: 1.125rem;
    border: 0;
    outline: 0;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.search_box button {
    width: 22%;
    height: 100%;
    background: #fc6719;
    color: #fff;
    border: 0;
    position: absolute;
    top: -1px;
    right: -1px;
    outline: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: .58rem;
}

.m-loading{
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
    padding-top: 150px;
    font-size: 16px;
    background: url(../../dist/js/layer/skin/default/loading-0.gif) center center/40px no-repeat;
}

/*裁剪*/
.docs-header {
  margin-bottom: 0;
}

.navbar-toggle:hover,
.navbar-toggle:focus {
  border-color: #0074d9;
}

.navbar-toggle .icon-bar {
  background-color: #0074d9;
}

.docs-jumbotron {
  background-color: #0074d9;
  color: #fff;
}

.docs-jumbotron .version {
  color: #fff;
  opacity: 0.5;
}

.img-container,
.img-preview {
  background-color: #f7f7f7;
  width: 100%;
  text-align: center;
}

.img-container {
  height: 8rem;
  margin: .4rem 0;
}

.img-container > img {
  max-width: 100%;
  max-height: 100%;
}

.docs-preview {
  margin-right: -15px;
}

.img-preview {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
  overflow: hidden;
}

.img-preview > img {
  max-width: 100%;
}

.preview-lg {
  width: 263px;
  height: 148px;
}

.preview-md {
  width: 139px;
  height: 78px;
}

.preview-sm {
  width: 69px;
  height: 39px;
}

.preview-xs {
  width: 35px;
  height: 20px;
  margin-right: 0;
}

.docs-data > .input-group {
  margin-bottom: 10px;
}

.docs-data > .input-group > label {
  min-width: 80px;
}

.docs-data > .input-group > span {
  min-width: 50px;
}

.docs-buttons > .btn,
.docs-buttons > .btn-group,
.docs-buttons > .form-control {
  margin-right: .92rem;
  margin-bottom: .2rem;
}

.docs-toggles > .btn,
.docs-toggles > .btn-group,
.docs-toggles > .dropdown {
  margin-bottom: 10px;
}

.docs-buttons.f-clear .btn-group:last-child{
    margin-right: 0

}
.docs-buttons.f-clear .btn-group:last-child .btn{
    width: 1.9rem;
    height: 1.5rem;
}

.docs-buttons.f-clear .btn-group .btn{
    border: 0;
}
.docs-tooltip {
  display: block;
  margin: -6px -12px;
  padding: 6px 12px;
}

.docs-tooltip > .icon {
  margin: 0 -3px;
  vertical-align: top;
}

.tooltip-inner {
  white-space: normal;
}
.btn-upload{
    height: 1.66rem;
    line-height: 1.66rem;
    width: 4rem;
    border-radius: 5px;
}
.btn-upload .tooltip-inner {
  white-space: nowrap;
}
.docs-buttons button span{
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
}
.modal-footer{
    text-align: right;
    padding: .2rem 0;
}
.modal-footer a{
    padding: 0 1rem;
    line-height:  1.2rem;
    border: 1px solid #fc6719;
}

.modal-footer .btn-primary{
    margin-left: 1rem;
}
.mask-cut{
    width: 15rem;
}

@media only screen and (min-width: 1025px) {
    body{
        width: 320px;
        margin: 0 auto;
    }
    .m-footer{
        width: 320px;
    }
}
/*@media (max-width: 320px ) {*/
    /*body{*/
        /*font-size: 20px;*/
    /*}*/
/*}*/

/*注册领红包*/
.red-bag {
    width: 4.7rem;
    height: 3.25rem;
   /* top: -3.77rem;*/
    right: .75rem;
   z-index: 998;
}
.red-bag .i-red-bag{
    height: 2.2rem;
    width: 4.5rem;
    display: inline-block;
    background: url(../../img/icon/i-red-bag.svg) center center/2rem no-repeat;

    -webkit-animation: grow .75s linear infinite;
    -moz-animation: grow .75s linear infinite;
    -ms-animation: grow .75s linear infinite;
    -o-animation: grow .75s linear infinite;
    animation: grow .75s linear infinite;

    /*animation:grow 0.7s 0.4s 1 ease, music-move 1s 3.3s infinite alternate ease-in-out;*/
    /*-webkit-animation:grow 0.7s 0.4s 1 ease, music-move 1s 3.3s infinite alternate ease-in-out;*/
}


/* 定义keyframe动画效果：嘚瑟 */
@keyframes grow{
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    33% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }
    66% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}


@-webkit-keyframes grow /* Safari and Chrome */
{
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    33% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }
    66% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}


/*.m-login p {*/
    /*line-height: 1.25rem;*/
    /*width: 2.5rem;*/
    /*border-radius: 5px;*/
    /*border: 1px solid #fc6719;*/

    /*box-shadow: 0 1px 2px rgba(0, 0, 0, .3);*/
    /*background-image: -webkit-gradient(linear, left top, left bottom, from(#FF9237), to(#fc6719));*/
    /*background-image: -moz-linear-gradient(#FF9237, #fc6719);*/
    /*animation: ease-in-out breath 2500ms infinite alternate;*/
    /*-webkit-animation: ease-in-out breath 2500ms infinite alternate;*/
    /*cursor: pointer;*/
/*}*/


.m-safe{
    position: absolute;
    z-index: 55;
    right: 0.3rem;
    top: 11.25rem;
    width: 4.9rem;
    height: 4.9rem;
    background: #ffffff url(../../img/pic/safe_shield.png) center/4.9rem no-repeat;

}

/*音乐选择tab*/
.music-tab-menu{ display: flex}
.music-tab-menu .title{ flex: 1}
.music-tab-menu .title.active{ color: #fc6719;}