@charset "UTF-8";

/*--------------------------------------------------------------*/
/* ご利用手順
/*--------------------------------------------------------------*/

#intro h2{
	position: absolute;
	width: 204px;
	height: 46px;
	top: 80px;
	left: 70px;
	z-index: 10;
}

#intro div{
	position: relative;
	width: 399px;
	height: 213px;
	top: 100px;
	left: 400px;
	overflow: hidden;
}

#intro div img.comic{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}

#main h3.heading{
	position: relative;
	margin: 0 0 15px 45px;
	clear: both;
}

/*--------------------------------*/

#select{ position: relative; clear: both; }

/*--------------------------------*/

#select_1{
	position: relative;
	width: 375px;
	height: 218px;
	margin: 0 0 15px 55px;
	overflow: hidden;
	float: left;
}

#select_1 h4{
	position: absolute;
	width: 103px;
	height: 35px;
	top: 0;
	left: 10px;
	z-index: 1;
}

#select_1 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#select_2{
	position: relative;
	width: 390px;
	height: 219px;
	margin-right: 60px;
	overflow: hidden;
	float: right;
}

#select_2 h4{
	position: absolute;
	width: 106px;
	height: 35px;
	top: 0;
	left: 10px;
	z-index: 1;
}

#select_2 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#select_3{
	position: relative;
	width: 376px;
	height: 223px;
	margin: 0 0 15px 55px;
	overflow: hidden;
	clear: both;
	float: left;
}

#select_3 h4{
	position: absolute;
	width: 287px;
	height: 34px;
	top: 0;
	left: 10px;
	z-index: 1;
}

#select_3 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#select_4{
	position: relative;
	width: 311px;
	height: 169px;
	margin: 50px 100px 0 0;
	/* overflow: hidden; */
	float: right;
}

#select_4 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#goto_characters{
	position: relative;
	width: 579px;
	height: 122px;
	margin: 0 0 50px 100px;
	clear: both;
}

#goto_characters p.image a{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 579px;
	height: 122px;
	text-indent: -9999px;
	background-image: url(../img/process/goto_characters.png);
	background-repeat: no-repeat;
	background-position: left top;
	outline: none;
}
#goto_characters p.image a:hover{ background-position: left bottom; }



/*--------------------------------*/

#order{ position: relative; clear: both; padding: 50px 0; }

/*--------------------------------*/

#ordermade_1{
	position: relative;
	width: 778px;
	height: 229px;
	margin: 0 0 15px 55px;
	overflow: hidden;
}

#ordermade_1 h4{
	position: absolute;
	width: 201px;
	height: 35px;
	top: 3px;
	left: 10px;
	z-index: 1;
}

#ordermade_1 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#ordermade_2{
	position: relative;
	width: 711px;
	height: 220px;
	margin: 0 0 15px 55px;
	overflow: hidden;
}

#ordermade_2 h4{
	position: absolute;
	width: 357px;
	height: 36px;
	top: 3px;
	left: 10px;
	z-index: 1;
}

#ordermade_2 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#ordermade_3{
	position: relative;
	width: 703px;
	height: 215px;
	margin: 0 0 15px 55px;
	overflow: hidden;
}

#ordermade_3 h4{
	position: absolute;
	width: 110px;
	height: 35px;
	top: 3px;
	left: 10px;
	z-index: 1;
}

#ordermade_3 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#ordermade_4{
	position: relative;
	width: 767px;
	height: 228px;
	margin: 0 0 15px 55px;
	overflow: hidden;
}

#ordermade_4 h4{
	position: absolute;
	width: 115px;
	height: 36px;
	top: 3px;
	left: 10px;
	z-index: 1;
}

#ordermade_4 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#ordermade_5{
	position: relative;
	width: 769px;
	height: 221px;
	margin: 0 0 15px 55px;
	/* overflow: hidden; */
}

#ordermade_5 h4{
	position: absolute;
	width: 314px;
	height: 37px;
	top: 3px;
	left: 10px;
	z-index: 1;
}

#ordermade_5 img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}


/*--------------------------------*/

#goto_request{
	position: relative;
	width: 579px;
	height: 122px;
	margin: 0 0 60px 100px;
	clear: both;
}

#goto_request p.image a{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 591px;
	height: 112px;
	text-indent: -9999px;
	background-image: url(../img/process/goto_request.png);
	background-repeat: no-repeat;
	background-position: left top;
	outline: none;
}
#goto_request p.image a:hover{ background-position: left bottom; }



/*--------------------------------*/

div.attention{
	position: relative;
	width: 701px;
	margin: 0 70px 50px 55px;
	padding: 25px 35px 50px 35px;
	font-size: 85%;
	background-image: url(../img/process/process_attention_bg.png);
	background-repeat: repeat-y;
	background-position: top left;
}

div.attention h3{
	text-align: center;
	margin-top: 15px;
}

div.attention h4{
	margin: 30px 0 10px 0;
	padding: 5px 5px 2px 5px;
	color: #E6840D;
	font-size: 120%;
	border-bottom: solid 1px #999999;
	clear: both;
}

div.attention ul{
	margin-left: 35px;
}

div.attention ul.sup{
	margin-top: 1em;
	list-style: none;
}

div.attention dl{
	position: relative;
	margin: 1em 0 0 40px;
	font-weight: bold;
}

div.attention dd{
	float: left;
	margin: 0 1.5em 30px 0;
}

div.attention img.ink{
	position: absolute;
	top: -30px;
	right: 15px;
	z-index: 5;
}

div.attention img.pen{
	position: absolute;
	bottom: -15px;
	right: -34px;
	z-index: 6;
}

div.attention img.top{
	position: absolute;
	top: 0;
	left: 0;
}

div.attention img.bottom{
	position: absolute;
	bottom: 0;
	left: 0;
}


/*--------------------------------*/

#outro{
	position: relative;
	width: 800px;
	height: 266px;
	margin: 0 auto;
	overflow: hidden;
	z-index: 15;
}

#outro img{
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFFFFF;
}

/*--------------------------------*/

#foot_menu{ margin-top: 0;}


/*--------------------------------*/
/* ミニキャラ */
/*--------------------------------*/

#no260{	position: absolute;	bottom: -9px; 	left: 90px;			z-index: 99; }
#no183{	position: absolute;	top: -49px; 	right: 110px;		z-index: 98; }

#no198{	position: absolute;	top: -17px; 	left: 50px;			z-index: 97; }

#no285{	position: absolute;	top: 750px; 	right: 30px;		z-index: 95; }
#no246{	position: absolute;	top: 0; 		right: 130px;		z-index: 94; }

#no178{	position: absolute;	top: -69px; 	left: 30px;			z-index: 93; }
#no194{	position: absolute;	top: 0; 		right: 70px;		z-index: 92; }

#no168{	position: absolute;	bottom: -73px; 	left: 30px;			z-index: 90; }

#no166{	position: absolute;	top: -125px; 	right: 100px;		z-index: 89; }


/*--------------------------------*/

