
.box_outer {
  overflow:  hidden; 
  position: relative;
  text-align: center;
  margin: 3px auto;
  top: 10%;
  background: rgba(0,0,0,0);
  z-index: 10;
  width:80%;
  padding: 0.3em 1em;
  opacity: 0;
}

.box_outer2 {
overflow:  hidden; 
position: relative;
text-align: center;
margin: 3px auto;
top: 0;
background: rgba(0,0,0,0);
z-index: 10;
width:80%;
padding: 0.3em 1em;
opacity: 0;
left: 2%;
float: left;
}
.box_outer3 {
overflow:  hidden; 
position: relative;
text-align: center;
margin: 3px auto;
top: 0;
background: rgba(0,0,0,0);
z-index: 10;
width:15%;
padding: 0.3em 1em;
opacity: 0;
left: 2%;
float: left;
}
.box_outer_tier {
overflow:  hidden; 
position: relative;
text-align: center;
margin: 3px auto;
top: 0;
background: rgba(0,0,0,0);
z-index: 10;
width:65%;
padding: 0.3em 1em;
opacity: 0;
left: 2%;

float: left;
}

.box_outer_count {
overflow:  hidden; 
position: relative;
text-align: center;
clear: left;
top: 0;
background: rgba(0,0,0,0);
z-index: 10;
width: 15%;
padding: 0.3em 1em;
opacity: 0;
left: 2%;

float: left;
}

.box_outer_streamer {
overflow:  hidden; 
position: relative;
text-align: center;
margin: 3px auto;
top: 0;
background: rgba(0,0,0,0);
z-index: 10;
width:15%;
padding: 0.3em 1em;
opacity: 0;
left: 2%;

float: left;
}

.box_bind {

position: relative;
text-align: center;


background: rgba(0,0,0,0);
z-index: 10;
width:80%;

opacity: 0;
}
.box {
overflow: hidden;
z-index: 10;
width:100%;
border: dashed red;
}
.box_outer_50_L {
overflow:  hidden; 
position: absolute;
text-align: center;
margin: 10px auto;
top: 1500px;
background: rgba(0,0,0,0);
z-index: 10;
width:40%;
padding: 1em 1em;
opacity: 0;
left: 10%;
}
.box_outer_50_R {
overflow:  hidden; 
position: absolute;
text-align: center;
margin: 10px auto;
top: 1500px;
background: rgba(0,0,0,0);
z-index: 10;
width:40%;
padding: 1em 1em;
opacity: 0;
left: 50%;
}

.box_default{
  background: #191919;
  
  float: left;
  width:100%;
  
  z-index: 5;
  padding: 20px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.box_inner{
     
  width:100%;
  padding-top:10px;
  
  /**border:1px solid #ff8410;**/
  text-align: center;
  z-index: 10;
  overflow: hidden;
}
.box_5pc{
width:5%;
text-align: center;
z-index: 10;
float: left;
}
.box_10pc{
width:10%;
text-align: center;
z-index: 10;
float: left;
}
.box_15pc{
width:15%;
text-align: center;
z-index: 10;
float: left;
}
.box_16pc{
width:16%;
text-align: center;
z-index: 10;
float: left;
}
.box_20pc{
width:20%;
text-align: center;
z-index: 10;
float: left;
}
.box_25pc{
  width:25%;
  text-align: center;
  z-index: 10;
  float: left;
}
.box_30pc{
  width:30%;
  text-align: center;
  z-index: 10;
  
  float: left;
}
.box_33pc{
  width:33%;
  text-align: center;
  z-index: 10;
  
  float: left;
}
.box_35pc{
width:35%;
text-align: center;
z-index: 10;

float: left;
}
.box_40pc{
  width:40%;
  text-align: center;
  z-index: 10;
  
  float: left;
}
.box_50pc{
  width:50%;
  text-align: center;
  z-index: 10;
  float: left;
}
.box_60pc{
width:60%;
text-align: center;
z-index: 10;
float: left;
text-align: center;
margin: 0 auto;
}
.box_70pc{
width:70%;
text-align: center;
z-index: 10;
float: left;
text-align: center;
margin: 0 auto;
}
.box_80pc{
width:80%;
text-align: center;
z-index: 10;
float: left;
text-align: center;
margin: 0 auto;
}
.box_100pc{
  width:100%;
  text-align: center;
  z-index: 10;
  float: left;
  
}

.box_login{
  
  text-align: center;
  z-index: 10;
  float: right;
  
  box-sizing: border-box;
}
.login_box{
  
  text-align: center;
  z-index: 10;
  float: right;
  padding-top: 11px;
  padding-right: 20px;
  box-sizing: border-box;
}
.login_name{
  
  text-align: center;
  z-index: 10;
  float: left;
  
  box-sizing: border-box;
}
.login_button{
  
  text-align: center;
  z-index: 10;
  float: left;
  
  box-sizing: border-box;
  pointer-events: auto;
}

#login {
  position: fixed;
  /*基準を画面の左上に*/
  top: 0;
  left: 0;
  /*余白が入らないように*/
  margin: 0;
  /*以下装飾*/
  width: 100%;
  background: #ffc77800;
  color:white;
  float: right;
  pointer-events: none;
}

.line {
  margin: 0 1rem;
  width: 4px;
  background-color: rgb(247, 247, 247);
}


@media screen and (max-width:1000px) {

  /*　画面サイズが480px以下の場合ここの記述が適用される　*/
  .box_outer {
      overflow:  hidden; 
      position: relative;
      text-align: center;
      margin: 10px auto;
      top: 0;
      background: rgba(0,0,0,0);
      z-index: 10;
      width:90%;
      padding: 1em 1em;
      opacity: 0;
  }
  .box_33pc{
      width:100%;
      text-align: center;
      z-index: 10;
      float: left;
      text-align: center;
      margin: 0 auto;
      
  }
  .box_inner{
     
      
     
      width:100%;
      
      
      /**border:1px solid #ff8410;**/
      text-align: center;
      z-index: 10;
      overflow: hidden;
     
      
     
  }
}