@charset "utf-8";

@import "../../../files/css/layout.css";


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

/*-------------------------------------------------------------------------
	Title
/*-----------------------------------------------------------------------*/


/*-------------------------------------------------------------------------
    Rio city
/*-----------------------------------------------------------------------*/

#rio {
    position: relative;
}

    #rio .ttl {
        padding: 5% 0 5% 5%;
        background-color: #fff;
        position: relative;
        z-index: 2;
    }
        #rio .ttl img {
            width: 58.44%;
        }

#rio .slider {
    padding: 10% 0 5% 0;
    background: url(../img/index/rio/bg.jpg) no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

/*-------------------------------------------------------------------------
    Rio city
/*-----------------------------------------------------------------------*/
#box_team {
}
#box_rio {
    margin-top: -2.5%;
    position: relative;
    z-index: 1;
}
	
		#box_team > .ttl p,
		#box_rio > .ttl p {
			margin: 0 auto;
			padding-top: 4%;
			width: 76%;
		}
		#box_rio > .ttl p {
			width: 90%;
		}
	#box_team .item,
	#box_rio .item {
		position: relative;
		width: 100%;
		height: 100%;
	}
	#box_team .item {
		padding-top: 80%;
	}
	#box_rio .item {
		padding-top: 80%;
	}
		#box_team .slide,
		#box_rio .slide {
			position: relative;
			/*top: 10%;*/
			width: 100%;
			z-index: 20;
		}
			
		#box_team .item .card,
		#box_rio .item .card {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			margin: 0 auto;
		}
			
			#box_team .item .card .label,
			#box_rio .item .card .label {
				width: 75%;
				margin: 0 auto 3% auto;
				z-index: 1;
			}
			#box_team .item .card .label {
			}
			#box_rio .item .card .label {
			}
			#box_team .item .card ul.type,
			#box_rio .item .card ul.type {
				position: absolute;
				left: 0;
				right: 0;
				margin: 0 auto 20px;
				z-index: 1;
			}
			#box_team .item .card ul.type,
			#box_rio .item .card ul.type{
				top: 0;
			}
		
				#box_team .item .card ul.type li,
				#box_rio .item .card ul.type li {
					display: none;
					top: 0;
					left: 0;
					right: 0;
					margin: 0 auto;
				}
		
			#box_team .item .card .detail,
			#box_rio .item .card .detail {
				position: absolute;
				left: 10%;
				right: 0;
				z-index: 1;
				font-size: 13px;
				line-height: 1.3;
			}
			
	
			#box_team .item .card .btn01,
			#box_team .item .card .btn02,
			#box_team .item .card .btn03,
			#box_team .item .card .btn04{
				top: 0;
				left: 0;
				right: 0;
				width: 66%;
				margin: 0 auto;
				z-index: 1;
			}
			
		#box_team .item .bg,
		#box_rio .item .bg {
			position: absolute;
			top: 0;
			width: 100%;
			z-index: 0;
		}
			#box_team .item .card .bg img,
			#box_rio .item .card .bg img {
				max-width: 100%;
			}
		
				
			#box_team .cntrl .thumbs,
			#box_rio .cntrl .thumbs {
		  		padding: 0 0 30px;
			}
			#box_rio .cntrl .thumbs {
			}
				#box_team .cntrl .thumbs ul,
				#box_rio .cntrl .thumbs ul {
				}
					#box_team .cntrl .thumbs ul li,
					#box_rio .cntrl .thumbs ul li {
						position: relative;
					  float: left;
						/*width: -webkit-calc(100% / 4 - 5px);
						width: calc(100% / 4 - 5px);*/
					}
						#box_team .cntrl .thumbs ul li:first-child,
						#box_rio .cntrl .thumbs ul li:first-child {}

						#box_rio .cntrl .thumbs ul li img {
						}


/*-------------------------------------------------------------------------
    Tournament
/*-----------------------------------------------------------------------*/

#tournament .ttl {
    width: 86.25%;
    padding: 5% 0 5% 5%;
}
#tournament .txt {
    margin-top: -2%;
}


/*-------------------------------------------------------------------------
    Team
/*-----------------------------------------------------------------------*/

#team .ttl {
    width: 82.5%;
    padding: 5% 0 5% 5%;
}

#team .slider {
    padding: 10% 0 0% 0;
    background: url(../img/index/team/bg.gif) no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}



/*-------------------------------------------------------------------------
    Mii
/*-----------------------------------------------------------------------*/

#mii {
    padding-bottom: 4%;
    background: url(../img/index/mii/bg.png) no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative;
}
    #mii .ttl {
        padding: 5% 0 5% 5%;
        background-color: #fff;
    }
        #mii .ttl img {
            width: 51.86%;
        }
        #mii .txt {
            width: 54.69%;
            padding: 5% 0 0 5%;
        }
        #mii .thumbs {
            width: 90.31%;
            margin: 0 auto;
            padding-top: 2%;
            position: relative;
            z-index: 1;
        }
        #mii #chara01 {
            width: 46.09%;
            position: absolute;
            top: 0;
            right: 0;
            z-index: 0;
        }
        #mii ul {
            padding-top: 4%;
        }
            #mii ul li {
                float: left;
                margin-left: 4%;
            }
            #mii ul #chara02 {
                width: 28.13%;
                padding-top: 1%;
            }
            #mii ul #chara03 {
                width: 26.86%;
                padding-top: 4.5%;
            }
            #mii ul #chara04 {
                width: 27.5%;
            }


/*-------------------------------------------------------------------------
	Navi
/*-----------------------------------------------------------------------*/

#navi {
	background-color: #f4791f;
}
    #navi p {
        background-color: #cd5f0f;
    }
    	#navi p img {
    		width: 40%;
    	}