/* ----------公共样式--------- */

:root{
    /* 主色 */
    --color-Primary:#BD1A2D;       /*主色 */
    --color-Primary2:#A61F25;       /*主色 */
    --color-Primary3:#ffd600;       /*主色 */


    /* 辅助色 */
    --color-Success:#19be6b;       /*成功*/
    --color-Warning:#ff9900;       /*警告*/
    --color-Error:#ed4014;          /*错误*/


    /* 中性色 */
    --color-Title:#17233d;  /*标题 */
    --color-Content:#515a6e;  /*正文 */
    --color-Sub:#808695;  /*辅助正文或图标*/
    --color-Disabled:#c5c8ce; /*失效*/
    --color-Border:#dcdee2; /*边框*/
    --color-Background:#f5f5f5; /*背景*/
    
    /* 导航栏高度 */
    --header-height:80px;

}

/* pc模式网页宽度 */
.common_PC_width{
    max-width: 1400px;
    width: 96%;
    margin: auto;
}

/* 背景剧中铺满 */
.common_bc{
    background-repeat: no-repeat; 
    background-position:center center;
    background-size:cover;
}

/* flex剧中 */
.common_flex_center{
    display: flex;
    align-items: center;
    justify-content: center;
}

/* flex左右靠边 上下剧中 */
.common_flex_between_center{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* 浮动剧中 */
.common_abs_center{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}


/* 文本一行显示省略号 */
.commom_text_ellipsis_one{
    overflow: hidden;      	          
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 文本多余两行后显示省略号 */
.commom_text_ellipsis{
    overflow: hidden;      	          
    text-overflow: ellipsis;         
    display: -webkit-box;	       
    -webkit-line-clamp: 2;	        
    -webkit-box-orient: vertical;  
}


/* 黑色字体 */
.common_color_black{
    color: black;
}

/* 白色字体 */
.common_color_white{
    color: white;
}

/* 只在PC端显示 */
.device_PC{
    display: block;
}

/* 只在手机端显示 */
.device_Phone{
    display: none;
}


/*禁用按钮事件 */
button.loading,button.loading2,button.loading3,button.loading4{
    cursor:no-drop;
    pointer-events: none; 
    opacity: 0.7;
   
}

/* 按钮加载样式1 */
button.loading::after{
    content:'\e8ba';
    font-family: 'iconfont';
    margin-left: 10px;
    display: inline-block;

    animation: rotate1 1s linear infinite;
}

/* 按钮加载样式2 */
button.loading2::after{
    content:'\eaf4';
    font-family: 'iconfont';
    margin-left: 10px;
    display: inline-block;

    animation: rotate1 2s linear infinite;
}

/* 按钮加载样式3 */
button.loading3::after{
    content:'\e987';
    font-family: 'iconfont';
    margin-left: 10px;
    display: inline-block;

    animation: rotate1 1s linear infinite;
}

/* 按钮加载样式4 */
button.loading4::after{
    content:'\eaf6';
    font-family: 'iconfont';
    margin-left: 10px;
    display: inline-block;

    animation: rotate1 1s linear infinite;
}

/* 旋转动画 */
@keyframes rotate1{
    form{
        transform: rotate(0);
    }
    to{
        transform: rotate(360deg);
    }
}

@media screen and (max-width:700px) {
    .common_PC_width{
        width: 96%;
    }
    .device_PC{
        display: none;
    }
    .device_Phone{
        display: block;
    }
}