@charset "utf-8";

/* ---------------------------------------------------------- */
/* main */
/* ---------------------------------------------------------- */
#main {
	width: 830px;
	}

#main #start {
	top: 74%;
	right: 0;
	}

@media (max-width: 768px){
#main {
	width: 100%;
	}

#catch p img {
	width: 80%;
	}
}


/* ---------------------------------------------------------- */
/* INTRODUCTION */
/* ---------------------------------------------------------- */
#introduction .bg {
	background: url(../images/rb/bg_introduction.png) center bottom no-repeat;
	}

@media (max-width: 768px){
#introduction .bg {
	background-size: contain;
	}

#introduction h3 img {
	width: 55%;
	}
}

@media (max-width: 640px){
#introduction h3 img {
	width: 65%;
	}
}


/* ---------------------------------------------------------- */
/* STAFF/CAST */
/* ---------------------------------------------------------- */
#staff_cast {
	height: 1500px;
	}

#staff_cast #staff ul {
	width: 740px;
	height: 1420px;
	background: url(../images/rb/txt_staff.png) no-repeat;
	}

#staff_cast #cast ul {
	width: 292px;
	height: 443px;
	background: url(../images/rb/txt_cast.png) no-repeat;
	}

@media (max-width: 768px){
#staff_cast #staff ul {
	width: 80%;
	height: 0;
	background: url(../images/rb/txt_staff.png) no-repeat;
	background-size: contain;
	padding: 153.51351% 0 0 0;
	}

#staff_cast #cast ul {
	width: 32%;
	height: 0;
	background: url(../images/rb/txt_cast.png) no-repeat;
	background-size: contain;
	padding: 48.54794% 0 0 0;
	}
}

@media (max-width: 480px){
#staff_cast #staff ul {
	width: 100%;
	padding: 191.89189% 0 0 0;
	}

#staff_cast #cast ul {
	width: 39%;
	padding: 59.1678% 0 0 0;
	}
}


/* ---------------------------------------------------------- */
/* CHARACTER */
/* ---------------------------------------------------------- */
@media (max-width: 768px){
#character #suou .characterDetail .characterImage img {
	width: 80.35087%;
	height: auto;
	}

#character #munakata .characterDetail .characterImage img {
	width: 61.57894%;
	height: auto;
	}

#character #kusanagi .characterDetail .characterImage img {
	width: 65.61403%;
	height: auto;
	}

#character #totsuka .characterDetail .characterImage img ,
#character #yamata .characterDetail .characterImage img {
	width: 68.42105%;
	height: auto;
	}

#character #awashima .characterDetail .characterImage img {
	width: 77.19298%;
	height: auto;
	}

#character #suou .characterDetail .characterText h3 img {
	width: 35.80729%;
	height: auto;
	}

#character #munakata .characterDetail .characterText h3 img , 
#character #kusanagi .characterDetail .characterText h3 img ,
#character #yamata .characterDetail .characterText h3 img ,
#character #awashima .characterDetail .characterText h3 img {
	width: 46.875%;
	height: auto;
	}

#character #totsuka .characterDetail .characterText h3 img {
	width: 57.9427%;
	height: auto;
	}
}

@media (max-width: 640px){
#character #suou .characterDetail .characterText h3 img {
	width: 50%;
	}

#character #munakata .characterDetail .characterText h3 img , 
#character #kusanagi .characterDetail .characterText h3 img ,
#character #yamata .characterDetail .characterText h3 img ,
#character #awashima .characterDetail .characterText h3 img {
	width: 65.45454%;
	}

#character #totsuka .characterDetail .characterText h3 img {
	width: 80.90909%;
	}
}