#main{background:#eff5fc;}
.main-inner{padding:0 !important; margin:20px auto 0;}
@media screen and (max-width:640px){.main-inner{margin:10px auto 0;}}
@media screen and (max-width:480px){.main-inner > .box.text:first-child{padding:30px 20px !important;}}

h4{margin:0 auto !important;}
.tab-sub h4:first-child{margin-top:40px !important;}

.main-inner.radius{min-height:48vh;}

/*
================================================================================================================
概要ページ
================================================================================================================
*/
.title-area{position:relative; text-align:center; border-top:1px solid rgba(9,0,51,.3); border-bottom:1px solid #090033; padding:20px 10px; overflow:hidden;}
.title-area::before{
display:block;
content:"";
position:absolute;
top:-10px;
left:-10px;
width:calc(100% + 20px);
height:calc(100% + 20px);
background-image:url(../img/entry/bg.jpg);
background-position:center;
background-size:cover;
filter:blur(4px);}
.title-area > *{position:relative; z-index:2;}
.title-area > p{filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 3px #fff) drop-shadow(0 0 10px #fff);}

.title-area img{width:90%; max-width:600px;}
@media screen and (max-width:480px){
.title-area{padding:10px;}
.title-area img{width:80%;}}

/*スケジュール*/
.step .cat{color:#090033; background:#cce6ff;}
.step .cat strong{color:#fff;}

/*汎用入れ子*/
.box{line-height:180%;}
.box > .cat{background:rgba(255,255,255,.7); border:1px solid rgba(9,0,51,.2); border-radius:10px; padding:10px;}
.box > .cat + .cat{margin-top:20px;}
.box > .cat > strong,.box > .cat > em{display:block; position:relative; font-family:'Noto Sans JP', sans-serif;}
.box > .cat > strong{
font-size:18px;
text-align:center;
border-radius:10px;
border:2px solid;
padding:5px;
margin:0 auto 15px;}
.box > .cat > em{font-size:16px; padding-left:15px; margin:20px auto 5px;}
.box > .cat > em::before{
display:block;
content:"";
position:absolute;
top:calc(50% - 2px);
left:-10px;
width:20px;
height:4px;
background:#ff9600;}

@media screen and (max-width:480px){
.box > .cat > strong{font-size:16px;}
.box > .cat > em{font-size:15px;}}

/*課題曲リスト*/
ul.music-list{display:flex; flex-wrap:wrap; background:rgba(255,255,255,.7); border:1px solid; border-top:none;}
ul.music-list > li{display:flex; /*background:#fffddc;*/ align-items:center; border-top:1px solid; padding:5px;}
ul.music-list > li p{width:100%;}
ul.music-list > li:nth-child(odd){width:70%; border-right:1px solid;}
ul.music-list > li:nth-child(even){width:30%; text-align:center;}
ul.music-list > li:nth-child(1),
ul.music-list > li:nth-child(2){background:#ffc000; font-weight:bold;}
ul.music-list > li:nth-child(1) p,
ul.music-list > li:nth-child(even) p{text-align:center;}
@media screen and (max-width:370px){
ul.music-list > li:nth-child(odd){width:calc(100% - 110px);}
ul.music-list > li:nth-child(even){width:110px; text-align:center;}}

/*課題曲リスト - 予選ラウンド期間見出し*/
ul.primary-date{color:#fff; background:#2d00ff; font-family:'Zen Kaku Gothic New', sans-serif; border:2px solid #090033; border-radius:10px; padding:0 5px; margin:10px auto; overflow:hidden;}
ul.primary-date > li{text-align:center; padding:5px;}
ul.primary-date > li + li{border-top:1px solid #090033;}
ul.primary-date > li:first-child{font-weight:bold; font-size:17px;}
ul.music-list + ul.primary-date{margin-top:20px;}

/*表*/
ul.cell-2{display:flex; width:100%; max-width:300px; border:1px solid; border-top:none; margin:0 auto 0 0; flex-wrap:wrap;}
ul.cell-2 li{display:flex; width:50%; text-align:center; border-top:1px solid; padding:5px; align-items:center; justify-content:center;}
ul.cell-2 li:nth-child(odd){background:rgba(9,0,51,.2); font-weight:bold; border-right:1px solid;}
@media screen and (max-width:370px){
ul.cell-2 li{width:100% !important;}
ul.cell-2 li:nth-child(odd){border-right:none;}}

ul.cell-3{display:flex; border:1px solid; border-top:none; flex-wrap:wrap;}
ul.cell-3 li{display:flex; text-align:center; border-top:1px solid; padding:5px; align-items:center; justify-content:center;}
ul.cell-3 li:nth-child(3n-2){width:50px; background:rgba(9,0,51,.2); font-weight:bold;}
ul.cell-3 li:nth-child(3n-1){border-left:1px solid; border-right:1px solid;}
ul.cell-3 li:not(:nth-child(3n-2)){width:calc((100% - 50px) / 2);}

/*
================================================================================================================
ファイナリスト
================================================================================================================
*/
#finalist{width:100%; max-width:800px; margin:0 auto;}
#finalist .cat{background:#ffc000; border:2px solid; border-radius:10px; padding:20px; margin:0 auto;}
#finalist .cat + .cat{margin-top:20px;}
#finalist .cat > ul{
display:flex;
font-family:'Noto Sans JP', sans-serif;
font-weight:700;
border-bottom:3px solid;
/*padding:0 0 10px;*/
padding:0 0 5px;
margin:0 auto 10px;
flex-wrap:wrap;
align-items:flex-end;}
#finalist .cat > ul li:first-child{width:100%; line-height:120%; font-size:15px; margin-bottom:5px;}
#finalist .cat > ul li:nth-child(2){font-size:30px;}
#finalist .cat > ul li:nth-child(3){width:100%; font-size:12px; /*line-height:12px;*/ font-weight:400;}
#finalist .cat > ul li:nth-child(3)::before{content:"(";}
#finalist .cat > ul li:nth-child(3)::after{content:")";}
@media screen and (max-width:640px){
#finalist .cat{padding:10px;}
#finalist .cat + .cat{margin-top:10px;}
#finalist .cat > ul{border-bottom:2px solid;}
#finalist .cat > ul li:first-child{font-size:14px;}
#finalist .cat > ul li:nth-child(2){font-size:22px;}
#finalist .cat > ul li:nth-child(3){font-size:11px; /*line-height:11px;*/}}
@media screen and (max-width:480px){
#finalist .cat > ul li:first-child{font-size:11px;}
#finalist .cat > ul li:nth-child(2){font-size:17px;}
#finalist .cat > ul li:nth-child(3){font-size:10px;}}

/*ページ先頭*/
#finalist .text{text-align:center;}
@media screen and (max-width:370px){#finalist .text{font-size:13px;}}

/*ページ先頭リンク*/
#finalist .btn-link{max-width:350px !important; margin:15px auto 30px !important;}
@media screen and (max-width:420px){#finalist .btn-link{width:100% !important;}}
@media screen and (max-width:370px){#finalist .btn-link{font-size:14px;}}

/*部門*/
#finalist .cat + .primary-date{margin-top:50px;}
@media screen and (max-width:640px){#finalist .cat + .primary-date{margin-top:30px;}}

/*チーム戦*/
#finalist.team .primary-date{padding:15px;}
#finalist.team .primary-date li{text-align:left;}
#finalist.team .primary-date li:nth-child(2){font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;}
#finalist.team .group{background:#ffc000; border:2px solid; border-radius:10px; overflow:hidden;}
#finalist.team .group + .group{margin-top:30px;}
#finalist.team .group .cat{border:none; background:transparent; border-radius:0;}
#finalist.team .group .cat:first-child{color:#fff; background:#2d00ff; border-bottom:2px solid #090033 !important;}
#finalist.team .group .cat:nth-child(2){border-top:none !important;}
#finalist.team .group .cat + .cat{border-top:1px dashed rgba(9,0,51,.3); margin-top:0;}

#finalist.team .group .cat:first-child ul{border-bottom:none !important; padding:0 !important; margin:0 auto !important;}
#finalist.team .group .cat:first-child p{display:none;}

/*トーナメント表*/
#finalist #tournament{max-width:980px; margin:20px auto;}
#finalist #tournament img{width:100%; border:1px solid;}/*
@media screen and (max-width:640px){#finalist #tournament{padding:10px 0;}}
@media screen and (max-width:420px){#finalist #tournament{padding:5px 0;}}*/

/*
================================================================================================================
チャンピオンコメント
================================================================================================================
*/
.champion{
display:flex;
background:#ffc000;
font-family:'Noto Sans JP', sans-serif;
border:2px solid;
border-radius:10px;
padding:20px;
margin:0 auto;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;}
.champion + .champion{margin-top:20px;}
.champion > p{width:calc(40% - 10px);}
.champion > p img{width:100%; border:1px solid;}
.champion > ul{width:calc(60% - 10px);}
.champion > ul li:nth-child(2){font-size:30px; border-bottom:3px solid; padding-bottom:5px; margin:5px auto 10px;}
.champion > ul li:not(:last-child){font-weight:700;}

.champion.team > ul li:nth-child(2){padding-bottom:10px;}
.champion:not(.team) > ul li:nth-child(2)::after{display:inline-block; content:"選手"; font-size:16px; margin-left:5px;}

@media screen and (max-width:980px){
.champion{max-width:500px;}
.champion > *{width:100% !important;}
.champion > p{margin:0 auto 10px;}
.champion > ul li:nth-child(3){font-size:13px;}
.champion:not(.team) > ul li:nth-child(1),
.champion:not(.team) > ul li:nth-child(2),
.bg .champion.team > ul li:nth-child(2){text-align:center;}}
@media screen and (max-width:640px){.champion{padding:10px;}}
@media screen and (max-width:480px){
.champion > ul li:nth-child(2){font-size:24px;}
.champion > ul li:nth-child(3){font-size:12px;}
.champion:not(.team) > ul li:nth-child(2)::after{font-size:14px;}}

@media screen and (max-width:480px){.ccj .champion > ul li:nth-child(2){font-size:22px;}}
@media screen and (max-width:640px){.ccj .champion > ul li:nth-child(2){font-size:17px;}}

/*
================================================================================================================
リザルト
================================================================================================================
*/
#final .movie{max-width:640px; border:1px solid;}
#final .movie + .movie{margin-top:30px;}

#result .cat{padding:15px 10px;}
#result .cat + .primary-date{margin-top:40px;}
#result .cat > strong{margin: 0 auto 10px;}
#result .cat > strong:not(:first-child){margin-top:60px;}
#result .cat > strong + em{margin-top:0;}
#result .cat > strong:not(:first-child)::before{
position:absolute;
content:"";
top:-30px;
left:-10px;
display:block; width:calc(100% + 20px); height:1px; border-top:1px solid rgba(9,0,51,.2);}
@media screen and (max-width:480px){
#result .cat > strong:not(:first-child){margin-top:40px;}
#result .cat > strong:not(:first-child)::before{top:-22px;}}

#result dl{display:flex; line-height:140%; font-size:12px; border:1px solid; border-top:none; margin:0 auto; flex-wrap:wrap;}
#result dl > *{display:flex; text-align:center; border-top:1px solid; padding:5px; align-items:center; justify-content:center; flex-wrap:wrap;}
#result dl dt{width:100px; background:rgb(255,192,0,.5);}
#result dl dt + dd{border-left:1px solid;}
#result dl dd + dd{border-left:1px solid;}
#result dl dd span{display:block; width:100%; font-size:11px; border-top:1px dotted rgba(9,0,51,.2); padding-top:5px; margin-top:2px;}

#result dl.head{font-size:11px; border-bottom:none !important; margin:10px auto 0 !important;}
#result dl.head > *{background:#ff9600 !important;}
#result dl.score dt.win::before{displau:inline-block; content:"★"; color:#fd2b18; margin-right:3px;}

#result dl.music dd{font-size:14px;}
#result dl.music dd p{width:100%; padding:3px 0;}
#result dl.music dd span:not(.final)::before{display:inline-block; content:"選曲："; margin-right:2px;}

#result dl.music dd{width:calc(100% - 100px);}
#result dl.score dd{width:calc((100% - 100px) / 3);}
#result dl.score dd:nth-child(6n){width:60px;}
#result dl.score.final dd{width:calc((100% - 100px) / 4);}


@media screen and (max-width:800px){
#result dl.music > *{width:100% !important;}
#result dl.music dd{font-size:13px;}
#result dl.music dt + dd{border-left:none;}}
@media screen and (max-width:530px){
#result dl{font-size:11px;}
#result dl:not(.head) > *{padding:3px;}
#result dl dd span{font-size:10px; padding-top:3px; margin-top:0;}
#result dl.music dd{font-size:11px;}
#result dl.music dd p{padding:0;}
.bg #result dl dt{width:110px;}
.bg #result dl.score dd{width:calc((100% - 110px) / 3);}}
@media screen and (max-width:380px){
#result dl.head{font-size:9px;}}

@media screen and (max-width:480px){
.scroll{overflow-x: scroll; white-space:nowrap;}
.scroll dl{width:110vw !important;}}
@media screen and (max-width:380px){
.scroll dl{width:130vw !important;}}


#menu-title,#menu-tab,.menu-tab-sub{
display:flex;
width:100%;
font-family:'Noto Sans JP', sans-serif;
font-weight:700;
align-items:center;
margin:0 auto;}

#menu-tab,.menu-tab-sub{width:calc(100% - 40px); max-width:1200px; justify-content:center; margin:0 auto;}
@media screen and (max-width:640px){#menu-tab,.menu-tab-sub{width:calc(100% - 20px);}}


/*
=========================
タブ切り替え
=========================
*/
#menu-tab{
color:#fff;
font-size:22px;
background:#090033;
border-radius:0 0 50px 50px;
overflow:hidden;}
#menu-tab li{padding:15px 0; cursor:pointer;}
#menu-tab li p{position:relative; text-align:center; padding:5px 0;}
#menu-tab li:not(:first-child) p{border-left:1px solid #fff;}

#menu-tab li p::after{
display:block;
content:"";
position:absolute;
bottom:-15px;
left:10px;
width:calc(100% - 20px);
height:0;
background:#ff1493;
transform-origin:bottom;
transition:all .2s ease;
opacity:0;
z-index:3;}
#menu-tab li:hover p::after,
#menu-tab li.active p::after{opacity:1; height:5px;}

#menu-tab li:nth-child(1) p::before{content:"概要";}
#menu-tab li:nth-child(2) p::before{content:"予選ラウンド";}
#menu-tab li:nth-child(3) p::before{content:"決勝ラウンド";}

#menu-tab li.soon{cursor: auto;pointer-events: none;}
#menu-tab li.soon p{color:#666;}


@media screen and (max-width:800px){#menu-tab{font-size:18px;}}
@media screen and (max-width:640px){#menu-tab{border-radius:0 0 30px 30px;}}
@media screen and (max-width:480px){#menu-tab{font-size:16px; border-radius:0 0 20px 20px;}}
@media screen and (max-width:420px){
#menu-tab{font-size:15px;}
#menu-tab li{padding:10px 0;}
#menu-tab li p::after{bottom:-10px;}}
@media screen and (min-width:390px){#menu-tab li{width:calc(100% / 3);}}
@media screen and (max-width:389px){#menu-tab li p{padding:5px 12px;}}
/*
=========================
タブ切り替え-サブ
=========================
*/
.menu-tab-sub{color:#090033; background:#fff; font-size:18px; border-radius:30px; border:1px solid rgba(9,0,51,.3); margin-top:20px;}
.menu-tab-sub li{cursor:pointer; padding:10px 0;}
.menu-tab-sub li p{text-align:center; padding:0 20px; transition:all .2s ease;}
.menu-tab-sub li:not(:first-child) p{border-left:1px solid #090033;}
.menu-tab-sub li:hover p,
.menu-tab-sub li.active p{color:#fd2b18;}

.menu-tab-sub li.soon{cursor: auto;pointer-events: none;}
.menu-tab-sub li.soon p{color:#999;}

.menu-tab-sub li:nth-child(1) p::before{content:"ルール";}
#round .menu-tab-sub li:nth-child(2) p::before{content:"ランキング";}
#final .menu-tab-sub li:nth-child(2) p::before{content:"ファイナリスト";}
#final .menu-tab-sub li:nth-child(3) p::before{content:"リザルト";}

@media screen and (max-width:640px){.menu-tab-sub{font-size:16px; margin-top:10px;}}
@media screen and (max-width:480px){
.menu-tab-sub{font-size:14px;}
.menu-tab-sub li p{padding:0 10px;}}
