@charset "utf-8";



/*----------------------------------------
	style
----------------------------------------*/

#wrapper{
padding-top:100px;
background-image:url("img/battleroyal2015/bg.jpg");
}

#topImage{
height:auto!important;
margin-bottom:0px!important;
}

#topImage img{
width:100%;
}

.box{
position:relative;
display:block;
max-width:980px;
height:125px;
margin:25px auto 0;
padding:10px;
color:#fff;

background-color:rgba(80,80,80,0.7);
border-radius:3px;
}


a.box:hover{
position:relative;
display:block;
max-width:980px;
height:125px;
margin:25px auto 0;
padding:10px;
color:#fff;

background-color:rgba(130,130,130,0.7);
}


a.box:after {
display: block;
position: absolute;
top: 50%;
right: 18px;
width: 20px;
height: 20px;
margin-top: -8px;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: "";
}


.box_sec{
position:relative;
display:block;
max-width:980px;
height:auto;
margin:3px auto 0;
padding:10px;
color:#fff;
text-align:center;

background-color:rgba(200,50,50,0.9);
border-radius:3px;
}

a.box_sec:after {
display: block;
position: absolute;
top: 50%;
right: 18px;
width: 14px;
height: 14px;
margin-top: -8px;
border-top: solid 2px #ccc;
border-right: solid 2px #ccc;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: "";
}

a.box_sec:hover {
background-color:rgba(230,0,0,0.9);
}

.logo{
display:block;
float:left;
}

.txt{
float:left;
margin-left:20px;
}

.win{
float:right;
margin-right:60px;
}

.txt h3{
font-weight:800;
font-size:30px;
margin-bottom:8px;
}

.txt h3 span{
font-size:60%;
}

.txt p{
margin-left:0px;
}





/*----------------------------------------
	for SP
----------------------------------------*/

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


.box{
width:90%;
position:relative;
display:block;
max-width:980px;
height:70px;
margin:15px auto 0;
padding:10px;
color:#fff;

background-color:rgba(80,80,80,0.7);
border-radius:3px;
}


a.box:hover{
position:relative;
display:block;
max-width:980px;
height:70px;
margin:15px auto 0;
padding:10px;
color:#fff;

background-color:rgba(120,120,120,0.7);
}


a.box:after {
display: block;
position: absolute;
top: 50%;
right: 18px;
width: 15px;
height: 15px;
margin-top: -8px;
border-top: solid 2px #aaa;
border-right: solid 2px #aaa;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: "";
}

.box_sec{
position:relative;
display:block;
width:95%;
height:auto;
margin:3px auto 0;
padding:6px 0;
color:#fff;
text-align:center;

background-color:rgba(200,50,50,0.9);
border-radius:3px;
}

a.box_sec:after {
display: block;
position: absolute;
top: 50%;
right: 18px;
width: 10px;
height: 10px;
margin-top: -8px;
border-top: solid 2px #ccc;
border-right: solid 2px #ccc;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
content: "";
}

.logo{
width:30%;
display:none;
float:left;
}

.txt{
font-size:9px;
float:left;
margin-left:2%;
}

.win{
float:right;
margin-right:8%;
width:16%;
}

.txt h3{
font-weight:800;
font-size:15px;
margin-bottom:8px;
}


.txt p{
margin-left:0px;
}



}


.clearfix:after {
  content: ""; 
  display: block; 
  clear: both;
}

