/* PC用css */

/* ボタンバリエーション */
button{
    margin:0.3rem 1rem;
    color:#ed551b;
    border:solid 2px #ed551b;
    background:white;
    box-shadow:
    0 1.9px 2.5px rgba(0, 0, 0, 0.057),
    0 5px 6.1px rgba(0, 0, 0, 0.076);
}

.pc_flex{
    display:flex;
}

#main_board{
    padding:1rem 2rem;
    position:relative;
}

.login_table{
    background-color:silver;
    position:fixed;
    padding:1em;
    width:auto;
    transform: translate(calc(50vw - 50%),calc(30vh - 50%));
    border:outset 0.3em gray;
}
.login_table td{
    border:none;
}

/* ボタンの表示用テーブル */
.menu_table button{
    width:8em;
    hight:2em;
}

/* インフォメーション */
.info_table{
    background-color: silver;
    position:fixed;
    padding:1em;
    width:auto;
    transform: translate(calc(50vw - 50%),calc(30vh - 50%));
    border:outset 0.3em gray;
}
.middle_info{
    background-color:white;
    position:fixed;
    padding:1rem;
    width:auto;
    transform: translate(calc(50vw - 50%),calc(40vh - 50%));
    border:outset 0.3em #f0f8ff;
    border-radius:0.5em;
    font-size:2rem;
}

.confirm_button{
    text-align:right;
    margin:1em;
}
/* トップメニュー */

#top_title{
    color:white;
    margin-left:1em;
    font:1.5em "M PLUS Rounded 1c";
}

#top_menu{
    background-color:#ed551b;
    width:100%;
    margin-top:0;
}
#main_menu{
    border:none;
}
#main_menu td{
    width:10em;
    height:2em;
}
#main_menu td:hover{
    background:orange;
}
#main_menu a,label{
    display:grid;
    place-items:center;
    width:100%;
    height:100%;
    color:white;
    font-family: 'Zen Antique Soft', serif;
    text-decoration:none;
}

/* top menuアコーディオン  */

#my_menu{
    flex-flow:column; 
    margin:0; 
    padding:0;
    position:absolute;
    z-index:30;
    display:none;
    list-style:none;
    animation:acordion_menu 2s;
}
#my_menu li{
    background-color:orange; 
    text-align:center; 
    width:10em;
    height:2.2rem;
    border-top:solid 0.2rem white;
}

#user_menu{
    display:none;
    width:3rem;
}


/* 見出し */
.heading{
    background:linear-gradient(
        transparent 50%,
        orange 60%,
        #ffd890 63%,
        darkorange);
    font:oblique 1.5rem "Sawarabi Gothic"; 
    margin-bottom:0;
    padding-bottom:0;
}

.subheading{
    background: linear-gradient(
        transparent 50%,
        skyblue 60%, 
        white 63%,
        #229aca);
    font:oblique 1.2rem "Sawarabi Gothic";

}

/* 開くアニメーション */ 
@keyframe acordion_menu{
    0%{
        height:0;
        border:solid 0 white;
        line-height: 0; 
    }
    100%{
        height:2.2rem;
        border:solid 0.2rem white;
        line-height: 1.5; 
    }
}

/* フッター */
footer{
    text-align:center;
    background-color:black;
    color:white;
    height:5rem;
    width:100vw;
    position: absolute;
    bottom: 0;
 
}

.all_list{
    width:15em;
    margin:0.2em 1em ;
    text-align:center;
}

/* 公演リスト */
.pl_table{
    margin:0 auto;
    width:100%;
    border-collapse: collapse;
    border:2px solid #ed551b;
}

.pl_table td:nth-child(1){
    width:calc(50% - 20em);
}
.pl_table td:nth-child(2){
    text-align:center;
    width:20em;
}


/* スケジュール表示 */
.schedule_board{
	filter:drop-shadow(1,1,1,black);
}

/* チケット情報 */

.ticket_div{
    text-align:center;
    border:double 4px red;
    margin:0 auto;
    padding:0 1em;
}
.accom{
    font-size:1.5em;
    font-weight:bold;
    margin:0;
}
.accom_count{
    font-size:2em;
    margin-top:0;
}
#reserve_detail{
    display:none;
}

.sa_count{
    font-size:2em;
}
.stage_detail{
    margin:1em auto;
    border-collapse:collapse;
    width:100%;
    border:solid 2px darkorange;
}

.stage_detail td{
    padding:3px;
    border:solid 2px darkorange;
    font-size:1.4rem;
    font-weight:bold;
}
.stage_detail th{
    padding:3px;
    border:solid 2px darkorange;
    background:cornsilk;
}

.stage_detail tr:nth-child(2){
    font-size:1.6rem;
    font-weight:bold;
}

.stage_detail td:nth-child(1){
    font-size:1rem;
    font-weight:400;
}

.customer_list{
    margin:1em auto;
    border-collapse:collapse;
    width:100%;
    border:solid 2px cadetblue;
}
.customer_list th{
    padding:3px;
    border:solid 2px cadetblue;
    background:cornsilk;
}
.customer_list td{
    padding:3px;
    border:solid 2px cadetblue;

}
