@charset "UTF-8";

body {
width:100%;
margin: 0 auto;
padding:0;
font-size: 18px;
font-weight: 300;
color: #FFF;
}
.float_bg {
width:100%;
height: 100%;
position: fixed!important;
margin: 0;
padding:0;
top:0;
bottom:0;
left:0;
right:0;
background-size:cover;
background-image: linear-gradient( -45deg, #CFC 25%, #BEB 25%, #BEB 50%, #CFC 50%, #CFC 75%, #BEB 75%, #BEB );
background-size: 20px 20px;
opacity:0.9;
}
h2, h3, h4, h5 {display: none;}
/*.wrapx{overflow: visible!important;}*/
/*
================================================================================================================
ベースページ
================================================================================================================
*/
#player_all{
top: 100%;
position:relative;
width:calc(100% - 72px);
max-width:800px;
padding:36px;
text-align:left;
margin:2% auto;
/*
background-image: url("../img/bg01.png");
background-size: 100%;
background-repeat: no-repeat;
*/
background:linear-gradient(0deg, rgba(115, 46, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 100%);
border-radius:16px;
-webkit-border-radius:16px;
-moz-border-radius:16px;
/*overflow: hidden;*/
}
#player{
width:68%;
margin-left:6%;
}
#player .name {
width:calc(100% - 0px);
position:relative;
margin-top:20px;
left:0%;
padding: 15px 10px 10px 10px;
border-top:solid 5px #E4A941;
border-bottom:solid 5px #E4A941;
border-image: linear-gradient(to right, #E4A941 0%, #BB9930 10%, #FFF1A8 25%, #FFF4BF 50%, #FFF1A8 75%, #BB9930 90%, #E4A941 100%);
border-image-slice: 1;
text-align:center;
color:#CFC;
box-shadow:0px 1px 0px #000;
z-index: 20;
display: table;
/*
background:url("../img/deco01.png"), url("../img/deco01.png"), url("../img/bg02.png");
background-position: top 2px right, bottom 2px left, center center;
background-repeat: no-repeat;
background-size: 55px, 55px, cover;
*/
}
#player .name p{
font-size:46px;
  line-height: 48px;
font-weight: bold;
  display: table-cell;
  vertical-align: middle;
  background: linear-gradient(45deg, #FFF1A8 16%, #BB9930 57%, #FFF4BF 90%);
  background: -webkit-linear-gradient(45deg, #FFF1A8 16%, #BB9930 57%, #FFF4BF 90%);
  background-size: 300% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gradientEffect 5.5s infinite alternate;
}
@keyframes gradientEffect {
  from {background-position: left}
  to {background-position: right}
}
@media all and (-ms-high-contrast: none) {
#player .name p{
  background:rgba(255,255,255,0.00);
  color:rgba(253,238,180,1.00);
}
}

#player .image {
width:100%;
padding: 0px;
margin: auto;
  pointer-events: none;
}
#player .image img {
width:280px;
position:absolute;
margin-left:58%;
top: 10px;
}
#player ul.data {
width:90%;
  padding: 30px 0 30px 0;
text-align:left;
  margin: 0 auto;
  list-style: none;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  z-index: 30;
}
#player ul.data li{
width:48%;
  background-color:rgba(0,0,0,0.00);
  margin: 1.5% 0;
font-size:14px;
list-style:14px;
text-align:left;
/*box-shadow:1px 1px 0px #000;*/
}
.box_a, .box_b {
    position: relative;
}
.box_b {
    padding:2px;
}
.box_a:before,.box_a:after,.box_b:before,.box_b:after{ 
    content:'';
    width: 8px;
    height: 8px;
    position: absolute;
    display: inline-block;
}
.box_a:before{
    border-left: solid 2px #FFD57A;
    border-top: solid 2px #FFD57A;
    top:0;
    left: 0;
}
.box_a:after{
    border-right: solid 2px #FFD57A;
    border-bottom: solid 2px #FFD57A;
    bottom:0;
    right: 0;
}
.box_b:before{
    border-right: solid 2px #FFD57A;
    border-top: solid 2px #FFD57A;
    top:0;
    right: 0;
}
.box_b:after{
    border-left: solid 2px #FFD57A;
    border-bottom: solid 2px #FFD57A;
    bottom:0;
    left: 0;
}
#player ul.data li .waku01{
width:calc(100% -4px);
border:solid 2px #E4A941;
border-image: linear-gradient(to top, #EBF4F5 0%, #C5D4D4 5%, #9DAAAA 25%, #4E585E 50%, #9DAAAA 75%, #C5D4D4 95%, #EBF4F5 100%);
border-image-slice: 1;
  background-color:rgba(0,0,0,1.00);
  margin:2px;
font-size:14px;
list-style:14px;
text-align:left;
box-shadow:1px 1px 0px #000;
}

#player ul.data li .waku02{
width:calc(100% - 0px);
  min-height: 30px;
border-top:solid 2px #350202;
border-bottom:solid 2px #700311;
border-left:solid 2px #350202;
border-right:solid 2px #700311;
background: -moz-linear-gradient(bottom, #a58181 0%, #8a4747 15%, #450303 40%, #450303 60%, #450303 70%, #8a4747 90%, #B43030 100%);
background: -webkit-linear-gradient(bottom, #a58181 0%, #8a4747 15%, #450303 40%, #450303 60%, #450303 70%, #8a4747 90%, #B43030 100%);
background: linear-gradient(to bottom, #a58181 0%, #8a4747 15%, #450303 40%, #450303 60%, #450303 70%, #8a4747 90%, #B43030 100%);
  margin:0px;
  padding: 3px;
font-size:14px;
list-style:14px;
text-align:left;
}
#player ul.data li .waku02{
display: flex;
min-height: 40px; 
}
#player ul.data li .waku02 .title_area{
width:calc(42% - 10px) ;
min-height: 40px;
display: table;
  font-size: 14px;
  line-height: 16px;
  font-weight: bold;
  text-align:center;
padding: 2px auto;
  color:#FFEAB1;
}
#player ul.data li .waku02 .text_area{
background-color:rgba(0,0,0,1.00);
width:calc(70% - 10px) ;
min-height: 40px;
display: table;
  font-size: 16px;
  line-height: 18px;
  font-weight: bold;
  text-align:center;
padding: 2px 2px;
  color:#FFFFFF;
}

#player ul.data li .waku02 .title_area p,
#player ul.data li .waku02 .text_area p{
  display: table-cell;
  vertical-align: middle;
}


#player .waku_profile{
width:calc(100% - 0px);
position: relative;
padding: 15px;
border:solid 0px #CFC;
/*
  background:
    url("../img/waku_top_left.png"),
    url("../img/waku_top_right.png"), 
    url("../img/waku_bottom_left.png"), 
    url("../img/waku_bottom_right.png"), 
    url("../img/waku_line_top.png"),
    url("../img/waku_line_bottom.png"), 
    url("../img/waku_line_left.png"), 
    url("../img/waku_line_right.png");
  background-position: top left, top right, bottom left, bottom right, top center, bottom center, left center, right center;
  background-repeat: no-repeat,no-repeat,no-repeat,no-repeat,repeat-x,repeat-x,repeat-y,repeat-y;
  background-size: 17px, 17px, 17px, 17px, 17px, 17px, 17px, 17px;
  */
  border-radius: 12px;
  z-index: 30;
  background-color: #FFFFFF;
}
#player .waku_profile .profile{
width:calc(100% - 0px);
padding: 10px;
height: 100px;
font-size:14px;
list-style:14px;
text-align:left;
  overflow-y:auto;
  color: #333;
  background-color: rgba(255,255,255,1.00);
}
#player .waku_profile .sousyoku{
  bottom:-10px;
  left:-24px;
  position: absolute;
width:calc(100% + 48px);
padding:0;
height: 38px;
background-color: rgba(255,200,200,0.00);
/*
background:
    url("../img/waku_sousyoku_left.png"),
    url("../img/waku_sousyoku_right.png");
  background-position:bottom left, bottom right;
  background-repeat: no-repeat,no-repeat;
  background-size: 84px, 84px;
*/
pointer-events: none;
}

#player .waku_profile + p{
margin-top:10px;
font-size:14px;
color:#FFF1A8;}


@media all and (max-width: 899px){
#player_all{
position:relative;
width:92%;
max-width:800px;
padding:4%;}
#player ul.data li .waku02 .title_area{
  font-size: 1.5vw;
  line-height: 1.7vw;
}
#player ul.data li .waku02 .text_area{
  font-size: 1.8vw;
  line-height: 2.0vw;
}
}

@media all and (max-width: 768px){
#player_all{
background-size: 156%;
background-position: left -14vw center;
padding: 2%;
}
#player{width:calc(100% - 2.8%); padding:1.8% 1.4% 1% 1.4%; margin:0% auto 0% auto; border-radius:6px;}
#player .title {
font-size:4.8vw;
line-height:4.8vw;
font-weight: bold;
top:0px;
left:0px;
padding-top:1%;
padding-bottom:1%;
border-bottom:solid 2px #CFC;
text-align:left;
color:#CFC;
}
#player .name{
margin-top:0;
background-size: 35px, 35px, cover;
border-top:solid 3px #E4A941;
border-bottom:solid 3px #E4A941;
}
#player .name p{
font-size:36px;
line-height: 38px;
}
#player .image img {
width:56%;
position:absolute;
margin :0 auto;
top: 90px;
margin-left:44%;
}
#player ul.data {
width:50%;
margin: 0 auto 0 5vw;
padding: 30px 0 30px 0;
}
#player ul.data li{
width:100%;
background-color:rgba(0,0,0,0.00);
margin: 1.5% 0;
font-size:14px;
list-style:14px;
text-align:left;
/*box-shadow:1px 1px 0px #000;*/
}
#player ul.data li .waku02{
min-height: 7vw;
}
#player ul.data li .waku02 .title_area{
width:38%;
font-size: 2.6vw;
line-height: 2.8vw;
font-weight: normal;
min-height: 7vw;
}
#player ul.data li .waku02 .text_area{
width:62%;
font-size: 3.0vw;
line-height: 3.2vw;
min-height: 7vw;
}
#player .waku_profile{
width:calc(100% - 0px);
padding: 10px;
background-size: 14px, 14px, 14px, 14px, 14px, 14px, 14px, 14px;
}
#player .waku_profile .profile{
font-size:12px;
}
#player .waku_profile .sousyoku{
bottom:-8px;
left:-12px;
position: absolute;
width:calc(100% + 24px);
padding:0;
height: 38px;
background-color: rgba(255,200,200,0.00);
background-size: 60px, 60px;
pointer-events: none;
}
}

/*
================================================================================================================
非表示
================================================================================================================
*/
#player_all{opacity:1;}
/*.youtube01 {display:none;}*/


.mfp-close-btn-in .mfp-close {
position: fixed;
top: 10px;
right: 10px;
color: rgba(255,255,255,0.90)!important;
background: rgba(255,152,51,1.00)!important;
font-size: 50px;
border-radius: 25px;
opacity: 1.0!important;
z-index: 99946!important;
}
.mfp-close-btn-in .mfp-close:hover {
color: rgba(255,255,255,0.90)!important;
background: rgba(255,51,190,1.00)!important;
font-size: 50px;
border-radius: 24px;
}

@media all and (max-width: 768px){
.mfp-close-btn-in .mfp-close {
position:absolute;
top: 0px;
right: 5px;
color: rgba(255,255,255,0.90)!important;
background: rgba(255,152,51,1.00)!important;
font-size: 24px;
border-radius: 12px;
opacity: 1.0!important;
z-index: 99946!important;
}
.mfp-close {
    width: 22px;
    height: 22px;
    line-height: 22px;
}
.mfp-close-btn-in .mfp-close:hover {
  font-size: 24px;
  border-radius: 12px;
}
}

.popup-iframe{
background-color: rgba(00,00,00,0.00)!important;
    padding:0px!important;
    border-radius:0px!important;
}

/*popupのスクロールガタツキ防止*/
.mfp-wrap {overflow-y: scroll!important;}

.mfp-wrap::-webkit-scrollbar { 
  display: none!important;;
}