@charset"utf-8";

@import url("default.css");
@import url("layout.css");

/*========================Contents=============================
	01) Index
	02) Download
	03) profile
	04) Movie
	05) Common
	99) Clear
=============================================================*/

/*============================================================
	01) Index
=============================================================*/

body#index {
	position:relative;
	padding:0;
	background:#4BCBF8;
	margin-top:-5px;
}

#flash {height:100%;}

#footSpaceB {
	width:100%;
	position:absolute;	
	left:0;
	top:621px;
}

#footSpace,
#bannerArea {
	width:940px;
	margin:0 auto;
	text-align:left;
}

#footSpace {position:relative;}

#mobile {
	width:243px;
	float:left;
}

#mobile .flR img {margin-top:89px;}

#banner {
	width:475px;
	float:right;
	margin-top:29px;
}

#logoCopyright {
	position:absolute;
	right:0;
	bottom:0;
}

/*============================================================
	02) Download
=============================================================*/

body#download,
body#popClock {background:transparent url("../images/common/bg.gif");}

#downloadContent {
	width:945px;
	margin:0 auto;
	text-align:center;
}

#downloadContent h2 {text-align:left;margin-bottom:12px;}

#downloadContent h3 {margin-bottom:15px;font-size:0;}

#downloadWrap {width:940px;margin:0 auto;}

#boxL {width:460px;float:left;text-align:center;}
#boxR {width:460px;float:right;text-align:center;}

.boxIn {
	padding:8px 19px 0 20px;
	text-align:left;
	background:#fff;
}

* html .boxIn {padding:8px 19px 5px 20px;} 

.boxIn2 {
	padding:8px 17px 5px 17px;
	text-align:left;
	background:#fff;
}

.boxIn2 {
	/padding:8px 17px 1px 17px;
}

#downloadContent h2,
.boxInT,
.boxInB {font-size:0;}

.wallpaper {width:411px;margin-bottom:20px;}
.wallpaper div {width:194px;float:left;}
.wallpaper ul {width:190px;float:right;margin:85px 0 0 0;}
.wallpaper ul li {display:inline;font-size:0;zoom:1;}
.wallpaper ul li img {margin-left:10px;}

dl.howto {padding-bottom:10px;}
dl.howto dt {margin-bottom:5px;}
dl.howto dd {padding-left:24px;text-indent:-24px;margin-bottom:8px;}
dl.howto dd img {vertical-align:middle;margin-right:5px;}

.gaget {
	position:relative;
	width:426px;
	margin-bottom:20px;
}

.detailBtn {
	position:absolute;
	left:111px;
	bottom:-15px;
}

.gaget .flL {width:209px;float:left;}
.gaget .flL p {margin-bottom:5px;font-size:0;}
.gaget .flR {width:217px;float:right;}

.pd78 {padding-bottom:78px;}

#popClock {padding-bottom:12px;}
#popClock h2 {margin-top:30px;}
#popClock h3 {margin:15px 0 5px 0;}

#popWrap {
	position:relative;
	width:530px;
	margin:0 auto;
	padding-bottom:10px;
	background:transparent url("../images/download/pop_boxb.png") left bottom no-repeat;
}

#popWrap #chara {
	position:absolute;
	right:0;
	bottom:0;
}

#popBox {
	width:530px;
	padding-top:9px;
	background:transparent url("../images/download/pop_boxt.png") left top no-repeat;
	text-align:center;
}

#popBoxIn {
	background:#fff;
	padding:18px 17px 0 25px;
	text-align:left;
}

.instollBtnSpace {width:481px;}
.instollBtnSpace #flashcontent1,
.instollBtnSpace #flashcontent2 {
	width:240px;
	float:left;
}

.step {margin:13px 0 20px 0;}
.step2 {margin:0 0 10px 0;}
.step li,
.step2 li {display:inline;font-size:0;}

.step3 {font-size:85%;margin-bottom:20px;}
.step3 li {padding-left:1em;text-indent:-1em;}

.instollSubtxt {
	width:240px;
	float:right;
	margin:0 0 40px 0;
	font-size:85%;
}
.instollSubtxt ul {margin-top:10px;}
.instollSubtxt a {color:#e673a4;}

#environment {margin-bottom:15px;}
#environment dt {font-weight:bold;}

#environment dd {
	padding-left:7px;
	text-indent:-7px;
}

.mt10 {margin-top:10px;}

.howtoInstoll li img {vertical-align:middle;margin-right:5px;}
.howtoInstoll li {padding-left:24px;text-indent:-24px;margin-bottom:8px;}
.howtoInstoll li li {font-size:85%;padding-left:1em;text-indent:-1em;margin:0;}

#box234 {width:480px;}
#box234 .flL {width:325px;}
#box234 .flR {width:140px;}
#box234 .flR li {margin-bottom:20px;}

#btnClose {margin:12px auto 0 auto;}

/*============================================================
	03) profile
=============================================================*/

body#profile {
	background:transparent url("../images/common/bgx.gif") left top repeat-x;
	text-align:center;
}

#profileContent {
	position:relative;
	width:945px;
	height:518px;
	margin:0 auto;
	text-align:left;
}

#profileContent h3#penne {margin:30px 0 0 -10px;}

* html #profileContent h3#penne {margin:36px 0 0 -10px;}

#profileContent h3#nyokki {
	width:452px;
	height:509px;
	position:absolute;
	left:499px;
	top:13px;
}

#profileContent p#subTxt {
	width:353px;
	height:34px;
	position:absolute;
	left:294px;
	top:460px;
}

/*============================================================
	04) Movie
=============================================================*/

body#movie {
	background:transparent url("../images/common/bgx.gif") left top repeat-x;
	text-align:center;
}

#movieContent {
	position:relative;
	width:945px;
	height:519px;
	margin:0 auto;
	text-align:left;
}

#screen {
	position:absolute;
	right:-20px;
	top:-21px;
}

.movie1 {
	width:155px;
	height:170px;
	position:absolute;
	left:20px;
	top:199px;
}

.movie2 {
	width:155px;
	height:170px;
	position:absolute;
	left:192px;
	top:325px;
}

body#moview {
	background:#4BCBF8;
	padding:0;
}

/*============================================================
	05) Common
=============================================================*/

.flL {float:left;}
.flR {float:right;}

ul.indent li {padding-left:14px;text-indent:-14px;}
	
/*============================================================
	99) Clear
=============================================================*/

.clearfix:after,
#downloadWrap:after,
.wallpaper:after,
.gaget:after,
#box234:after,
#bannerArea:after,
#mobile:after,
#banner:after,
.instollBtnSpace:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	font-size: 0.1em;
    line-height: 0;
}

.clearfix,
#downloadWrap,
.wallpaper,
.gaget,
#box234,
#bannerArea,
#mobile,
#banner,
.instollBtnSpace {
	display:inline-block;
	min-height: 1%;
}