@charset "utf-8";

*
{
	margin: 0;
	padding: 0;
	border: none;
}

html, body
{
	width: 100%;
	height: 100%;
}

body
{
	color: #FFFFFF;
	background: #000000;
}

li
{
	list-style: none;
}

/*************************
	wrap
*************************/

#wrap
{
	width: 100%;
	height: 100%;
	min-height: 700px;
	position: relative;
}

body.off #wrap
{
	opacity: 0;
}

#wrap video
{
	position: absolute;
	top: -10px;
	left: -10px;
}

body#android #wrap video
{
	visibility: hidden;
	top: 50%;
	left: 50%;
	margin: -161px 0 0 -242px;
}

body#android #wrap video.play
{
	visibility: visible;
}

/*************************
	close
*************************/

#close
{
	width: 100px;
	height: 100px;
	position: absolute;
	top: 0;
	right: 0;
}

#close a
{
	display: block;
	width: 100px;
	height: 100px;
	background: url(../img/character/bttn_close.png) no-repeat 0 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

#close a.hover
{
	background-position: 0 100%;
}

/*************************
	container
*************************/

#container
{
	width: 100%;
	/*height: 544px;
	height: 429px;*/
	height: 100%;
	overflow: hidden;
	position: absolute;
	/*top: 50%;*/
	top: ;
	left: 0;
	/*margin-top: -214px;*/
}

/*************************
	movie
*************************/

#movie
{
	width: 640px;
	height: 495px;
	height: 380px;
	/*padding: 0 55px;*/
	position: absolute;
	top: 50%;
	left: 0;
	/*margin-top: 49px;*/
	margin-top: -165px;
}

#movie li
{
	width: 490px;
	height: 495px;
	height: 380px;
	/*margin: 0 20px;*/
	/*float: left;*/
	position: absolute;
	top: 0;
	left: 1135px;
}

#movie li.mii span.balloon
{
	display: block;
	width: 334px;
	height: 89px;
	background: url(../img/character/class_mii.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	position: absolute;
	top: -49px;
	left: 50%;
	margin-left: -167px;
	visibility: hidden;
}

#wrap.mii #movie li.mii span.balloon
{
	visibility: visible;
}

#movie li dl
{
	width: 490px;
	height: 495px;
	height: 380px;
	position: relative;
}

#movie li dl dt
{
	width: 490px;
	height: 59px;
	position: absolute;
	bottom: 0;
	background: url(../img/character/chr_name_bg.png) no-repeat 122px 0;
	visibility: hidden;
}

#movie li.mii dl dt
{
	background-position: 50% 0;
}

#container.mario #movie li.mario dl dt,
#container.luigi #movie li.luigi dl dt,
#container.peach #movie li.peach dl dt,
#container.daisy #movie li.daisy dl dt,
#container.yoshi #movie li.yoshi dl dt,
#container.bb_mario #movie li.bb_mario dl dt,
#container.bb_luigi #movie li.bb_luigi dl dt,
#container.bb_peach #movie li.bb_peach dl dt,
#container.bb_daisy #movie li.bb_daisy dl dt,
#container.bb_rosetta #movie li.bb_rosetta dl dt,
#container.kinopiko #movie li.kinopiko dl dt,
#container.kinopio #movie li.kinopio dl dt,
#container.jugem #movie li.jugem dl dt,
#container.heiho #movie li.heiho dl dt,
#container.nokonoko #movie li.nokonoko dl dt,
#container.mii #movie li.mii dl dt,
#container.donkey #movie li.donkey dl dt,
#container.waluigi #movie li.waluigi dl dt,
#container.koopa #movie li.koopa dl dt,
#container.wario #movie li.wario dl dt,
#container.rosetta #movie li.rosetta dl dt,
#container.wendy #movie li.wendy dl dt,
#container.lemmy #movie li.lemmy dl dt,
#container.larry #movie li.larry dl dt,
#container.ludwig #movie li.ludwig dl dt,
#container.iggy #movie li.iggy dl dt,
#container.morton #movie li.morton dl dt,
#container.roy #movie li.roy dl dt,
#container.mt_mario #movie li.mt_mario dl dt,
#container.pg_peach #movie li.pg_peach dl dt
{
	visibility: visible;
}

#movie li dl dt span.light, #movie li dl dt span.medium, #movie li dl dt span.heavy
{
	display: block;
	width: 124px;
	height: 59px;
	background: url(../img/character/class.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	margin-left: 7px;
}

#movie li dl dt span.light{ background-position: 50% 1px; }
#movie li dl dt span.medium{ background-position: 50% -62px; }
#movie li dl dt span.heavy{ background-position: 50% -123px; }

#movie li dl dt span.name
{
	display: block;
	width: 355px;
	height: 59px;
	background: url(../img/character/chr_name.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	position: absolute;
	top: 0;
	right: 14px;
}

#movie li.mii dl dt span.name
{
	left: 50%;
	margin-left: -177px;
}

#movie li.mario dl dt span.name{ background-position: 0 0; }
#movie li.luigi dl dt span.name{ background-position: 0 -60px; }
#movie li.peach dl dt span.name{ background-position: 0 -120px; }
#movie li.daisy dl dt span.name{ background-position: 0 -180px; }
#movie li.yoshi dl dt span.name{ background-position: 0 -240px; }
#movie li.bb_mario dl dt span.name{ background-position: 0 -300px; }
#movie li.bb_luigi dl dt span.name{ background-position: 0 -360px; }
#movie li.bb_peach dl dt span.name{ background-position: 0 -420px; }
#movie li.bb_daisy dl dt span.name{ background-position: 0 -480px; }
#movie li.bb_rosetta dl dt span.name{ background-position: 0 -1680px; }
#movie li.kinopiko dl dt span.name{ background-position: 0 -540px; }
#movie li.kinopio dl dt span.name{ background-position: 0 -600px; }
#movie li.jugem dl dt span.name{ background-position: 0 -660px; }
#movie li.heiho dl dt span.name{ background-position: 0 -720px; }
#movie li.nokonoko dl dt span.name{ background-position: 0 -780px; }
#movie li.mii dl dt span.name{ background-position: 0 -840px; }
#movie li.donkey dl dt span.name{ background-position: 0 -900px; }
#movie li.waluigi dl dt span.name{ background-position: 0 -960px; }
#movie li.koopa dl dt span.name{ background-position: 0 -1020px; }
#movie li.wario dl dt span.name{ background-position: 0 -1080px; }
#movie li.rosetta dl dt span.name{ background-position: 0 -1140px; }
#movie li.wendy dl dt span.name{ background-position: 0 -1200px; }
#movie li.lemmy dl dt span.name{ background-position: 0 -1260px; }
#movie li.larry dl dt span.name{ background-position: 0 -1320px; }
#movie li.ludwig dl dt span.name{ background-position: 0 -1380px; }
#movie li.iggy dl dt span.name{ background-position: 0 -1440px; }
#movie li.morton dl dt span.name{ background-position: 0 -1500px; }
#movie li.roy dl dt span.name{ background-position: 0 -1560px; }
#movie li.mt_mario dl dt span.name{ background-position: 0 -1620px; }
#movie li.pg_peach dl dt span.name{ background-position: 0 -1740px; }

#movie li dl dd
{
	width: 480px;
	height: 270px;
	padding: 5px;
	background: url(../img/character/frame.png) no-repeat 0 0;
}

#wrap #movie li dl dd video
{
	visibility: hidden;
}

#wrap #movie li dl dd img
{
	position: absolute;
	top: 5px;
	left: 5px;
}

#wrap #movie li dl dd img.off
{
	display: none;
}

/*************************
	cha
*************************/

#cha
{
	width: 600px;
	width: 100%;
	height: 136px;
	position: absolute;
	bottom: 77px;
	left: 242px;
	overflow: hidden;
}

#cha li
{
	background: url(../img/character/cha.jpg) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	float: left;
	margin-right: 26px;
}

#cha li.donkey,
#cha li.waluigi,
#cha li.koopa,
#cha li.wario,
#cha li.rosetta,
#cha li.wendy,
#cha li.lemmy,
#cha li.larry,
#cha li.ludwig,
#cha li.iggy,
#cha li.morton,
#cha li.roy,
#cha li.mt_mario,
#cha li.pg_peach
{
	background-image: url(../img/character/cha.png);
}

#cha li.mario{ width: 156px; height: 124px; margin-top: 12px; background-position: 0 0; }
#cha li.luigi{ width: 156px; height: 130px; margin-top: 6px; background-position: 0 -124px; }
#cha li.peach{ width: 156px; height: 125px; margin-top: 11px; background-position: 0 -254px; }
#cha li.daisy{ width: 156px; height: 120px; margin-top: 16px; background-position: 0 -379px; }
#cha li.yoshi{ width: 156px; height: 135px; margin-top: 1px; background-position: 0 -499px; }
#cha li.bb_mario{ width: 136px; height: 132px; margin-top: 4px; background-position: -156px 0; }
#cha li.bb_luigi{ width: 136px; height: 134px; margin-top: 2px; background-position: -156px -132px; }
#cha li.bb_peach{ width: 136px; height: 137px; margin-top: -1px; background-position: -156px -266px; }
#cha li.bb_daisy{ width: 136px; height: 138px; margin-top: -2px; background-position: -156px -403px; }
#cha li.bb_rosetta{ width: 136px; height: 138px; margin-top: -2px; background-position: -156px -541px; }
#cha li.kinopiko{ width: 136px; height: 111px; margin-top: 20px; background-position: -292px 0; }
#cha li.kinopio{ width: 136px; height: 115px; margin-top: 16px; background-position: -292px -111px; }
#cha li.jugem{ width: 136px; height: 111px; margin-top: 20px; background-position: -292px -226px; }
#cha li.heiho{ width: 136px; height: 107px; margin-top: 29px; background-position: -292px -337px; }
#cha li.nokonoko{ width: 136px; height: 108px; margin-top: 28px; background-position: -292px -445px; }
#cha li.mii{ width: 136px; height: 131px; margin-top: 5px; background-position: -292px -552px; }
#cha li.donkey{ width: 194px; height: 191px; margin-top: -55px; background-position: 0 0; }
#cha li.waluigi{ width: 194px; height: 198px; margin-top: -62px; background-position: 0 -191px; }
#cha li.koopa{ width: 194px; height: 220px; margin-top: -84px; background-position: 0 -389px; }
#cha li.wario{ width: 194px; height: 199px; margin-top: -63px; background-position: 0 -609px; }
#cha li.rosetta{ width: 194px; height: 205px; margin-top: -69px; background-position: 0 -808px; }
#cha li.wendy{ width: 122px; height: 153px; margin-top: -17px; background-position: -194px 0; }
#cha li.lemmy{ width: 122px; height: 176px; margin-top: -40px; background-position: -194px -153px; }
#cha li.larry{ width: 122px; height: 192px; margin-top: -56px; background-position: -194px -329px; }
#cha li.ludwig{ width: 144px; height: 185px; margin-top: -49px; background-position: -316px 0; }
#cha li.iggy{ width: 144px; height: 208px; margin-top: -72px; background-position: -316px -185px; }
#cha li.morton{ width: 158px; height: 210px; margin-top: -74px; background-position: -194px -548px; }
#cha li.roy{ width: 158px; height: 177px; margin-top: -41px; background-position: -194px -758px; }
#cha li.mt_mario{ width: 114px; height: 155px; margin-top: -19px; background-position: -352px -393px; }
#cha li.pg_peach{ width: 114px; height: 165px; margin-top: -29px; background-position: -352px -548px; }

#cha li p
{
	width: 100%;
	height: 100%;
	background: url(../img/character/cha_bg.png) repeat 0 0;
}

#cha li.donkey p,
#cha li.waluigi p,
#cha li.koopa p,
#cha li.wario p,
#cha li.rosetta p,
#cha li.wendy p,
#cha li.lemmy p,
#cha li.larry p,
#cha li.ludwig p,
#cha li.iggy p,
#cha li.morton p,
#cha li.roy p,
#cha li.mt_mario p,
#cha li.pg_peach p
{
	background-image: url(../img/character/cha_bg_l.png);
}

#cha li.donkey p{ background-position: 0 0; }
#cha li.waluigi p{ background-position: 0 -191px; }
#cha li.koopa p{ background-position: 0 -389px; }
#cha li.wario p{ background-position: 0 -609px; }
#cha li.rosetta p{ background-position: 0 -808px; }
#cha li.wendy p{ background-position: -194px 0; }
#cha li.lemmy p{ background-position: -194px -153px; }
#cha li.larry p{ background-position: -194px -329px; }
#cha li.ludwig p{ background-position: -316px 0; }
#cha li.iggy p{ background-position: -316px -185px; }
#cha li.morton p{ background-position: -194px -548px; }
#cha li.roy p{ background-position: -194px -758px; }
#cha li.mt_mario p{ background-position: -352px -393px; }
#cha li.pg_peach p{ background-position: -352px -548px; }

#wrap.mario #cha li.mario p,
#wrap.luigi #cha li.luigi p,
#wrap.peach #cha li.peach p,
#wrap.daisy #cha li.daisy p,
#wrap.yoshi #cha li.yoshi p,
#wrap.bb_mario #cha li.bb_mario p,
#wrap.bb_luigi #cha li.bb_luigi p,
#wrap.bb_peach #cha li.bb_peach p,
#wrap.bb_daisy #cha li.bb_daisy p,
#wrap.bb_rosetta #cha li.bb_rosetta p,
#wrap.kinopiko #cha li.kinopiko p,
#wrap.kinopio #cha li.kinopio p,
#wrap.jugem #cha li.jugem p,
#wrap.heiho #cha li.heiho p,
#wrap.nokonoko #cha li.nokonoko p,
#wrap.mii #cha li.mii p,
#wrap.donkey #cha li.donkey p,
#wrap.waluigi #cha li.waluigi p,
#wrap.koopa #cha li.koopa p,
#wrap.wario #cha li.wario p,
#wrap.rosetta #cha li.rosetta p,
#wrap.wendy #cha li.wendy p,
#wrap.lemmy #cha li.lemmy p,
#wrap.larry #cha li.larry p,
#wrap.ludwig #cha li.ludwig p,
#wrap.iggy #cha li.iggy p,
#wrap.morton #cha li.morton p,
#wrap.roy #cha li.roy p,
#wrap.mt_mario #cha li.mt_mario p,
#wrap.pg_peach #cha li.pg_peach p
{
	visibility: hidden;
}