/*clearfix
#base div:after,#base ul:after{display:block; content:""; clear:both; visibility:hidden; height:0;}*/

#bingo .master-list table td .yes_btn::after,
#bingo .master-list table td .no_btn::after,
#bingo-edit .bingo-make .submit_btn::after,
#bingo-edit .bingo-cat input[type="text"]::after,
#bingo-edit .bingo-cat input[type="submit"]::after,
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-img::after,
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-pt::after,
.set-music::after,
.bingo-page ul.ul1 li ul.ul2 li::after,
#bingo-edit .bingo-cat:after,
#bingo-edit .bingo-search:after{display:block; content:""; clear:both; visibility:hidden; height:0;}

/*
================================================================================================================
テーマ変更
================================================================================================================
*/
#bingo span,
#bingo-edit span{color:#fff; background-color:#ff00c6; padding:5px 0;}

select.select_cleartype{width:100% !important; /*max-width:480px !important;*/}

.title-blue{color:#000; margin:20px auto 10px;}

#bingo-edit .bingo-cat:after,
#bingo-edit .bingo-search:after{display:block; content:""; clear:both; visibility:hidden; height:0;}

#bingo a,
#bingo-edit a{font-family:'Noto Sans JP', sans-serif;}

/*
================================================================================================================
師弟システム
================================================================================================================
*/
#bingo{}
#bingo table{width:100%; margin:20px auto;}
#bingo table th,
#bingo table td{text-align:center; border:1px solid #111;}
#bingo table th{color:#fff; background-color:#555; font-size:14px; text-align:center; font-weight:bold; padding:3px;}
#bingo table td{color:#000; background-color:#fff; font-size:13px;}

#bingo span,
#bingo-edit span{
display:block;
width:100%;
font-size:16px;
font-weight:bold;
text-align:center;
/*margin-top:50px;*/}

#bingo .master-list table th:first-child{width:25%;}
#bingo .master-list table th:nth-child(2){width:45%;}
#bingo .master-list table th:last-child{width:30%;}
#bingo .master-list table td:first-child a{display:block; color:#0066cc; padding:38px 0;}
#bingo .master-list table td:first-child a:hover{text-decoration:underline; background-color:#e6ecef;}
#bingo .master-list table td .submit_btn{width:40%!important; font-size:12px !important; margin:10px auto;}
#bingo .master-list table td .submit_btn a{padding:8px 0 !important;}

#bingo .bingo-list table th{width:60%;}
#bingo .bingo-list table td{width:40%;}
#bingo .bingo-list table td .submit_btn{width:30% !important; font-size:12px !important; margin:10px auto;}
#bingo .bingo-list table td .submit_btn a{padding:8px 0 !important;}
#bingo .bingo-list table th br{display:none;}

/*承認否認ボタン*/
#bingo .master-list table td .yes_btn,
#bingo .master-list table td .no_btn{float:left; width:46%; margin:0 2%;}

.yes_btn{
background:#c7281e;
background:-moz-linear-gradient(top, #c7281e 0%, #881b14 100%);
background:-webkit-linear-gradient(top, #c7281e 0%,#881b14 100%);
background:linear-gradient(to bottom, #c7281e 0%,#881b14 100%);
text-align:center;
border-radius:10px;}
.no_btn{
background:#000099;
background:-moz-linear-gradient(top, #000099 0%, #000062 100%);
background:-webkit-linear-gradient(top, #000099 0%,#000062 100%);
background:linear-gradient(to bottom, #000099 0%,#000062 100%);
text-align:center;
border-radius:10px;}
.yes_btn a,
.no_btn a{display:block; color:#fff; padding:8px 0;}
.yes_btn a:hover,
.no_btn a:hover{
background:#ccc;
background:-moz-linear-gradient(top, #ccc 0%, #888 100%);
background:-webkit-linear-gradient(top, #ccc 0%,#888 100%);
background:linear-gradient(to bottom, #ccc 0%,#888 100%);
border-radius:10px;}

@media screen and (max-width:799px){
#bingo table th{font-size:12px;}
#bingo table td{font-size:11px;}
#bingo span{margin-top:30px;}
#bingo .master-list table th:first-child{width:auto;}
#bingo .master-list table th:nth-child(2){width:auto;}
#bingo .master-list table th:last-child{width:auto;}
#bingo .master-list table td .yes_btn,
#bingo .master-list table td .no_btn{float:none; width:90%; margin:5px auto;}
#bingo .master-list table td .submit_btn{width:90% !important;}
#bingo .bingo-list table td .submit_btn{width:90% !important;}
#bingo .bingo-list table th br{display:block;}}

/*
================================================================================================================
師弟システム-破棄
================================================================================================================
*/
#bingo-select{/*width:100%; color:#000; font-size:14px; text-align:center; margin:30px auto;*/}
#bingo-select .yes_btn,
#bingo-select .no_btn,
#bingo-select .submit_btn{width:50% !important; margin:30px auto 0;}
#bingo-select .yes_btn a,
#bingo-select .no_btn a{display:block; color:#fff; font-weight:bold; padding:15px 0;}

@media screen and (max-width:799px){
#bingo-select{text-align:left; font-size:12px; }
#bingo-select .yes_btn,
#bingo-select .no_btn,
#bingo-select .submit_btn{width:90% !important; margin:30px auto;}}

/*
================================================================================================================
ビンゴカード作成検索
================================================================================================================
*/
#bingo-edit{}

/*ID指定フォーム*/
#bingo-edit .bingo-make{width:100%;}
#bingo-edit .bingo-make .submit_btn{float:left !important; width:48% !important; margin:0 1% 20px;}
#bingo-edit .bingo-make:after{visibility:hidden; display:block; content: " "; clear:both; height:0;}
#bingo-edit .bingo-cat,
#bingo-edit .bingo-search{
width:100%;
color:#000;/*
background-color:rgba(255,255,255,0.8);*/
border-radius:10px;
margin:10px auto 20px;}
#bingo-edit .bingo-cat input[type="text"],
#bingo-edit .bingo-cat input[type="submit"]{float:left; width:48%; margin:0 1%;}
#bingo-edit .bingo-cat input[type="text"]{margin-top:5px;}
#bingo-edit .bingo-search textarea{width:30%; margin:0 35%;}

/*詳細検索*/
#bingo-edit .bingo-search table th{width:50%; color:#fff; background-color:#555; font-size:14px; text-align:center; border:1px solid #000;}
#bingo-edit .bingo-search table td{width:50%; border:1px solid #000; padding:5px 0;}
#bingo-edit .bingo-search table td select{width:95% !important; margin:0 2.5%;}
#bingo-edit .bingo-search input[type="submit"]{width:60% !important; margin:20px auto 0 auto;}
#bingo-edit .bingo-back{width:30% !important; margin:50px auto 0 auto !important;}

/*検索結果*/
#bingo-edit .bingo-search-result{width:100%; margin:30px auto;}
#bingo-edit .bingo-search-result table{margin:10px auto;}
#bingo-edit .bingo-search-result table th{width:15%; background-color:#555; /*border:1px solid #000;*/ text-align:center;}
#bingo-edit .bingo-search-result table tr{color:#000; background-color:#fff; border:1px solid #000;}
#bingo-edit .bingo-search-result table td{padding:5px 10px;}

/*検索結果 マス段位画像*/
#bingo-edit .bingo-search-result table th img{width:70%; max-width:70px; padding:4px 0;}
#bingo-edit .bingo-search-result table th .bingo-mass,
#bingo-edit .bingo-search-result table th .bingo-diff{width:100%;}
#bingo-edit .bingo-search-result table th .bingo-diff{border-top:1px solid #000;}

/*検索結果 ビンゴ名*/
#bingo-edit .bingo-search-result table td:nth-child(2){border-left:1px solid #000;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-name a{display:block; color:#0066cc; font-size:16px; font-weight:bold;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-name a:hover{text-decoration:underline;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-text{font-size:12px;}

/*検索結果 ナイスビンゴ*/
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like{width:100%; margin-top:10px;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-img{float:left; width:12%; text-align:center;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-pt{float:left; width:88%;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-img img{width:100%; max-width:48px;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-pt{font-size:12px; font-weight:bold; text-align:left; padding-left:5px;}

/*検索結果 作成者*/
#bingo-edit .bingo-search-result table td:last-child{color:#000; font-size:12px; text-align:right;}
#bingo-edit .bingo-search-result table td:last-child strong{font-size:15px; padding-left:5px;}
#bingo-edit .bingo-search-result table td:last-child br{display:none;}

@media screen and (max-width:799px){
#bingo-edit .bingo-make .submit_btn{float:none !important; width:100% !important; margin:0 auto 20px;}

#bingo-edit .bingo-search table th,
#bingo-edit .bingo-search table td{display:block; width:100% !important;}
#bingo-edit .bingo-search table th{font-size:14px; text-align:center; border:none; padding:5px 0;}
#bingo-edit .bingo-search table td{border:none;}
#bingo-edit .bingo-search table tr{border:1px solid #000;}

#bingo-edit .bingo-search table td select{font-size:12px !important;}
#bingo-edit .bingo-search input[type="submit"]{width:100% !important;}

#bingo-edit .bingo-cat input[type="text"],
#bingo-edit .bingo-cat input[type="submit"]{float:none; width:100%; margin:10px auto 0 auto;}

#bingo-edit .bingo-search textarea{width:90%; margin:0 5%;}

#bingo-edit .bingo-search-result table td:last-child{text-align:center;}
#bingo-edit .bingo-search-result table td:last-child strong{font-size:13px;}
#bingo-edit .bingo-search-result table td:last-child br{display:block;}}

@media screen and (max-width:480px){
#bingo-edit .bingo-search-result table tr,
#bingo-edit .bingo-search-result table th,
#bingo-edit .bingo-search-result table td{display:block; width:100% !important;}

#bingo-edit .bingo-search-result table th,
#bingo-edit .bingo-search-result table td{padding:5px 0px;}

#bingo-edit .bingo-search-result table td:nth-child(2){border-top:1px solid #000; border-left:none;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-name,
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-text{text-align:center; /*padding:0 5px;*/}

#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-img{float:left; width:50%; text-align:right;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-img img{width:40px;}
#bingo-edit .bingo-search-result table td:nth-child(2) .bingo-like .bingo-like-pt{float:left; width:50%;}

#bingo-edit .bingo-search-result table td:last-child{text-align:center;}
#bingo-edit .bingo-search-result table td:last-child strong{font-size:13px;}
#bingo-edit .bingo-search-result table td:last-child br{display:none;}}

/*
================================================================================================================
ビンゴカード詳細
================================================================================================================
*/
#bingo-edit .bingo-detail table{margin:10px 0;}
#bingo-edit .bingo-detail table th{color:#fff; background-color:#555; font-size:14px; text-align:center; border:1px solid #000; padding:5px 0;}
#bingo-edit .bingo-detail table td{color:#000; background-color:#fff; font-size:13px; text-align:center; border:1px solid #000; padding:10px 0;}

/*マス目数*/
#bingo-edit .bingo-table table{width:80%; margin:20px auto; font-size:13px;}
#bingo-edit .bingo-table table td{background-color:#888;}
#bingo-edit .bingo-table table.cell-3 td{width:33%;}
#bingo-edit .bingo-table table.cell-4 td{width:25%;}
#bingo-edit .bingo-table table.cell-5 td{width:20%;}
#bingo-edit .bingo-table table a{display:block; width:70%; color:#fff; background-color:#666; border-radius:5px; margin:10px 15%; padding:5px 0;}
#bingo-edit .bingo-table table a:hover{background-color:#222; border-radius:5px; text-decoration:underline;}

/*達成したマス*/
#bingo-edit .bingo-table table.cell-3 td.bingo{background-color:#bfeaff !important;}
#bingo-edit .bingo-table table.cell-4 td.bingo{background-color:#ffebb4 !important;}
#bingo-edit .bingo-table table.cell-5 td.bingo{background-color:#ffcce7 !important;}

/*マス目数字*/
#bingo-edit .bingo-table table td{border:1px solid #000;}
#bingo-edit .bingo-table table td .table-num{width:40px; text-align:center; margin:20px auto;}

/*楽曲*/
#bingo-edit .bingo-music{margin:30px auto;}
#bingo-edit .bingo-music table th{color:#fff; background-color:#555; font-size:14px; text-align:center; font-weight:bold; border:1px solid #000; padding:3px;}
#bingo-edit .bingo-music table td{color:#000; background-color:#fff; font-size:13px; text-align:center; border:1px solid #000;}
#bingo-edit .bingo-music table td img{padding:10px 0;}
#bingo-edit .bingo-music .submit_btn{width:90% !important; margin:10px 5% !important;}

/*楽曲検索結果*/
#bingo-edit .bingo-music-list{margin:30px auto;}
#bingo-edit .bingo-music-list table th{color:#fff; background-color:#555; font-size:14px; text-align:center; font-weight:bold; border:1px solid #000; padding:3px;}
#bingo-edit .bingo-music-list table td{color:#000; background-color:#fff; font-size:13px; text-align:center; border:1px solid #000;}
#bingo-edit .bingo-music-list table td a{display:block; color:#0066cc; padding:4px 0;}
#bingo-edit .bingo-music-list table td a:hover{text-decoration:underline; background-color:#e6ecef;}

#bingo-edit:after{visibility:hidden; display:block; content: " "; clear:both; height:0;}
#bingo-edit .bingo-menu-2:after,
#bingo-edit .bingo-menu-3:after{display:none;}

/*ボタン選択肢2カラム*/
/*ボタン選択肢3カラム*/
#bingo-edit .bingo-menu-2,
#bingo-edit .bingo-menu-3{display:flex; justify-content:space-between;}
#bingo-edit .bingo-menu-2 > *{width:calc((100% / 2) - 10px) !important;}
#bingo-edit .bingo-menu-3 > *{width:calc((100% / 3) - 10px) !important;}

/*ナイスビンゴ済み*/
#bingo-edit .bingo-menu-3 .bingo-nice,
#bingo-edit .bingo-menu-2 .bingo-nice{
/*float:left;*/
display:block;
color:#ccc !important;
text-align:center;
font-size:14px;
font-weight:bold;
background-color:#666 !important;
border-radius:5px;
padding:10px 0;}

#bingo-edit .notice{
display:block;
width:100%;
color:#fff;
background-color:#f00;
font-size:14px;
font-weight:bold;
text-align:center;
border:none;
margin:20px auto;
padding:5px 0;}

@media screen and (max-width:640px){
#bingo-edit .bingo-detail table th,
#bingo-edit .bingo-detail table td{font-size:11px; padding:5px 0;}
#bingo-edit .bingo-music table th,
#bingo-edit .bingo-music table td{font-size:12px; padding:5px;}

#bingo-edit .bingo-music{overflow-x:scroll;}
#bingo-edit .bingo-music table th,
#bingo-edit .bingo-music table td{white-space:nowrap;}

#bingo-edit .bingo-table table{width:100%;}

#bingo-edit .bingo-menu-2,
#bingo-edit .bingo-menu-3{flex-wrap:wrap;}
#bingo-edit .bingo-menu-2 > *,
#bingo-edit .bingo-menu-3 > *{width:100% !important; margin:10px auto 0;}}

/*
================================================================================================================
ビンゴカード楽曲設定
================================================================================================================
*/
.set-music{
display:block;
position:relative;
width:100%;
background-color:rgba(255,255,255,0.8);
border-radius:10px;
margin:20px auto;
padding:20px;}
.set-music div{float:left; width:33%;}
.set-music div:first-child{margin-right:0.5%;}
.set-music div:nth-child(2){margin-right:0.5%;}
.set-music p{display:block; width:100%; font-size:13px !important; color:#000; font-weight:bold !important; text-align:left;}
.set-music select{width:100%;}
.set-music .submit_btn{width:100% !important; margin:10px auto;}
@media screen and (max-width:640px){
.set-music div{float:none; width:100%;}
.set-music p{text-align:center}}

/*
================================================================================================================
ビンゴカード ページ送り
================================================================================================================
*/
.bingo-page{margin-top:20px;}

.bingo-page:after{visibility:hidden; display:block; content: " "; clear:both; height:0;}

.bingo-page ul.ul1 li{
text-align:center;
margin:0 auto;}

.bingo-page ul.ul1 li ul.ul2 li{
float:left;
background-color:rgba(255,255,255,0.7);
font-size:13px;
text-align:center;
border:2px solid #444;
margin:4px;}

.bingo-page ul.ul1 li ul.ul2{
width:90%;
/*display:-ms-flexbox;
display:-webkit-flex;
display:flex;*/
display:-webkit-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:-ms-flex;
display:-o-flex;
display:flex;
display:box;

-ms-flex-wrap:wrap;
-webkit-flex-wrap:wrap;
flex-wrap:wrap;
justify-content:center;
margin:0 5%;}

.bingo-page ul.ul1 li ul.ul2 li{
display:flex;
text-align:center;
white-space:nowrap;}

.bingo-page ul.ul1 li ul.ul2 li a{
display:block;
color:#000;
font-weight:bold;
padding:5px 10px;}
.bingo-page ul.ul1 li ul.ul2 li a:hover{text-decoration:underline; color:#0066cc;}

.bingo-page ul.ul1 li ul.ul2 li.select_pagelink{
text-align:center !important;
padding:5px 10px;}

.bingo-page ul.ul1 li ul.ul2 li.select_pagelink span{
font-size:13px !important;
color:#000 !important;
text-align:center !important;
border:none !important;
margin:0 !important;
padding:0 !important;}

.select_pagelink{background:#00edff !important; border-color:#fff !important;}
.select_pagelink > span{background:transparent !important;}

#search-result table th{padding:5px 0;}
#search-result table td{text-align:center; font-size:14px; border:1px solid #000;}
#search-result table a{display:block; color:#0066cc; padding:10px 5px;}
#search-result table a:hover{text-decoration:underline; background-color:#e6ecef;}
#search-result p{display:block; width:100%; color:#000; font-size:14px; text-align:center; margin:20px auto 10px auto;}
