@charset "utf-8";
#header .inner > div.card_detail{
    display:none;
    position:fixed;
    top:0;
    right:0;
    z-index:9998;
    background-color:#FFFFFF;
    height:100vh;
    padding-top:80px;
    border-left:1px solid #CCCCCC;
    width:350px;
}
.card_detail .user_info{
    display:flex;
    flex-wrap:nowrap;
    border-bottom:1px solid #999999;
    padding:0 20px;
    justify-content: space-between;
}
.card_detail .user_desc{
    padding-right:20px;
}
.card_detail .user_info .user_photo i{
    font-size: 84px;
    background: #005ca2;
    border-radius: 50%;
    color: #FFFFFF;
    opacity:1;
}
.card_detail .user_info .user_photo .photo-thumbnail{
    width:84px;
    height:84px;
    background-size: cover;
    border-radius: 50%;
    background-position: center;
    margin:0 auto;
}
.card_detail .user_info .user_photo .photo{
    text-align:center;
    padding-top:15px;
}
.card_detail .user_info .qrcode img{
    width:100px;
}
.card_detail .user_info .user_desc p,
.card_detail .user_info2 p{
    text-align:left;
    font-size:16px;
    line-height:1.2em !important;
    padding-top:15px;
}
.card_detail .user_info p.user_name
{
    font-size:18px;
    line-height:1em !important;
    padding-top:15px;
}
.card_detail .user_info p.user_name_kana{
    font-size:13px;
    color:#999999;
    padding-top:3px;
}
.card_detail .user_info p span,
.card_detail .user_info2 p span{
    font-size:13px;
    line-height:1em !important;
    display:block;
    padding-bottom:3px;
}
.card_detail .user_info2{
    padding:0 20px;
}
.card_detail .user_info2 p.organization{
    line-height:1.5em !important;
}
.card_detail .edit_info{
    margin:20px 0;
    text-align:left;
    border-top:1px solid #999999;
}
.card_detail .edit_info a{
    font-size:16px;
    line-height:1em;
    display:block;
    border-bottom:1px solid #999999;
    padding:10px 20px;
    text-decoration:none;
    color:#202124;
    position:relative;
}
.card_detail .edit_info a:after{
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    width: 7px;
    height: 7px;
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    transform: rotate(45deg);
    margin-top: -5px;
}
.card_detail .btns{
    text-align:center;
}
.card_detail .btns #logout{
    background-color:#f3b028;
}
.card_detail_close{
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 9999;
    padding: 10px;
    cursor: pointer;
}
/* 会費納入状況 */
.card_detail div.charges_running_recently {
    font-size: 13px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.card_detail div.charges_running_recently .item {
    text-align: left;
}
.card_detail div.charges_running_recently .item.c_status {
    min-width: 3rem;
    font-size: 12px;
}

@media screen and (max-width: 767px){
	/*SP*/
    #header .inner > div.card_detail{
        position:absolute;
        width:100vw;
        padding-top:0;
        margin-top:50px;
        z-index:8000;
        border:none;
    }
    .card_detail_close{
        position:fixed;
        top:0;
        right:0;
        width:50px;
        height:50px;
        background-color:#FFFFFF;
        opacity:1;
    }
}
@media screen and (max-width:960px) {
}