*, *:before, *:after{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;}

.cl_common_bloc_inner{
  background-color:rgba(245, 245, 245, 0.95) !important;
  padding-bottom:30px !important;
}
.cl_player_info_template{
  padding:10px 0;
}
.cl_license+.cl_license::before {
  content: "/"; 
}
/*
================================================================================================================
PLAY HISTORY
================================================================================================================
*/
#id_play_hist .cl_notice span{
  display:block;
  width:100%;
  text-align:center;
}
#id_play_hist .cl_notice span:first-child{
  color:#000;
  font-size:16px;
}
#id_play_hist .cl_notice span:last-child{
  color:#ff00ff;
  font-size:13px;
}
.cl_hist_data{
  width:45%;
  max-width:470px;
  background-color:#ffb5d6;
  border-radius:10px;
  padding-bottom:20px;
  margin:20px auto;
}
/*プレー日時･店舗*/
.cl_hist_data .cl_hist_detail{
  width:100%;
  color:#fff;
  background-color:#ff0071;
  font-size:13px;
  border-radius:10px 10px 0 0;
  border-bottom:1px solid #ff0071;
  padding:6px 13px;
  margin-bottom:13px;
  line-height:18px;
}
.cl_hist_data .cl_hist_detail div span{
  font-weight:bold;
  padding-right:5px;
  display:inline-block;
}
.cl_hist_data .cl_hist_detail div div{
  display:inline-block;
}
/*楽曲情報*/
.cl_hist_data .cl_hist_music{
  margin-bottom:5px;
}
.cl_hist_data .cl_hist_music span{
  display:block;
  width:100%;
  text-align:center;
  font-size:11px;
}
.cl_hist_data .cl_music_title_jacket img{
  max-width:160px;
  margin-bottom:10px;
}
.cl_hist_data .cl_hist_music .cl_music_title_name{
  font-size:14px;
  font-weight:bold;
  line-height:11px;
}
.cl_hist_data .cl_hist_data_lv{
  width:96%;
  border-radius:5px;
  padding:6px 5px 10px;
  margin:0 auto;
  font-weight:bold;
  text-align:center;
}
.cl_hist_data .cl_hist_data_lv span{
  margin-left:20px;
}
.cl_hist_data .cl_hist_lv{
  width:94%;
  padding:0px 5px 10px;
  margin:0px auto;
}
.cl_hist_data .cl_hist_data_BASIC{
  background:#00b4ff;
}
.cl_hist_data .cl_hist_data_ADVANCED{
  background#ffcb00;
}
.cl_hist_data .cl_hist_data_MASTER{
  background:#ff0000;
}
.cl_hist_data .cl_hist_data_MASTER .cl_hist_data_lv,
.cl_hist_data .cl_hist_data_ADVANCED .cl_hist_data_lv,
.cl_hist_data .cl_hist_data_BASIC .cl_hist_data_lv{
  color:#fff;
}

/*テーブル装飾 共通*/
.cl_hist_data table{
  width:98%;
  margin:0 auto;
}
/*テーブル装飾 スコア部分*/
table.cl_player_one tr{
  border-bottom:1px dashed #b9b7b9;
}
table.cl_player_one tr:last-child{
  border-bottom:none;
}
table.cl_player_one td{
  background-color:rgba(255,255,255,0.8);
  font-size:13px;
}
table.cl_player_one td:first-child{
  text-align:left;
  border-right:1px solid #b9b7b9;
  padding:5px 17px;
  width:35%;
}
table.cl_player_one td:last-child{
  text-align:center;
}

.cl_hist_data .cl_hist_data_easy .cl_player_friend{
  color:#afadb9 !important;
  background-color:#f1f3f0 !important;
}
.cl_hist_data .cl_hist_data_normal .cl_player_friend{
  color:#afadb9 !important;
  background-color:#f2efe8 !important;
}

/*画像サイズ*/
.cl_hist_data .cl_grade_img{
  max-width:35px;
}
.cl_hist_data .cl_rank_img{
  width:100%; max-width:100px;
}

/*動画投稿ボタン*/
.cl_hist_data .cl_btn_post{
  width:65% !important;
  max-width:none !important;
}
.cl_hist_data .cl_btn_post a{padding:5px; font-weight:bold; font-size:13px;}
.cl_hist_data .cl_btn_post a img{width:40px;}

/*.cl_hist_data .cl_btn_post img{width:38px; margin-right:10px;}*/


/* ページャー */
.cl_music_pager {
    width: 100%;
    height: 30px;
    text-align: center;
    margin: 20px auto 0;
}
.cl_music_pager #id_music_pager_his {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
}

/* ライセンス表記 */
.cl_music_license_his {
    width: 96%;
    margin: 20px auto 0;
}
.cl_music_license_his #id_music_license_his{
    color: #606060;
    font-size: 10px;
    text-align:left;
}

@media screen and (max-width:800px){
  .cl_hist_data{
    width:95%;
  }
}

@media screen and (max-width:640px){
  #id_play_hist .cl_notice span{
    width:90%;
    text-align:left;
    margin:0 auto;
  }
  #id_play_hist .cl_notice span:first-child{
    font-size:14px;
  }
  #id_play_hist .cl_notice span:last-child{
    font-size:12px;
  }
  .cl_hist_data{
    width:95%;
  }
  .cl_hist_data .cl_hist_data_lv{
    padding:10px 2px 8px;
  }

  .cl_hist_diff td:first-child{
    width:20%;
  }
  .cl_hist_diff td:nth-child(2){
    width:60%; text-align:left;
  }
  .cl_hist_diff td:last-child{
    width:20%; padding:3px 5px;
  }
  .cl_hist_diff td:last-child img{
    max-width:60px;
  }
}

@media screen and (max-width:480px){
  .cl_hist_data .cl_btn_post{
    width:80% !important;
  }
}
/*
================================================================================================================
DANCER INFO
================================================================================================================
*/
.cl_dancer_info_card{
  position:relative;
  text-align:center;
  width:100%;
  max-width:259px;
  margin:20px auto 0;
  box-shadow:6px 6px 0 #2d003b;
  transform:rotate(5deg);
}
.cl_dancer_info_card .card_bd{
  width:100%;
}
.cl_dancer_info_card .cl_pleyer_avatar{
  width:100%;
  position:absolute;
  bottom:0;
  left:0;
  z-index:1;
}
.cl_dancer_info_card .cl_pleyer_avatar img{
  width:100%;
  max-width:259px;
}
.cl_dancer_info_card .cl_player_name{
  color:#000;
  font-weight:bold;
  position:absolute;
  bottom:30px;
  width:100%;
  font-size:24px;
  text-align:center;
}
.cl_dancer_info_card .cl_dancer_id{
  color:#000;
  font-weight:bold;
  position:absolute;
  bottom:0;
  width:100%;
  font-size:15px;
  text-align:center;
}
.cl_dancer_info_card .cl_player_name,
.cl_dancer_info_card .cl_dancer_id{
  height:30px;
  color:#fff;
  line-height:30px;
  text-shadow:0 0 2px rgba(0,0,0,.6) , 0 0 0 rgba(0,0,0,.3) , 0 1px 0 rgba(0,0,0,.3) , 1px 0 0 rgba(0,0,0,.3) , 1px 1px 0 rgba(0,0,0,.3) , 2px 2px 0 rgba(0,0,0,.3) , 3px 3px 0 rgba(0,0,0,.3);
  z-index:3;
}

.cl_dancer_info_card,
.cl_dancer_info_card .card_bd,
.cl_dancer_info_card .cl_pleyer_avatar img{border-radius:22px;}

.cl_dancer_info_card::before{
  display:block;
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:80px;
  background:linear-gradient(to bottom, rgba(255,0,113,0) 0%,rgba(255,0,113,.8) 100%);
  border-radius:0 0 22px 22px;
  z-index:2;}

.cl_dancer_info_block ul{
  display:flex;
  flex-wrap:wrap;
  width:90%;
  max-width:400px;/*
  border-bottom:1px solid #2d003b;*/
  font-size:15px;
  font-weight:bold;
  text-align:center;
  margin:40px auto 20px;
  box-shadow:6px 6px 0 #2d003b;
}
.cl_dancer_info_block ul li{padding:10px 5px;}
.cl_dancer_info_block ul li:nth-child(even){
  width:50%;
  background-color:#fff;/*
  border-top:1px solid #2d003b;
  border-left:1px solid #2d003b;
  border-right:1px solid #2d003b;
  padding:5px;
  font-size:13px;*/
}
.cl_dancer_info_block ul li:nth-child(odd){
  width:50%;
  color:#fff;
  background-color:#ff0071;/*
  border-top:1px solid #2d003b;
  border-left:1px solid #2d003b;
  padding:5px;
  font-size:13px;*/
}

@media screen and (max-width:480px){
  .cl_dancer_info_card,
  .cl_dancer_info_card .cl_pleyer_avatar img{
    max-width:200px;
  }
}

/*
================================================================================================================
MUSIC DATA
================================================================================================================
*/
#music_data{
  display:flex;
  flex-wrap:wrap;
  width:calc(100% - 20px);
  border:1px solid #000;
  border-top:none;
  margin:0 auto;
}
  
#music_data li{
  width:25%;
  border-top:1px solid #000;
  border-left:1px solid #000;
}

/*セル*/
#music_data .cl_music_data{
  /*background:#cccccc;*/
}
#music_data .cl_music_basic{
  background:#ccf0ff;
}
#music_data .cl_music_advanced{
  background:#efdb90;
}
#music_data .cl_music_master{
  background:#ffcccc;
}

/*セル見出し*/
#music_data li:not(.cl_detail){
  text-align:center;
  font-weight:bold;
  font-size:13px;
  padding:5px 0;
}
#music_data li:first-child{
  background:#000;
  color:#fff;
}
#music_data li:nth-child(2){
  background:#00b4ff;
}
#music_data li:nth-child(3){
  background:#ffcb00;
}
#music_data li:nth-child(4){
  background:#ff0000;
}

/*楽曲情報*/
#music_data li.cl_music_data{
  border-left:none;
}
#music_data li.cl_music_data.cl_detail{
  display:flex;
  align-items:center;
  padding:5px;
}
#music_data li .jk_img{
  width:50px;
  margin-right:10px;
}
#music_data li .jk_img img{
  width:100%;
}

#music_data .id_popup_btn{display:block; width:calc(100% - 60px); color:#ff0071;}
#music_data .id_popup_btn:hover{text-decoration:none;}
#music_data li .m_title{
  font-size:12px;
  font-weight:bold;
}

/*スコア詳細*/
.cl_music_basic.cl_detail,
.cl_music_advanced.cl_detail,
.cl_music_master.cl_detail{
  text-align:center;
}
.cl_detail:not(.cl_music_data) > div{
  height:30px; line-height:30px;
}
.cl_music_basic.cl_detail > div + div{
  border-top:1px solid #b7d8e5;
}
.cl_music_advanced.cl_detail > div + div{
  border-top:1px solid #d7c581;
}
.cl_music_master.cl_detail > div + div{
  border-top:1px solid #e5b7b7;
}

#music_data .rank img{
  width:100%;
  max-width:121px;
}
#music_data .grade img{
  width:100%;
  max-width:30px;
}

@media screen and (max-width:640px){
  #music_data li.cl_music_data:not(.cl_detail){
    display:none;
  }
  #music_data li.cl_music_data{
    width:100%;
  }
  #music_data li.cl_music_basic,
  #music_data li.cl_music_advanced,
  #music_data li.cl_music_master{
    width:calc(100% / 3);
  }

  #music_data li.cl_music_data.cl_detail{
    padding:5px 10px;
  }
  #music_data li.cl_music_basic{
    border-left:none;
  }
}

/*
================================================================================================================
MUSIC DATA ポップアップ
================================================================================================================
*/
#id_music_data_info{
  padding:20px;
  background:#e9e9ea;
  border-radius:20px;
}

/*楽曲情報*/
#id_music_data_info #p_music_data ul{
  width:100%;
  /*display:flex;
  flex-wrap:wrap;
  justify-content: center;
  align-items:center;*/
  margin:0 auto 10px;
}
#id_music_data_info #p_music_data li{
 width:100%;
 text-align:center;
}
#id_music_data_info #p_music_data li:first-child img{
  width:100px;
}
#id_music_data_info #p_music_data li:last-child{
  color:#ff0071;
}
#id_music_data_info .p_music_title{
  font-weight:bold;
}
#id_music_data_info .p_artist{
  font-size:12px;
}
#id_music_data_info #p_music_data .title_jacket img{
  width:50px;
}

/*スコア*/
#id_music_data_info #p_data_detail{
  display:flex;
  flex-wrap:wrap;
  width:100%;
  font-size:14px;
  justify-content:center;
}
#id_music_data_info #p_data_detail > div{
  width:calc(100% / 3);
  border:1px solid #000;
}

/*セル見出し*/
#p_data_detail > div > div{
  color:#000;
  font-weight:bold;
  text-align:center;
}
#p_data_detail .title{
  font-size:18px;
  padding:5px 0 0;
}
#p_data_detail .lv{
  color:#fff;
  border-bottom:1px solid #000;
}

#id_music_data_info .detail_basic .title,
#id_music_data_info .detail_basic .lv{
  background:#00b4ff;
}

#id_music_data_info .detail_advanced .title,
#id_music_data_info .detail_advanced .lv{
  background:#ffcb00;
}
#id_music_data_info .detail_master .title,
#id_music_data_info .detail_master .lv{
  background:#ff0000;
}

/*セル*/
#id_music_data_info .detail_basic{
  background:#ccf0ff;
}
#id_music_data_info .detail_advanced{
  background:#efdb90;
}
#id_music_data_info .detail_master{
  background:#ffcccc;
}

/*スコア詳細*/
#id_music_data_info #p_data_detail ul{
  display:flex;
  flex-wrap:wrap;
}
#id_music_data_info #p_data_detail ul li{
  width:100%;
  height:40px;
  line-height:40px;
  padding:0 20px;
}
#p_data_detail ul li{
  display:flex;
  justify-content:space-between;
}
#p_data_detail ul li > div:first-child{
  font-weight:bold;
}
#p_data_detail .detail_basic ul li > div:first-child{
  color:#004866;
}
#p_data_detail .detail_advanced ul li > div:first-child{
  color:#665100;
}
#p_data_detail .detail_master ul li > div:first-child{
  color:#660000;
}
.detail_basic li + li{
  border-top:1px solid #b7d8e5;
}
.detail_advanced li + li{
  border-top:1px solid #d7c581;
}
.detail_master li + li{
  border-top:1px solid #e5b7b7;
}

#p_data_detail .rank img{
  height:30px;
}

#id_music_data_info #id_music_license{
  font-size:10px;
  color:#333;
  margin:10px auto 0;
}

@media screen and (max-width:980px){
  #id_music_data_info #p_data_detail{
    font-size:13px;
  }
  #id_music_data_info #p_data_detail ul li{
    padding:0 10px;
  }
}

@media screen and (min-width:801px){
  #id_music_data_info #p_data_detail > div + div{
    border-left:none !important;
  }
}

@media screen and (max-width:800px){
  #id_music_data_info #p_data_detail > div{
    width:100%;
    max-width:400px;
  }
  #id_music_data_info #p_data_detail > div + div{
    border-top:none !important;
  }
}

@media screen and (max-width:370px){
  #id_music_data_info{
    padding:10px;
    border-radius:10px;
  }
}
.disp_none{
  display:none !important;
}
/*
================================================================================================================
PLAYER NAME変更
================================================================================================================
*/
#dancer_name_inner{width:calc(100% - 40px); color:#2d003b; background:#fcfcfc; border:5px solid #2d003b; padding:20px; margin:0 auto 5px;}
#dancer_name_inner .text{font-weight:bold;}
#dancer_name_inner .notice{/*background:#fd3b5c;*/ color:#fd3b5c; font-size:13px; padding:10px; margin:5px auto;}
#dancer_name_inner .alert{color:#fd3b5c; font-weight:bold;}
#dancer_name_inner .alert.change{font-size:14px; margin:10px auto 0;}

#dancer_name_inner .name{display:flex; color:#2d003b; font-weight:bold; align-items:center; padding:10px; border-radius:10px; margin:20px auto 0;}
#dancer_name_inner .name p:first-child{color:#fff; font-size:15px; border-radius:5px; padding:5px 10px; margin-right:10px;}
#dancer_name_inner .name p:last-child{font-size:20px;}

#dancer_name_inner .name.now{background:#98d5ff;}
#dancer_name_inner .name.new{background:#fffa75;}
#dancer_name_inner .name.now p:first-child{background:#171915;}
#dancer_name_inner .name.new p:first-child{background:#502f17;}

@media screen and (max-width:500px){
#dancer_name_inner .name{flex-wrap:wrap; margin:10px auto 0;}
#dancer_name_inner .name p{width:100%; text-align:center;}
#dancer_name_inner .name p:first-child{margin:0 auto 10px;}}

#dancer_name_inner #dancer_name_input > p{line-height:150%;}

#dancer_name_inner textarea{width:190px; height:32px; font-size:20px; font-weight:bold; padding:5px;}
#dancer_name_inner .submit_btn{
display:block;
position:relative;
width:80%;
max-width:200px;
height:50px;
color:#fff;
background:#573062;
font-weight:bold;
font-size:18px;
border:none;
border-radius:3px;
box-shadow:none;
margin:20px auto 0;
transition:background .2s ease;}
#dancer_name_inner .submit_btn::after{
display:block;
content:"";
position:absolute;
right:20px;
top:calc(50% - 10px);
width:20px;
height:20px;
border-top:2px solid #fff;
border-right:2px solid #fff;
transform:rotate(45deg);
transition:right .2s ease;}
#dancer_name_inner .submit_btn:hover{cursor:pointer; background:#ff0171;}
#dancer_name_inner .submit_btn:hover::after{right:15px;}

