/* CSS Document */
@charset "utf-8";

/*==================================
    Main slider
==================================*/

#memberheader{
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
    #memberheader h2{
        margin-bottom: 20px;
        font-size: 2em;
        line-height: 100%;
        text-align: center;
    }
#memberContents{
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    display:-ms-flexbox;/*--- IE10 ---*/
    display:-webkit-flex;/*--- safari（PC）用 ---*/
    display:flex;
    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
    flex-wrap:wrap;
    -webkit-justify-content: space-between; /* Safari */
    justify-content:         space-between;
    flex-flow: row wrap-reverse;
}
    #memberContents .title_memberContents{
        padding: 20px 10px;
        box-sizing: border-box;
        margin-bottom: 10px;
        font-size: 1.5em;
        line-height: 100%;
        display: block;
        background-color: #333;
        color: #FFF;
        text-align: center;
    }
    #memberContents p{
        margin-bottom: 20px;
    }
    #memberContents > main{
        width: 100%;
    }
    #memberContents > aside{
        margin-bottom: 30px;
        width: 100%;
        background-color: #FFF;
    }
        #memberContents > aside > ul.menu01{
            
        }
            #memberContents > aside > ul.menu01 > li{
                
            }
                #memberContents > aside > ul.menu01 > li > ul{
                    
                }
                    #memberContents > aside > ul.menu01 > li > ul > li{
                        margin-left: 10px;
                    }
                        #memberContents > aside > ul.menu01 > li > ul > li > a{
                            padding: 10px 10px 10px 25px;
                            background-image: url(../../../common/img/icon_black_kakko02.svg);
                            background-size: 5px;
                            background-repeat: no-repeat;
                            background-position: 10px 50%;
                            display: block;
                        }
                #memberContents > aside > ul.menu01 > li > a{
                    padding: 10px 10px 10px 25px;
                    box-sizing: border-box;
                    display: block;
                    border-bottom: 1px solid #DDD;
                    background-color: #EEE;
                            background-image: url(../../../common/img/icon_black_kakko02.svg);
                            background-size: 5px;
                            background-repeat: no-repeat;
                            background-position: 10px 50%;
                }
                
.memberTbl01{
    width: 100%;
}
    .memberTbl01 th,
    .memberTbl01 td{
        box-sizing: border-box;
        padding: 10px;
        border-collapse: collapse;
        border: 1px solid #AAA;
    }
    .memberTbl01 th{
        background-color: #EEE;
    }
    .memberTbl01 td{
        background-color: #FFF;
        vertical-align: top;
    }
        .memberTbl01 td a{
            text-decoration: underline;
        }
        .memberTbl01 td input{
            padding: 5px;
            box-sizing: border-box;
            background-color: #FFF;
            border: 1px solid #EEE;
            font-size: 14px;
        }
        .memberTbl01 td img{
            display: block;
            width: 100px;
        }
        
.freeword_search_dl{
    display:-ms-flexbox;/*--- IE10 ---*/
    display:-webkit-flex;/*--- safari（PC）用 ---*/
    display:flex;
    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
    flex-wrap:wrap;
    -webkit-justify-content: space-between; /* Safari */
    justify-content:         space-between;
}
    .freeword_search_dl dt{
        width: 20%;
    }
    .freeword_search_dl dd{
        width: 80%;
        display:-ms-flexbox;/*--- IE10 ---*/
        display:-webkit-flex;/*--- safari（PC）用 ---*/
        display:flex;
        -ms-flex-wrap:wrap;/*--- IE10用 ---*/
        -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
        flex-wrap:wrap;
        -webkit-justify-content: space-between; /* Safari */
        justify-content:         space-between;
    }
        .freeword_search_dl dd input{
            padding: 5px;
            box-sizing: border-box;
            display: block;
        }
        .freeword_search_dl dd input.input_text{
            width: 68%;
        }
        .freeword_search_dl dd input.input_btn{
            width: 30%;
            border: none;
        }

.memberMailTbl01{
    width: 100%;
}
    .memberMailTbl01 th,
    .memberMailTbl01 td{
        box-sizing: border-box;
        padding: 10px;
        border-collapse: collapse;
        border: 1px solid #AAA;
    }
    .memberMailTbl01 th{
        background-color: #EEE;
        width: 20%;
        vertical-align: top;
    }
    .memberMailTbl01 td{
        background-color: #FFF;
    }
        .memberMailTbl01 td a{
            text-decoration: underline;
        }
        .memberMailTbl01 td input.textBox{
            width: 100%;
            padding: 5px;
            box-sizing: border-box;
            background-color: #FFF;
            border: 1px solid #EEE;
            font-size: 14px;
        }
        .memberMailTbl01 td input.btn01{
            padding: 5px;
            box-sizing: border-box;
            background-color: #DDD;
            font-size: 14px;
            display: inline-block;
        }
        .memberMailTbl01 td textarea.textArea{
            width: 100%;
            padding: 5px;
            box-sizing: border-box;
            background-color: #FFF;
            border: 1px solid #EEE;
            font-size: 14px;
            line-height: 140%;
        }
        
.memberBtn01{}
.memberBtn01 li{
    margin-bottom: 10px;
    width: 200px;
}
.memberBtn01 li a{
    padding: 10px;
    box-sizing: border-box;
    width: 100%;
    display: block;
    text-align: center;
    border-radius: 5px;
}

/* tableLinkBtn01 */

.tableLinkBtn01{}
    .tableLinkBtn01 li{
        margin-bottom: 5px;
    }
    .tableLinkBtn01 li:last-child{
        margin-bottom: 0px;
    }
        .tableLinkBtn01 li a{
            padding: 5px 10px;
            display: block;
            box-sizing: border-box;
            border-radius: 5px;
            font-size: 0.9em;
            text-align: center;
            line-height: 100%;
        }

        
/* 会員管理画面　blog コメント */
        
.member_blogComentList{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
    .member_blogComentList li{
        margin-bottom: 10px;
        padding: 10px 20px;
        background-color: #FFF;
    }
        .member_blogComentList li h4{
            margin-bottom: 10px;
            font-weight: bold;
            font-size: 1.1em;
        }
        .member_blogComentList li p{
            margin-bottom: 10px;
        }
        .member_blogComentList li a.btn_delete{
            display: inline-block;
            padding: 5px 15px;
            box-sizing: border-box;
            line-height: 100%;
            color: #FFF;
            border-radius: 5px;
        }

/* 会員管理画面　blog 一覧 */

.member_blogList{
    width: 96%;
    margin-left: auto;
    margin-right: auto;
}
    .member_blogList > li{
        margin-bottom: 10px;
        padding: 20px;
        background-color: #FFF;

    }

        .member_blogList li p{
            margin-bottom: 10px;
        }
        .member_blogList li a.btn_delete{
            display: inline-block;
            padding: 5px 15px;
            box-sizing: border-box;
            line-height: 100%;
            color: #FFF;
            border-radius: 5px;
        }
        .member_blogList li .thumbArea{     width: 100%; margin-bottom: 10px;}
        .member_blogList li .blogInfoArea{  width: 100%; margin-bottom: 10px;}
        .member_blogList li .blogOperation{ width: 100%;}
        
            .member_blogList li .thumbArea img{
                display: block;
                width: 100%;
                height: auto;
            }
        
            .member_blogList li .blogInfoArea > a{
                display: block;
                width: 100%;
                height: auto;
            }
            .member_blogList li .blogInfoArea > h4{
                display: block;
                margin-bottom: 10px;
            }
            .member_blogList li .blogInfoArea time{
                box-sizing: border-box;
                display: inline-block;
                height: auto;
                font-size: 1.2em;
                line-height: 120%;
            }
            .member_blogList li .blogInfoArea span{
                padding: 5px 10px;
                box-sizing: border-box;
                display: inline-block;
                height: auto;
                color: #FFF;
                line-height: 120%;
            }
            .member_blogList li .blogInfoArea span.open{
                background-color: #FFCC00;
            }
            .member_blogList li .blogInfoArea span.close{
                background-color: #DDD;
            }
            .member_blogList li .blogInfoArea .wrap{
                display:-ms-flexbox;/*--- IE10 ---*/
                display:-webkit-flex;/*--- safari（PC）用 ---*/
                display:flex;
                -ms-flex-wrap:wrap;/*--- IE10用 ---*/
                -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
                flex-wrap:wrap;
                -webkit-justify-content: flex-start; /* Safari */
                justify-content:         flex-start;
            }
                .member_blogList li .dl_coment_good{
                    margin-right: 20px;
                }
                    .member_blogList li .dl_coment_good{
                        margin-bottom: 5px;
                        display:-ms-flexbox;/*--- IE10 ---*/
                        display:-webkit-flex;/*--- safari（PC）用 ---*/
                        display:flex;
                        -ms-flex-wrap:wrap;/*--- IE10用 ---*/
                        -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
                        flex-wrap:wrap;
                        -webkit-justify-content: flex-start; /* Safari */
                        justify-content:         flex-start;
                    }
                        .member_blogList li .dl_coment_good dt,
                        .member_blogList li .dl_coment_good dd{
                            box-sizing: border-box;
                            line-height: 100%;
                        }
                        .member_blogList li .dl_coment_good dt{
                            margin-right: 5px;
                        }
                        .member_blogList li .dl_coment_good dd{
                            text-align: right;
                        }

            .member_blogList li .blogInfoArea{}
                .member_blogList li .blogInfoArea a{
                    margin-bottom: 10px;
                    line-height: 120%;
                    display: block;
                }

            .member_blogList li .blogOperation{}
                .member_blogList li .blogOperation ul{
                    display:-ms-flexbox;/*--- IE10 ---*/
                    display:-webkit-flex;/*--- safari（PC）用 ---*/
                    display:flex;
                    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
                    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
                    flex-wrap:wrap;
                    -webkit-justify-content: space-between; /* Safari */
                    justify-content:         space-between;
                }
                    .member_blogList li .blogOperation ul li{
                        width: 46%;
                    }
                        .member_blogList li .blogOperation ul li a{
                            display: block;
                            padding: 15px;
                            box-sizing: border-box;
                            line-height: 100%;
                            text-align: center;
                            border-radius: 5px;
                            font-size: 0.9em;
                        }
                        
/* 会員管理画面　VAPE 一覧 */
                        
.member_vapeList{
    width: 96%;
    margin-left: auto;
    margin-right: auto;
}
.member_vapeList li{
    margin-bottom: 20px;
}
        .member_vapeList li > table{}
            .member_vapeList li > table th,
            .member_vapeList li > table td{
                padding: 5px 10px;
            }
            .member_vapeList li > table th{
                width: 30%;
            }
            .member_vapeList li > table td{}
                .member_vapeList li > table td > img{
                    width: 100px;
                }
                .member_vapeList li > table td .tableLinkBtn01{
                    display:-ms-flexbox;/*--- IE10 ---*/
                    display:-webkit-flex;/*--- safari（PC）用 ---*/
                    display:flex;
                    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
                    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
                    flex-wrap:wrap;
                    -webkit-justify-content: flex-start; /* Safari */
                    justify-content:         flex-start;
                }
                .member_vapeList li > table td .tableLinkBtn01 li{
                    margin-right: 10px;
                }
                .member_vapeList li > table td .tableLinkBtn01 li a{
                    padding: 15px 20px;
                }
                
/* 会員管理画面　mycar 一覧 */

.member_mycarList{
    width: 96%;
    margin-left: auto;
    margin-right: auto;
}
    .member_mycarList > li{
        margin-bottom: 20px;
        display:-ms-flexbox;/*--- IE10 ---*/
        display:-webkit-flex;/*--- safari（PC）用 ---*/
        display:flex;
        -ms-flex-wrap:wrap;/*--- IE10用 ---*/
        -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
        flex-wrap:wrap;
        -webkit-justify-content: flex-start; /* Safari */
        justify-content:         flex-start;
    }
        .member_mycarList > li table{
            width: 100%;
            border: 1px solid #DDD;
        }
            .member_mycarList > li table th,
            .member_mycarList > li table td{
                border-collapse: collapse;
                padding: 10px;
                box-sizing: border-box;
                border: 1px solid #DDD;
                vertical-align: top;
            }
            .member_mycarList > li table th{
                background-color: #EEE;
            }
            .member_mycarList > li table td{
                background-color: #FFF;
            }
                .member_mycarList > li table td > img{
                    display: block;
                    width: 100px;
                    height: auto;
                }
    
                .member_mycarList li > table td .tableLinkBtn01{
                    display:-ms-flexbox;/*--- IE10 ---*/
                    display:-webkit-flex;/*--- safari（PC）用 ---*/
                    display:flex;
                    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
                    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
                    flex-wrap:wrap;
                    -webkit-justify-content: flex-start; /* Safari */
                    justify-content:         flex-start;
                }
                .member_mycarList li > table td .tableLinkBtn01 li{
                    margin-right: 10px;
                }
                .member_mycarList li > table td .tableLinkBtn01 li a{
                    padding: 15px 20px;
                }
                
/*==================================
    予約管理
==================================*/

/* reserve_tbl01 ***********/

.reserve_tbl01{
    margin-bottom: 20px;
    width: 100%;
}
    .reserve_tbl01 th,
    .reserve_tbl01 td{
        padding: 10px 20px;
        box-sizing: border-box;
        border-collapse: collapse;
        border: 1px solid #DDD;
    }
    .reserve_tbl01 th{
        background-color: #FAFAFA;
        color: #000;
        font-weight: bold;
        text-align: center;
    }
        .reserve_tbl01 th span.caution01{
            display: block;
            font-size: 0.8em;
            vertical-align: middle;
        }
    .reserve_tbl01 td{
        background-color: #FFFFFF;
    }
    
/* calendar ***********/
    
    .calendarBtn{
        margin: 20px 0;
        display:-ms-flexbox;/*--- IE10 ---*/
        display:-webkit-flex;/*--- safari（PC）用 ---*/
        display:flex;
        -ms-flex-wrap:wrap;/*--- IE10用 ---*/
        -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
        flex-wrap:wrap;
        -webkit-justify-content: space-between; /* Safari */
        justify-content:         space-between;
    }
    .calendarBtn li{}
    .calendarBtn li:nth-child(1),
    .calendarBtn li:nth-child(3){
        width: 25%;
    }
    .calendarBtn li:nth-child(2){
        width: 40%;
    }
    .calendarBtn li a,
    .calendarBtn li span{
        padding: 10px;
        font-size: 1.2em;
        text-align: center;
        display: block;
    }
    .calendarBtn li a{
        background-color: #AAA;
        color: #FFF;
        border-radius: 5px;
    }
    .calendarBtn li span{
        font-size: 2.5em;
    }


    .staff_calendar{
        width: 100%;
    }
    .staff_calendar th,
    .staff_calendar td{
        padding: 10px;
        box-sizing: border-box;
        border-collapse: collapse;
        border:1px solid #DDD;
    }
    .staff_calendar th{}
    .staff_calendar td{
        background-color: #FFF;
    }
        .staff_calendar td span{
            margin-bottom: 10px;
            display: block;
            font-size: 2em;
        }

    /* staff_calendar_List */

    ul.staff_calendar_List{
        margin-bottom: 5px;
    }
        ul.staff_calendar_List li{
            margin-bottom: 5px;
        }
            ul.staff_calendar_List li a{
                padding: 5px;
                box-sizing: border-box;
                display: block;
                background-color: #C30D23;
                color: #FFF;
                font-size: 0.8em;
                line-height: 120%;
                border-radius: 5px;
            }

    /* staff_calendar_states_List */

    ul.staff_calendar_states_List{}
        ul.staff_calendar_states_List li{
            margin-bottom: 5px;
        }
            ul.staff_calendar_states_List li a{
                padding: 5px;
                box-sizing: border-box;
                display: block;
                background-color: #EBB650;
                color: #FFF;
                font-size: 0.8em;
                line-height: 120%;
                border-radius: 5px;
            }
            
        /* スタッフカレンダー */
        
        .staff_calendarArea{
            margin-bottom: 30px;
            width: 100%;
            overflow: scroll;
        }
        
        .staff_calendarTbl{
            width: auto;
        }
        .staff_calendarTbl th,
        .staff_calendarTbl td{
            padding: 10px;
            box-sizing: border-box;
            border-collapse: collapse;
            border:1px solid #DDD;
        }
        .staff_calendarTbl th{
            background-color: #555;
            color: #FFF;
            text-align: center;
                
        }
        .staff_calendarTbl .koma{
            background-color: #00aced;
        }
        .staff_calendarTbl .timeTh{}
        .staff_calendarTbl .nameTh{
            /*background-color: #FFF;*/
            white-space: nowrap;
        }
        .staff_calendarTbl td{}
        .staff_calendarTbl td p.yoyaku{
            margin-bottom: 10px;
            font-size: 0.8em;
            line-height: 140%;
            white-space: nowrap;
        }
            .staff_calendarTbl td p.yoyaku a{
                text-decoration: underline;
            }
        
        /* ボタン */
        .controlList{
            margin-bottom: 5px;
            display:-ms-flexbox;/*--- IE10 ---*/
            display:-webkit-flex;/*--- safari（PC）用 ---*/
            display:flex;
            -ms-flex-wrap:wrap;/*--- IE10用 ---*/
            -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
            flex-wrap:wrap;
            -webkit-justify-content: flex-start; /* Safari */
            justify-content:         flex-start;
        }
            .controlList li{
                margin-bottom: 5px;
            }
            .controlList li a{
                padding: 5px;
                box-sizing: border-box;
                display: inline-block;
                background-color: #C30D23;
                color: #FFF;
                font-size: 0.8em;
                line-height: 100%;
                border-radius: 5px;
            }
            
            
        /* 予約を登録する　*/
       
        .staffEntryArea{
        }
        .staffEntryArea h3{
            margin-bottom: 20px;
            font-size: 1.5em;
            line-height: 100%;
            font-weight: bold;
        }
        .staff_entry_tbl{
            margin-bottom: 10px;
            width: 100%;
            background-color: #FFF;
        }
            .staff_entry_tbl th,
            .staff_entry_tbl td{
                padding: 10px 20px;
                box-sizing: border-box;
                border-collapse: collapse;
                border:1px solid #DDD;
            }
            .staff_entry_tbl th{
                background-color: #555;
                color: #FFF;
                text-align: left;
                vertical-align: top;
            }
            .staff_entry_tbl td{}
        .staff_entry_btn{
            padding: 10px 20px;
            box-sizing: border-box;
            background-color: #ebb650;
            font-size: 14px;
            display: inline-block;
            border: none;
            border-radius: 5px;
            border-bottom: 3px solid #cc9b3b;
            color: #FFF;
        }
        
        
/* スタッフ */        
.staffList01{
    display:-ms-flexbox;/*--- IE10 ---*/
    display:-webkit-flex;/*--- safari（PC）用 ---*/
    display:flex;
    -ms-flex-wrap:wrap;/*--- IE10用 ---*/
    -webkit-flex-wrap:wrap;/*--- safari（PC）用 ---*/
    flex-wrap:wrap;
    -webkit-justify-content: flex-start; /* Safari */
    justify-content:         flex-start;
}
    .staffList01 li{
        width: 24%;
        margin-right: 1%;
        margin-bottom: 10px;
    }
        .staffList01 li a{
            padding: 10px;
            box-sizing: border-box;
            display: block;
            width: 100%;
            background-color: #FFF;
            border-radius: 5px;
        }
            .staffList01 li a img{
                margin-bottom: 10px;
                display: block;
                width: 100%;
                object-fit: contain;
            }
.name,
.furi,
.yaku{
    display: block;
    line-height: 140%;
}
.name{
    font-size: 1em;
    font-weight: bold;
}
.furi{
    font-size: 0.7em;
}
.yaku{
    font-size: 1em;
}