@charset "utf-8";
/* CSS Document */
#btnHowto {
	position: absolute;
	left: 180px;
	top: 75px;
	cursor: pointer;
	z-index: 3;
	width:88px;
	height:52px;
	overflow:hidden;
	cursor:pointer;
}

#btnHowto:hover img {
	margin-top:-52px;
}


#code_inputArea {
	background:url(../../img/code/base.png);
	width:825px;
	height:326px;
	position:relative;
}

#code_heroine_visual {
	position:absolute;
	left:625px;
	top:23px;
}

#inputCode {
	background:url(../../img/code/ward_notxt.png);
	width:265px;
	height:48px;
	line-height:48px;
	
	position:absolute;
	left:159px;
	top:170px;
	padding:0px 5px;
	text-align:center;
}

#btnConfirm {
	position:absolute;
	left:454px;
	top:156px;
	width:219px;
	height:65px;
	overflow:hidden;
	cursor:pointer;
}

#codeError {
	position:absolute;
	left: 425px;
	top: 70px;
	display:none;
}

#btnConfirm:hover img {
	margin-top:-65px;
}

#code_historyArea {
	margin-top:20px;
	display:none;
}

#code_historyArea h3 {
	width:255px;
	margin:0px auto;
	margin-bottom:20px;
}

.codeLine {
	background:url(../../img/code/line.png);
	background-repeat:no-repeat;
	background-position:bottom center;
	width:692px;
	margin:0px auto;
	padding-bottom:20px;
	margin-top:10px;
}

.codeLine li {
	float:left;
	padding-left:15px;
	position:relative;
	width:155px;
}

.codeTxt {
	background:url(../../img/code/page_right.png);
	background-repeat:no-repeat;
	background-position:left center;
	padding-left:20px;
	cursor:pointer;
}

.codeBalloon {
	width:176px;
	position:absolute;
	left:50%;
	bottom:20px;
	margin-left:-88px;
	
	display:none;
}

.codeHead {
	background:url(../../img/code/header.png);
	width:176px;
	height:8px;
}

.codePlace {
	background:url(../../img/code/repeat.png);
	width:176px;
	text-align:center;
	font-size:12px;
}

.codeFoot {
	background:url(../../img/code/footer.png);
	width:176px;
	height:14px;
}


#captionHowto{
	margin-top: 20px;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.4em;
}