@charset "shift_jis";


/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

	file name : yoshi.css

 : :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */

@import "../../assets/styles/reset.css";
@import "../../assets/styles/class.css";

	
/* ********************************************************************************
 * Link
 * ******************************************************************************** */

a {
	outline: none;
}
/* a:link */
a:link {
	color: #ffffff;
	text-decoration: none;
}
/* a:active */
a:active {
	color: #ffffff;
	text-decoration: none;
}
/* a:visited */
a:visited {
	color: #ffffff;
	text-decoration: none;
}
/* a:hover */
a:hover {
	color: #ffffff;
	text-decoration: underline;
}

/* ********************************************************************************
 * Base Layout
 * ******************************************************************************** */

/* html */
html,body {
	height: 100%;
}
/* body */
body {
	background: #fff;
	font-family: "メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	text-align: left;
}

/* ********************************************************************************
 * ■ヨッシーの変身アクション
 * file path : /action/yoshi/transform*.html
 * body id name : body#transform
 * ******************************************************************************** */

/* div#content
 * ================================================================================ */
body#transform div#content {
	position:absolute; top:50%; left:50%;
	width: 706px;
	height: 360px;
	margin: -180px 0 0 -353px;
	background: url(images/bg_content.jpg) 0 0 no-repeat;
}
/* p#title */
body#transform div#content p#title {
	position:absolute; top:-28px; right:13px;
	z-index: 100;
}
/* h2 */
body#transform div#content h2 {
	position:absolute; top:40px; left:57px;
}
/* ul.sliderNav
------------------------------------------------------------*/
body#transform div#content ul.sliderNav {
	position:absolute; top:37px; left:267px;
	width: 140px;
}
body#transform div#content ul.sliderNav li {
	float: left;
	margin-right: 8px;
}
body#transform div#content ul.sliderNav li a {
	position:relative; top:11px;
	display: block;
	width: 30px;
	height: 29px;
	background: 0 0 no-repeat;
	text-indent: -9000px;
	font-size: 0;
	line-height: 0;
}
body#transform div#content ul.sliderNav li.dash a {
	background-image: url(../images/yoshi/transform_nav_dash.jpg);
}
body#transform div#content ul.sliderNav li.balloon a {
	background-image: url(../images/yoshi/transform_nav_balloon.jpg);
}
body#transform div#content ul.sliderNav li.light a {
	background-image: url(../images/yoshi/transform_nav_light.jpg);
}
body#transform div#content ul.sliderNav li.dash a:hover,
body#transform div#content ul.sliderNav li.balloon a:hover,
body#transform div#content ul.sliderNav li.light a:hover {
	background-position: 0 100%;
}

/* div.img */
body#transform div#content div.img {
	position:absolute; top:110px; left:59px;
}
/* p.btnPrev */
body#transform div#content p.btnPrev {
	position:absolute; top:304px; left:25px;
}
body#transform div#content p.btnPrev a {
	display: block;
	width: 67px;
	height: 37px;
	background: url(images/btn_prev.jpg) 0 0 no-repeat;
	text-indent: -9000px;
	font-size: 0;
	line-height: 0;
}
body#transform div#content p.btnPrev a:hover {
	background-position: 0 100%;
}
/* p.btnNext */
body#transform div#content p.btnNext {
	position:absolute; top:304px; right:27px;
}
body#transform div#content p.btnNext a {
	display: block;
	width: 70px;
	height: 37px;
	background: url(images/btn_next.jpg) 0 0 no-repeat;
	text-indent: -9000px;
	font-size: 0;
	line-height: 0;
}
body#transform div#content p.btnNext a:hover {
	background-position: 0 100%;
}

/* div.dash
 * -------------------------------------------------------------------------------- */
/* p.txt_1 */
body#transform div.dash p.txt_1 {
	position:absolute; top:75px; left:403px;
}
/* div.balloon
 * -------------------------------------------------------------------------------- */
/* p.txt_1 */
body#transform div.balloon p.txt_1 {
	position:absolute; top:10px; left:411px;
}
/* div.light
 * -------------------------------------------------------------------------------- */
/* p.txt_1 */
body#transform div.light p.txt_1 {
	position:absolute; top:10px; left:411px;
}