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

.dj-status .dj-rival ul li::after,
#visit-loglist .log-shop::after,
.tsuji ul li::after,
.tsuji-detail ul li::after{display:block; content:""; clear:both; visibility:hidden; height:0;}

/*
================================================================================================================
テーマ変更
================================================================================================================
*/
/*ライバル*/
#rival .title-blue{border-bottom:2px solid #c6ff00 !important;}
#rival .main-cat-name{color:#fff;}

/*プロフィール*/
.dj-status.frame{color:#fff !important; background:#444 !important;}
.dj-status::after{display:none !important;}

.dj-status .dj-profile table td,
.dj-status .dj-tension{border-bottom:1px solid #c2fe40;}
.dj-status .dj-profile table td:first-child,
.dj-status .dj-tension span{color:#c2fe40;}

.dj-status .dj-rank{color:#fff; background-color:rgba(0,0,0,.6); border:1px solid #000;}
.dj-status .dj-rank .cat-name{color:#fff; background:#323232; border-bottom:1px solid #000;}

.dj-status .dj-rank .rank-cat div:first-child span,
.dj-status .dj-rank .point-cat div:first-child span{color:#c6ff00; font-size:20px; letter-spacing:2px;}
.dj-status .dj-rank .cat-name .comment-edit a:hover{background:#0070ba;}

/*行脚*/
#visit-edit .log-shop{color:#fff; background-color:rgba(0,0,0,.6);}
#visit-edit .log-shop::after{display:none;}
#countDown_title,#countDown_main{display:inline-block; font-weight:bold !important; color:#f00 !important; padding:0 5px; font-size:16px !important;}

/*ライバル*/
.dj-status #rival-menu-btn{background:#ff9000; font-weight:700;}
.dj-status #rival-menu-btn:hover,
.dj-status #rival-menu-btn.dani-open{background:#03ac96;}
.dj-status #rival-menu{box-shadow:0 0 10px rgba(0,0,0,.6); border-radius:10px; overflow:hidden; border:1px solid #000;}
.dj-status #rival-menu ul li a:before{color:#c2fe40;}

#rival.dj-status .dj-profile table td,
#rival.dj-status .dj-tension/*,
.dj-status .dj-rival*/{border-bottom:1px solid #c6ff00;}

#rival.dj-status .dj-profile table td:first-child,
#rival.dj-status .dj-tension span,
.dj-status .dj-rival span.title-sub{color:#c6ff00 !important;}


/*比較*/
.compare-result .compare-title{color:#fff; border-bottom:2px solid #ba00ba;}

/*フォント*/
.dj-status .dj-rank .cat-name,
.dj-status .dj-rank .rank-cat div:first-child span,
.dj-status .dj-rank .point-cat div:first-child span,
.dj-status .dj-profile table td:first-child,
.dj-status .dj-tension span,
.dj-status #badge > p,
.dj-status #rival-menu-btn,
.dj-status .dj-rival span{font-family:'Noto Sans JP', sans-serif; font-weight:700 !important;}

/*
===============================================================================================================
ステータス-Vディスク
================================================================================================================
*/
.dj-status ul#vdisc{display:flex; width:100%; justify-content:flex-end;}
.dj-status ul#vdisc li{display:flex; align-items:center;}
.dj-status ul#vdisc li + li{margin-left:10px;}
.dj-status ul#vdisc li p:first-child{margin-right:5px;}
.dj-status ul#vdisc li p:first-child img{width:60px;}
.dj-status ul#vdisc li p:last-child::before{content:"×";}
@media screen and (max-width:480px){.dj-status ul#vdisc li p:first-child img{width:45px;}}

/*
===============================================================================================================
ステータス-勲章
================================================================================================================
*/
.dj-status #badge{border:1px solid #000; margin:20px auto 0;}
.dj-status #badge > p{color:#fff; background:#323232; padding:5px; border-bottom:1px solid #000;}
.dj-status #badge ul{display:flex; background:rgba(0,0,0,.6); justify-content:space-between; padding:10px;}
.dj-status #badge ul li{position:relative; width:calc(20% - 10px);}
.dj-status #badge ul li img{width:100%;}
@media screen and (max-width:640px){
.dj-status #badge ul{padding:5px;}
.dj-status #badge ul li{width:calc(20% - 3px);}}

.dj-status #badge ul li::after{
display:block;
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background-size:100% auto;
pointer-events:none;}
.dj-status #badge ul li.ver00::after{display:none;}
.dj-status #badge ul li.ver30::after{background-image:url(/game/2dx/33/images/djdata/badge/ver/30.png);}
.dj-status #badge ul li.ver31::after{background-image:url(/game/2dx/33/images/djdata/badge/ver/31.png);}
.dj-status #badge ul li.ver32::after{background-image:url(/game/2dx/33/images/djdata/badge/ver/32.png);}
.dj-status #badge ul li.ver33::after{background-image:url(/game/2dx/33/images/djdata/badge/ver/33.png);}

/*
================================================================================================================
共通
================================================================================================================
*/
@media screen and (max-width:640px){.dj-status{padding:10px;}}

/*
================================================================================================================
ステータス
================================================================================================================
*/
.dj-status > p{width:100%; text-align:center;}

/*新着情報*/
.dj-status .new-info{
display:block;
width:100%;
color:#fff;
background-color:#c8281e;
font-size:14px;
font-weight:bold;
text-align:center;
margin:25px auto;}
.dj-status .new-info a{display:block; color:#fff; padding:5px 0;}
.dj-status .new-info a:hover{background-color:#f00;}

/*クプロ画像*/
.dj-status .qpro-img{width:100%; text-align:center; margin:0 auto 20px;}
.dj-status .qpro-img img{width:204px; height:300px; /*border:1px solid #888;*/}

/*プロフィール*/
.dj-status .dj-profile table{color:#fff !important; /*margin:20px auto;*/}
.dj-status .dj-profile table td{padding:10px; font-size:12px;}
.dj-status .dj-profile table td:first-child{width:80px; text-align:left; font-weight:bold; padding-right:0;}
.dj-status .dj-profile table td:last-child{text-align:right; padding-left:0;}
.tension-img img{width:100%; max-width:40px;}

/*取得情報*/
.dj-status .dj-rank{display:flex; width:100%; flex-wrap:wrap; margin:30px auto 0;}
.dj-status .dj-rank .cat-name{position:relative; width:100%; font-weight:bold; text-align:center; padding:5px 0;}
.dj-status .dj-rank .rank-cat{width:50%; text-align:center; padding:20px;}
.dj-status .dj-rank .rank-cat div{width:100%;}
.dj-status .dj-rank .rank-cat div:first-child{font-weight:bold; color:#0084ff;}
.dj-status .dj-rank .point-cat{width:calc(100% / 3); text-align:center; padding:20px;}
.dj-status .dj-rank .point-cat div{width:100%;}
.dj-status .dj-rank .point-cat div:first-child{font-weight:bold; color:#0084ff;}
.dj-status .dj-rank .visit-cat{width:calc(100% / 3); text-align:center; padding:20px;}
.dj-status .dj-rank .visit-cat div{width:100%;}
.dj-status .dj-rank .dj-text{width:100%; text-align:center; padding:20px;}

/*SP DP色分け*/
.dj-status .dj-rank .rank-cat div:first-child span,
.dj-status .dj-rank .point-cat div:first-child span{
display:block;
width:100%;
max-width:216px;
border-radius:0;
margin:0 auto 10px;}
.dj-status .dj-rank.stepup .rank-cat div:first-child span{padding:0px 40px}

.rank-cat span{display:inline-block; font-size:12px; text-align:center; margin-bottom:7px !important;}

/*WEEKLY RANKING*/
.dj-status .rank-cat.wr > div:not(:first-child){display:flex; width:100%; max-width:200px; line-height:100%; flex-wrap:wrap; align-items:center; margin:0 auto;}
.dj-status .rank-cat.wr > div:nth-child(2){margin-top:10px;}
.dj-status .rank-cat.wr > div:nth-child(3){margin:5px auto;}
.dj-status .rank-cat.wr span{display:block; margin-bottom:0 !important} 
.dj-status .rank-cat.wr span:first-child{width:103px;}
@media screen and (max-width:440px){
.dj-status .rank-cat.wr > div:nth-child(2){margin-top:15px;}
.dj-status .rank-cat.wr > div:nth-child(3){margin:10px auto;}
.dj-status .rank-cat.wr span{width:100% !important;}
.dj-status .rank-cat.wr span:first-child{margin-bottom:3px !important;}}

/*取得情報 応援クプロ履歴*/
.dj-status .setup-qpro{width:100%; text-align:center; margin:20px auto;}
.dj-status .setup-qpro div{font-size:14px; font-weight:bold; border-bottom:1px solid #000; margin-bottom:10px;}
.dj-status .setup-qpro table th{color:#fff; background-color:#555; font-size:13px; font-weight:bold; text-align:center; padding:5px 0;}
.dj-status .setup-qpro table tr{text-align:center; border:1px solid #000;}
.dj-status .setup-qpro table th:first-child,
.dj-status .setup-qpro table td:first-child{border-right:1px solid #000;}
.dj-status .setup-qpro table td{height:30px; text-align:center;}
.dj-status .setup-qpro table td:last-child{font-size:11px; font-weight:bold;}
.dj-status .setup-qpro table td:last-child.no-follow{color:#444; font-weight:normal;}
.dj-status .setup-qpro table td a{color:#0066cc;}
.dj-status .setup-qpro table td a:hover{text-decoration:underline;}

/*取得情報 コメント編集ボタン*/
.dj-status .dj-rank .cat-name .comment-edit{position:absolute; top:2px; right:10px;}
.dj-status .dj-rank .cat-name .comment-edit a{display:block; color:#fff; background-color:#000; padding:3px 10px; border-radius:5px; transition:background .2s ease;}

/*ノーツレーダー*/
#notes img{width:100%; max-width:216px;}
#notes ul{width:100%; margin:10px auto 0;}
#notes ul li{display:flex;}
#notes ul li > p{width:50%;}
#notes ul li > p:nth-child(odd){font-size:12px; font-weight:bold; text-align:right; padding-right:10px;}
#notes ul li > p:nth-child(even){color:#fff !important; text-align:left; padding-left:10px;}
#notes ul li:first-child > p{color:#ff40eb;}
#notes ul li:nth-child(2) > p{color:#85e100;}
#notes ul li:nth-child(3) > p{color:#ff6c00;}
#notes ul li:nth-child(4) > p{color:#8957dd;}
#notes ul li:nth-child(5) > p{color:#dd0000;}
#notes ul li:nth-child(6) > p{color:#0086e5;}
@media screen and (max-width:640px){.dj-status .dj-rank#notes .rank-cat{width:100%;}}

/*STEP UP*/
.dj-rank .stepup{width:100%; text-align:center; padding:20px;}

/*
================================================================================================================
ステータス-ライバル用
================================================================================================================
*/

#rival .dj-profile table td{color:#fff !important; background-color:transparent !important;}

/*SP DP色分け*/
#rival.dj-status .dj-rank .rank-cat div:first-child span,
#rival.dj-status .dj-rank .point-cat div:first-child span{border-radius:0; display:inline-block;}
#rival.dj-status .dj-rank.stepup .rank-cat div:first-child span{padding:0px 40px}

/*フォロー/ライバル*/
.dj-status .dj-rival{width:100%; background:rgba(0,0,0,.6); border:1px solid #000; padding:0 0 10px; margin:20px auto 0;}
.dj-status .dj-rival.follow{border-bottom:none;}
.dj-status .dj-rival.comp{border-top:none; margin:0 auto;}

.dj-status .dj-rival > span{display:block; text-align:center; margin:0 auto 10px;}
.dj-status .dj-rival span.title{color:#fff; background:#323232; padding:5px; border-bottom:1px solid #000;}
.dj-status .dj-rival.comp span.title{border-top:1px solid #000;}
.dj-status .dj-rival ul + span{margin-top:10px;}

.dj-status .dj-rival ul{display:flex; width:100%; padding:0 5px; margin:0 auto; justify-content:center;}
.dj-status .dj-rival ul li{width:calc((100% / 3) - 10px); text-align:center;}
.dj-status .dj-rival ul li + li{margin-left:10px;}
.dj-status .dj-rival ul li a{display:block; color:#fff; background-color:#777; padding:8px; border-radius:5px; border:1px solid #000; transition:background .2s ease;}
.dj-status .dj-rival ul li:not(.btn-active) a:hover{background-color:#999;}

@media screen and (max-width:799px){
.dj-status .dj-rival ul li{width:48%;}}
@media screen and (max-width:480px){
.dj-status .dj-rival ul li{width:100%;}}

/*フォロー/ライバル 設定済用class*/
.dj-status .dj-rival ul li.btn-active a{background-color:#930006;}
.dj-status .dj-rival ul li.btn-active a:hover{background-color:#c10008;}
.dj-status .dj-rival ul li a:hover{background-color:#c10008; border-radius:5px;}

/*
================================================================================================================
ステータス-ライバル用サブメニュー
================================================================================================================
*/
.dj-status #rival-menu-btn{
display:flex;
position:absolute;
top:15px;
right:15px;
width:50px;
height:50px;
color:#fff;
font-size:12px;
font-weight:bold;
font-family: 'M PLUS 1', sans-serif;
border:1px solid #000;
border-radius:5px;
transition:background .2s ease;
justify-content:center;
align-items:center;
z-index:4;}
.dj-status #rival-menu-btn::before{content:"MENU";}
.dj-status #rival-menu-btn.dani-open::before{content:"CLOSE";}
.dj-status #rival-menu-btn:hover{cursor:pointer;}

.dj-status #rival-menu{
position:absolute;
top:5px;
right:5px;
width:50%;
display:none;
color:#fff;
font-size:14px;
font-weight:bold;
text-align:left;
font-family:'Noto Sans JP', sans-serif;
z-index:3;}
.dj-status #rival-menu ul li{border-bottom:1px solid #666;}
.dj-status #rival-menu ul li:last-child{border:none;}
.dj-status #rival-menu ul li a{display:block; color:#fff; background-color:#000; padding:8px 10px; transition:background .2s ease;}
.dj-status #rival-menu ul li a:hover{background-color:#666;}
.dj-status #rival-menu ul li a:before{content: "＞"; padding-right:5px;}
.dj-status #rival-menu ul li.icn-b a:after{
content:'';
float:right;
display:block;
width:64px;
height:14px;
background-image:url(/game/2dx/30/images/menu/icn/basic_course.png);}

@media screen and (max-width:799px){
.dj-status #rival-menu{width:calc(100% - 10px); font-size:12px;}
.dj-status #rival-menu ul li.icn-b a:after{
width:20px;
height:20px;
background-image:url(/game/2dx/30/images/menu/icn/basic_course_sp.png);}}

/*
================================================================================================================
行脚情報
================================================================================================================
*/
#title-select{
width:100%;
max-width:300px;
margin:20px auto 0;}
#title-select select{width:100%; margin:10px auto;}
#title-select span{display:block; color:#fff; text-align:center; font-weight:bold;}
#rival #title-select span{color:#fff;}

.visit-log{
width:100%;
color:#000;
background-color:#fff;
border-top:2px solid #000;
border-bottom:2px solid #000;
font-size:14px;
margin:20px auto;}
.visit-log table td{width:50%; padding:5px;}
.visit-log table td:first-child{font-weight:bold; text-align:right;}
.visit-log table td:last-child{text-align:left;}

.visit-map{width:100%; text-align:center; margin:20px auto;}
.visit-map img{width:100%; max-width:587px;}

.visit-list{width:100%; max-width:587px; margin:20px auto;}
.visit-list table th{color:#fff; background-color:#555; font-size:13px; font-weight:bold; text-align:center; padding:5px 0;}
.visit-list table tr{color:#000; text-align:center; border:1px solid #000;}
.visit-list table td{color:#000; background-color:#fff; text-align:center; padding:5px 0;}

.visit-log-btn{
width:35%;
background-color:#f90;
font-size:15px;
font-weight:bold;
text-align:center;
border:1px solid #000;
border-radius:10px;
margin:0 auto;}
.visit-log-btn a{display:block; color:#fff; padding:10px;}
.visit-log-btn a:hover{background-color:#fc3; border-radius:10px;}

@media screen and (max-width:480px){
.visit-log{font-size:11px;}
.visit-list table td{font-size:11px;}
.visit-log-btn{width:100%;}}

/*
================================================================================================================
行脚情報-日誌リストIIDX28
================================================================================================================
*/
.visit-list table th:first-child{width:15%;}
.visit-list table th:nth-child(2){width:33%;}
.visit-list table th:nth-child(3){width:32%;}
.visit-list table th:last-child{width:20%;}

.visit-list dl{
display:flex;
width:100%;
color:#000;
font-size:12px;
border:1px solid #000;
background:#fff;
align-items:center;
border-top:none;}

.visit-list dl.upper{display:none;}/*30件制限*/
.visit-list dl dd{position:relative; text-align:center; padding:5px 0;}
.visit-list dl dd:first-child{width:15%;}
.visit-list dl dd:nth-child(2){width:33%;}
.visit-list dl dd:nth-child(3){width:32%;}
.visit-list dl dd:last-child{width:20%;}
.visit-list dl dd a{
display:inline-block;
color:#fff;
background:#333;
font-size:11px;
font-weight:bold;
border-radius:4px;
padding:2px 8px;}
.visit-list dl dd a:hover{background:#555;}

@media screen and (max-width:480px){
.visit-list table th:nth-child(2){width:43%;}
.visit-list table th:nth-child(3){width:42%;}
.visit-list table th:last-child{display:none;}

.visit-list dl{flex-wrap:wrap;}
.visit-list dl dd{text-align:center;}
.visit-list dl dd:nth-child(2){width:43%;}
.visit-list dl dd:nth-child(3){width:42%;}
.visit-list dl dd:last-child{width:100%; text-align:right; padding:0 5px 5px 0;}
.visit-list dl dd:last-child a{padding:3px 10px;}}

@media screen and (max-width:420px){
.visit-list table{display:none;}
.visit-list dl{
border-bottom:2px solid #000;
border-right:none;
border-left:none;
font-size:11px;}

.visit-list dl:first-of-type{border-top:2px solid #000;}
.visit-list dl dd{padding:2px 5px;}
.visit-list dl dd:first-child,
.visit-list dl dd:nth-child(2),
.visit-list dl dd:nth-child(3){width:100%; text-align:left; padding-left:90px;}
.visit-list dl dd::before{
display:block;
width:85px;
position:absolute;
content:attr(data-title);
top:0;
left:0;
color:#fff;
background:#777;
text-align:left;
font-size:10px !important;
font-weight:bold !important;
padding:2px 5px}
.visit-list dl dd:last-child::before{display:none;}}

.visit-list div.show_btn{
width:50%;
margin: 10px auto;
color:#fff;
background:#434343;
background:-moz-linear-gradient(top, #434343 0%, #060606 100%);
background:-webkit-linear-gradient(top, #434343 0%,#060606 100%);
background:linear-gradient(to bottom, #434343 0%,#060606 100%);
font-size:14px;
font-weight:bold;
text-align:center;
border-radius:10px;}

.visit-list div.show_btn:hover{
cursor:pointer;
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;}

/*
================================================================================================================
行脚情報-日誌一覧
================================================================================================================
*/
#visit-loglist:after{visibility:hidden; display:block; content: " "; clear:both; height:0;}
#visit-loglist .log-shop{float:left; width:23%; color:#000; background-color:#fff; font-size:13px; text-align:center; border:2px solid #333; margin:10px 1%;}
#visit-loglist .log-shop .log-title{color:#fff; font-size:14px; font-weight:bold; background-color:#777; margin-bottom:5px; padding:5px 0;}
#visit-loglist .log-shop .log-title:not(:first-child){margin-top:10px;}
#visit-loglist .log-shop .log-edit{
width:80%;
background:linear-gradient(to bottom, #434343 0%,#060606 100%);
border-radius:10px;
margin:20px 10%;}
#visit-loglist .log-shop .log-edit a{display:block; color:#fff; padding:10px 0;}
#visit-loglist .log-shop .log-edit a:hover{background:linear-gradient(to bottom, #ccc 0%,#888 100%); border-radius:10px;}

@media screen and (max-width:980px){#visit-loglist .log-shop{width:48%; margin:10px 1%;}}
@media screen and (max-width:480px){#visit-loglist .log-shop{width:98%; margin:10px 1%;}}

/*
================================================================================================================
行脚情報-日誌詳細
================================================================================================================
*/
#log-detail .log-shop{width:100%; color:#000; background-color:#fff; font-size:13px; text-align:center; border:1px solid #000; margin:10px auto;}
#log-detail .log-shop .log-title{color:#fff; font-size:14px; font-weight:bold; background-color:#777; margin-bottom:5px; padding:5px 0; border-bottom:1px solid #000;}
#log-detail .log-shop .log-text{border-top:1px dotted #666; margin-top:10px; padding:10px;}
#log-detail .log-shop .log-text:last-child{ margin-top:0;}
#edit-select{width:100%;}
#edit-select .edit-btn{width:30%; text-align:center; margin:0 auto;}

#edit-select .edit-btn .log-btn{
width:100%;
color:#fff;
font-size:14px;
font-weight:bold;
text-align:center;
margin:20px auto;}

#edit-select .edit-btn .submit_btn{min-height:40px;}

#edit-select .edit-btn .log-btn a{display:block; color:#fff; background:#555; padding:10px 0; border-radius:5px; border:1px solid #000; transition:background .2s ease;}
#edit-select .edit-btn .log-btn a:hover{background:#c600ff;}
@media screen and (max-width:480px){#edit-select .edit-btn{width:100%;}}

/*
================================================================================================================
行脚情報-日誌編集
================================================================================================================
*/
#visit-edit .log-shop{width:100%; font-size:13px; text-align:center; margin:20px auto 0; padding:20px;}
#visit-edit .log-shop .log-title{color:#fff; font-size:14px; font-weight:bold; background-color:#777; margin-bottom:5px; padding:5px 0;}
#visit-edit .log-shop .log-title:not(:first-child){margin-top:10px;}
#visit-edit .log-shop #input_title{border:1px solid #888; margin:10px auto;}
#visit-edit .log-shop textarea{width:70%; height:200px; border:1px solid #888; margin:20px auto;}
#visit-edit .log-shop .submit_btn{
width:50% !important;
background:linear-gradient(to bottom, #434343 0%,#060606 100%);
border-radius:10px;
color:#fff;
font-size:15px;
font-weight:bold;
margin:20px auto;}
#visit-edit .log-shop .submit_btn:hover{
cursor:pointer;
background:linear-gradient(to bottom, #ccc 0%,#888 100%);
border-radius:10px}

/*
================================================================================================================
ライバル用-第二階層ページ
================================================================================================================
*/
.notice-text{width:100%; text-align:center; margin:20px 0;}
.alert-text{color:#fff; background-color:#f00; font-weight:bold; text-align:center; margin:20px auto; padding:5px;}
.check-info{width:100%; color:#f00; text-align:center;}
.rival-vs{width:100%; color:#fff; background-color:#f90; font-size:14px; font-weight:bold; text-align:center; padding:4px 0;}

/*フォロー登録*/
.select-btn{display:flex; width:60%; margin:0 auto; justify-content:center}
.select-btn div{
display:block;
width:48%;
font-size:14px;
font-weight:bold;
text-align:center;
margin:0 auto;}
.select-btn div a{
display:block;
width:100%;
color:#fff;
background:#555;
border-radius:10px;
padding:10px 0;
transition:background .2s ease;}
.select-btn div a:hover{background:#ba00ba;}
@media screen and (max-width:799px){.select-btn{width:100%;}}

/*アクティブ設定*/
.rivel-check{width:60%; margin:40px 20%;}
.rivel-check table{margin:10px 0;}
.rivel-check table th{width:20%; color:#fff; background-color:#444; font-weight:bold; text-align:center; border-right:1px solid #000;}
.rivel-check table tr{height:40px; color:#000; background-color:#fff; border:1px solid #000;}
.rivel-check table td{padding:5px 10px;}

@media screen and (max-width:799px){.rivel-check{width:100%; margin:40px 0;}}

/*スコア比較*/
.compare-game{width:100%; margin:20px 0;}
.compare-game table tr{border-bottom:1px solid #000; color:#000; background-color:#fff; border-top:1px solid #000;}
.compare-game table td{width:50%; font-size:14px; padding:10px;}
.compare-game table td:first-child{font-weight:bold; text-align:right;}
.compare-game table td:last-child{text-align:left;}

/*スコア比較 メニュー*/
.compare-menu{width:100%; margin:30px auto;}
.compare-menu ul{display:flex; justify-content:space-between; width:100%;}
.compare-menu ul li{
width:calc((100% / 3) - 10px);
color:#fff;
font-size:16px;
font-weight:bold;
text-align:center;}
.compare-menu ul li a{
display:block;
width:100%;
color:#fff;
background:#333;
border-radius:5px;
padding:15px 0;
transition:background .2s ease;}
.compare-menu ul li a:hover{background:#ba00ba;}
@media screen and (max-width:480px){
.compare-game table td{font-size:12px;}
.compare-menu ul li{font-size:13px;}}

/*スコア比較 結果*/
.compare-result{width:100%; color:#000; margin-bottom:50px;}
.compare-result .compare-title{width:100%; font-size:16px; font-weight:bold; text-align:center; padding:0 0 5px; margin:0 auto 10px;}
.compare-result table tr{background-color:#fff; border:1px solid #111;}
.compare-result table th{width:50%; color:#fff; background-color:#555; font-size:13px; font-weight:bold; text-align:center; padding:5px 0;}
.compare-result table td{text-align:center; padding:5px;}

/*DJランク比較 結果*/
.compare-rank{width:100%; color:#000; margin-bottom:50px;}
.compare-rank table tr{background-color:#fff; border:1px solid #111;}
.compare-rank table th{color:#fff; background-color:#555; font-size:13px; font-weight:bold; text-align:center; padding:5px 0;}
.compare-rank table td{text-align:center; padding:5px;}
.compare-rank table th:first-child{width:20%;}
.compare-rank table th:nth-child(2){width:40%;}
.compare-rank table th:last-child{width:40%;}

/*
================================================================================================================
ライバル用 ウィークリーランキング
================================================================================================================
*/
p.weekly{text-align:left !important;}

@media screen and (max-width:799px){
.rival-weekly{overflow-x:scroll; overflow-y:hidden;}
.rival-weekly table td:nth-child(even) img{width:40px;}
.rival-weekly table th,
.rival-weekly table td{white-space:nowrap;}
p.weekly{font-size:11px; margin-top:20px; text-align:left;}}

/*
================================================================================================================
辻斬り
================================================================================================================
*/
#tsujigiri{
display:block;
position:relative;
width:100%;
margin:0 auto 30px;}
#tsujigiri .submit_btn{max-width:600px; margin:0 auto;}

.tsuji,.tsuji-detail{width:100%; /*background-color:#000; padding:20px;*/ margin:20px auto 0;}

.tsuji div{margin:0 auto 20px;}
.tsuji div:last-child{margin:0 auto;}
.tsuji ul,.tsuji-detail ul{width:100%; font-size:15px; margin:0 auto;}
.tsuji-detail ul:after{visibility:hidden; display:block; content:" "; clear:both; height:0;}

.tsuji ul{display:flex; margin:0 auto 20px;}
.tsuji ul + ul{margin-top:10px;}
.tsuji ul li{
width:calc(50% - 5px);
text-align:center;
border:1px solid #000;
padding:5px;}
.tsuji ul li:first-child{color:#fff; background:#000; font-weight:bold; margin-right:10px;}
.tsuji ul li:last-child{color:#000; background:#fff;}

/*辻斬り店舗詳細*/
.tsuji-detail p{
display:block;
width:100%;
color:#fff;
font-weight:bold;
text-align:center;
border:1px solid #fff;
padding:5px;
margin:0 auto 20px;}
.tsuji-detail span a{
display:block;
width:100%;
color:#0066cc;
background-color:#fff;
font-size:15px;
text-align:center;
border-bottom:1px solid #000;
padding:5px;}
.tsuji-detail span a:hover{text-decoration:underline; background-color:#e6ecef;}

.tsuji-detail ul li{
float:left;
width:50%;
color:#000;
background-color:#fff;
text-align:center;
padding:5px;}
.tsuji-detail ul li:nth-child(2){border-left:1px solid #000;}

@media screen and (max-width:640px){
.tsuji{padding:5px 10px;}
.tsuji div{padding:5px 10px;}
.tsuji ul li{
float:none;
width:100%;
text-align:center;
border:1px solid #000;
padding:5px;
margin:0;}
.tsuji ul:nth-child(2){margin:10px auto;}}

/*
================================================================================================================
辻斬り-IIDX27新規追加
================================================================================================================
*/
.tsuji .title-blue{background:transparent !important;}

/*辻斬り隠しキャラ*/
.tsuji-chara{
display:flex;
position:relative;
width:100%;
height:100%;
padding:0 !important;
margin:0 auto !important;
justify-content:flex-start;
flex-wrap:wrap;}

.tsuji-chara > .chara{
display:block;
position:relative;
width:calc(25% - 10px);
background:#fff;
text-align:center;
border:1px solid #000;
padding:0 !important;
margin:5px !important;}
.tsuji-chara > .chara img{width:100%; max-width:216px;}

.tsuji-chara > .chara > strong{position:relative; display:block; margin-bottom:5px; padding:3px !important; margin:0;}
.tsuji-chara > .chara > .chara-inner{
display:block; 
position:relative;
width:100%;
/*min-height:calc(100% - 30px);*/
height:0;
background:transparent;
padding:0 !important;
padding-top:calc(500 / 340 * 100%) !important;
margin:0 !important;}
.tsuji-chara > .chara > .chara-inner > .chara-img{
display:flex;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
align-items:center;
justify-content:center;
z-index:2;}

@media screen and (max-width:980px){.tsuji-chara .chara{width:calc((100% / 3) - 10px);}}
@media screen and (max-width:640px){.tsuji-chara .chara{width:calc(50% - 10px);}}
@media screen and (max-width:480px){
.tsuji-chara{padding:5px !important;}
.tsuji-chara .chara .title-gold{font-size:11px;}}
@media screen and (max-width:370px){
.tsuji-chara .chara{width:calc(50% - 2.5px); margin:2.5px 0 !important;}
.tsuji-chara .chara:nth-child(odd){margin-right:2.5px !important;}
.tsuji-chara .chara:nth-child(even){margin-left:2.5px !important;}}

/*撃破*/
.tsuji-chara .chara .chara-inner span{
position:absolute;
top:5px;
right:5px;
display:block;
width:70px;
height:53px;
color:#fff;
background-image:url(/game/2dx/27/images/djdata/gekiha.png);
background-size:70px;
background-position:top right;
background-repeat:no-repeat;
z-index:3;}
@media screen and (max-width:750px){.tsuji-chara .chara .chara-inner span{background-size:50px;}}
@media screen and (max-width:640px){.tsuji-chara .chara .chara-inner span{background-size:70px;}}
@media screen and (max-width:480px){.tsuji-chara .chara .chara-inner span{background-size:50px;}}

/*ポップアップ*/
.white-popup-block{
width:100%;
max-width:640px;
background-color:#fff;
text-align:center;
padding:20px;
margin:0 auto;}
.white-popup-block strong{
display:block;}

.white-popup-block img{
display:block;
width:100%;
max-width:216px;
border:1px solid #000;
margin:30px auto;}

.white-popup-block p{
display:felx;
width:100%;
max-width:320px;
color:#000;
font-size:14px;
margin:0 auto 10px;}
.white-popup-block p span{display:inline-block;}
.white-popup-block p span:first-child{width:calc(100% - 200px); /*color:#fff; background-color:#333;*/ font-weight:bold; text-align:right; padding-right:10px;}
.white-popup-block p span:last-child{width:200px; /*background-color:#ccc;*/ text-align:left;}

.white-popup-block a{
display:block;
width:100%;
max-width:320px;
color:#fff;
background:#434343;
background:linear-gradient(to bottom, #434343 0%,#060606 100%);
font-size:16px;
font-weight:bold;
text-align:center;
text-decoration:none;
border-radius:10px;
padding:10px 0;
margin:30px auto 0;}
.white-popup-block a:hover{
cursor:pointer;
background:#ccc;
background:linear-gradient(to bottom, #ccc 0%,#888 100%);
border-radius:10px;}

@media screen and (max-width:320px){
.white-popup-block{padding:10px;}
.white-popup-block p{max-width:auto; font-size:11px;}
.white-popup-block p span:first-child{width:auto;}
.white-popup-block p span:last-child{width:auto;}}

/*
================================================================================================================
CSVダウンロード
================================================================================================================
*/
#dl-style{/*width:70% !important;*/ font-size:13px;}
#dl-style form span{display:block; width:100%; color:#f00; text-align:center;}
#dl-style form .dl-select{display:flex; flex-wrap:wrap; width:100%; color:#000; margin-top:30px;}
#dl-style form .dl-select span{display:block; width:100%; color:#fff; background-color:#fe8f01; font-size:14px; font-weight:bold; margin-bottom:10px; padding:5px;}
#dl-style form .dl-select .submit_btn{width:48% !important; margin:1%;}

#dl-data{width:100%; text-align:center; margin:10px auto 0;}
#dl-data textarea{width:100% !important; min-height:300px; border:1px solid #000; padding:20px;}
#dl-data span{display:block; width:100%; color:#fff; background-color:#0084ff; font-size:13px; text-align:center; margin-top:10px; padding:5px;}
#dl-data .submit_btn{width:30% !important; margin:20px auto 0;}

@media screen and (max-width:640px){
#dl-style,#dl-data{width:100% !important; text-align:left !important;}
#dl-style form span,#dl-data span{text-align:left;}
#dl-style form .dl-select span{text-align:center;}
#dl-data .submit_btn{width:100% !important;}}

/*
================================================================================================================
行脚
================================================================================================================
*/
/*行脚ヒストリ－*/
table#visit-color{max-width:300px; background-color:#fff; margin:0 auto;}
table#visit-color th{background-color:#333; color:#fff;}
table#visit-color th,
table#visit-color td{width:50%; text-align:center; border:1px solid #000; padding:5px 0;}

table#visit-color tr:nth-child(odd){background-color:#ccc;}

table#visit-color tr:nth-child(2) td:nth-child(2){background-color:#B5FF4B;}
table#visit-color tr:nth-child(3) td:nth-child(2){background-color:#71E9FF;}
table#visit-color tr:nth-child(4) td:nth-child(2){background-color:#FFC000;}
table#visit-color tr:nth-child(5) td:nth-child(2){background-color:#FF5353;}
table#visit-color tr:last-child td:nth-child(2){background-color:#FD80FF;}