/*
    使用方法
    <div class="brick_notice_a" id="notice">
        <div class="title">操作通知</div>
        <div class="content" id="notice_content">内容</div>
    </div>

    document.getElementById('notice').style.display = 'block';
    document.getElementById('notice_content').innerHTML = '打开页面失败';
    document.getElementById('notice').style.animation = 'brick_zoomin 1s ease-out forwards'
    setTimeout(() => {
        document.getElementById('notice').style.animation = 'brick_zoomout 1s ease-in forwards';
        document.getElementById('notice').style.animationDelay = '0s';
    }, 2000);
*/

.brick_notice_a{
    position: fixed ;
    top : 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width : auto;
    height : auto;
    /* 15 像素的水平和垂直偏移，15 像素的模糊半径，30% 的不透明度 */
    box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.5);
    background-color: #ffffff;
    /* 所有边框宽度为 2 像素，样式为实线，颜色为红色 */
    border: 1px solid #000000;
    border-radius: 10px;
    z-index : 999;
}
.brick_notice_a .title{
    background: linear-gradient(100.67deg, rgba(125, 165, 255, .95) .67%, #6978ff 64.63%);
    padding : 10px;
    background-color: #000000;
    text-indent:10px;
}
.brick_notice_a .title button{
    position: absolute;
    top : 3px;
    right : 12px;
    color : #000000;
    background-color: #ffffff;
    padding : 5px;
    cursor: pointer;
    border-radius: 8px;
} 
.brick_notice_a .content{
    padding : 10px;
    text-align : center;
}


.brick_zoomin {
    animation: brick_zoomin_not_moving 1s ease-out forwards;
}
.brick_zoomout {
    animation: brick_zoomout_not_moving 1s ease-out forwards;
}

/*菜单打开动画效果*/
@keyframes  brick_zoomin_not_moving {
    from {transform: translate(-50%, -50%) scale(0);opacity: 0;}
    to {transform: translate(-50%, -50%) scale(1);opacity: 1;}
}

/*菜单关闭动画效果*/
@keyframes brick_zoomout_not_moving {
    from {transform: translate(-50%, -50%) scale(1);opacity: 1;}
    to {transform: translate(-50%, -50%) scale(0);opacity: 0;}
}

/*菜单打开动画效果*/
@keyframes  brick_zoomin_moving {
    from {transform: translate(-50%, -50%) scale(0);opacity: 0;}
    to {transform: translate(-50%, -50%) scale(1);opacity: 1;}
}

/*菜单关闭动画效果*/
@keyframes brick_zoomout_moving {
    from {transform: translate(-50%, -50%) scale(1);opacity: 1;}
    to {transform: translate(-50%, -50%) scale(0);opacity: 0;}
}



/*
 *  公用样式部分
 */
.clear {
    clear: both;
}

footer .copyright{
    position: fixed;
    text-align : center;
    font-size : 9px;
    color : #c0c5cc;
    bottom : 0;
    left:50%;
    transform: translate(-50%, -50%);
}
.hidden_dialog{
    display: none;
}
.show_dialog{
    display: block;
}
.visibility_hidden{
    visibility: hidden;
}
.opacity_0{
    opacity: 0;
}