@charset "utf-8"; 


.notiMask {position: fixed;width: 100%;height: 100%;top: 0;left: 0;background:transparent;display: none;z-index: 99}
.noti {}
.notiInner {display: none; position: absolute;
    top: 0px;
    right: 50%;
    margin-right: -542px;
    z-index: 100;
    padding: 2%;
    margin-top: 42px;
    float: right;
    width: 396px;
    background: #fff;
    box-shadow: 0 0 3px 1px rgba(0,0,0,0.1);
    height:450px; overflow-y: auto;
}
.noti h6 {
    font-size:  1em;
    font-weight:  600;
    padding: 0 0 7px 5px;
}
.noti ul {margin-bottom: 12px;
    width: 100%;
    float: left;
    border-top: 2px solid #333;
}
.noti li  {
    width: 98%;
    float:  left;
    border-bottom:  1px solid #ccc;
    padding: 10px 1%;
}
.noti li img {
    float:  left;
    margin-right: 5px;
}
.noti li span {
    font-size: 0.9em;
    color: #333;
    margin-left: 10px;
}
.noti li div span.f700 {}
.noti li p {
    float:  right;
    font-size:  0.83em;
}
.noti button {    display: block; transition: 0.2s;
    margin: 0 auto;
    background: #231f20;
    color: #fff;
    font-weight: 400;
    border-radius: 50px;
    padding: 10px 35px;}
.noti button:hover{ background: #000}