@charset "shift-jis";

/* ===================================================================

	CSS information

	file name  :  style.css

	style info :  /3ds//hardware/pack/abej/

=================================================================== */

/*--- reset */

body {font:13px/1.4 "ＭＳ Ｐゴシック","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",Osaka,verdana,arial,clean,sans-serif;*font-size:small;*font:x-small;color: #4b4b4b;}



body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,

form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}

html {overflow-y: scroll;}

table{border-collapse:collapse;border-spacing:0;}

caption,th {text-align: left;}

q:before,q:after {

	content: '';

}

img,abbr,acronym,fieldset {

	border: 0;

	vertical-align:bottom;

}

ul,li {list-style-type: none;}

a {outline: none;}

/*to enable resizing for IE*/

input,textarea,select{*font-size:100%;}

/*because legend doesn't inherit in IE */

input {*padding-top: 3px;}



/*ClearFix-*/

.clearfix:after {

	content:"";

	display:block;

	height:0;

	clear:both;

	visibility: hidden;

}

.clearfix {

	display:inline-block;

}

/* Hides from IE-mac \*/

	* html .clearfix {height: 1%;}

	.clearfix {display: block;}

/* End hide from IE-mac */









body {

	background: url(../img/bg_main.png) top left repeat;

}

#container {

	min-width: 900px;

	background: url(../img/bg_pattern.png) bottom left repeat-x;

}

#wrapper {

	width: 900px;

	margin: 0 auto;

	border: none;

}



#section1 {

	position: relative;

	width: 900px;

	height: 154px;

	margin: 0 auto;

}

#section1 .logo1 {

	position: absolute;

	top: 19px;

	left: 24px;

}

#section1 .logo2 {

	position: absolute;

	top: 33px;

	left: 630px;

}



#section2 {

	position: relative;

	width: 900px;

	height: 640px;

	margin: 0 auto;

}

#section2 .chara1 {

	position: absolute;

	top: 109px;

	left: 730px;

}

#section2 .chara2 {

	position: absolute;

	top: 391px;

	left: 1px;
	
	z-index:10;

}

#section2 h1 {

	position: absolute;

	top: 0;

	left: 190px;

}

#section2 .img1 {

	position: absolute;

	top: 41px;

	left: 131px;

}

#section2 .text1 {

	position: absolute;

	top: 441px;

	left: 190px;

}

#section2 .text2 {

	position: absolute;

	top: 524px;

	left: 153px;

}

#section2 .text3 {

	position: absolute;

	top: 250px;

	left: 640px;

}

#section2 .atn {

	position: absolute;

	top: 595px;

	left: 315px;

}



#section3 {

	position: relative;

	width: 900px;

	height: 630px;

	margin: 0 auto;
	
}

#section3 .pack dt {

	position: absolute;

	top: 37px;

	left: 64px;

}

#section3 .pack .text {

	position: absolute;

	top: 208px;

	left: 64px;

}

#section3 .pack .btn {

	position: absolute;

	top: 380px;

	left: 81px;

}

#section3 .box {

	width: 900px;

	height: 568px;

	background: url(../img/bg_panel.png) 295px 36px no-repeat;

}

#section3 .box h2 {

	position: absolute;

	top: 61px;

	left: 332px;

}

#section3 .box .img1 {

	position: absolute;

	top: 117px;

	left: 332px;

}

#section3 .box .text1 {

	position: absolute;

	top: 157px;

	left: 582px;

}

#section3 .box .img2 {

	position: absolute;

	top: 294px;

	left: 332px;

}

#section3 .box .text2 {

	position: absolute;

	top: 294px;

	left: 582px;
}

#section3 dt.text2_note {

	position: absolute;

	top: 400px;

	left: 350px;

}

#section3 dd.text2_btn {

	position: absolute;

	top: 433px;

	left: 360px;

}


#section3 .box .text3 {

	position: absolute;

	top: 484px;

	left: 332px;

}

#section3 .btn {

	position: absolute;

	top: 570px;

	left: 332px;

}

dd #link{
	position: absolute;

	top: 370px;

	left: 332px;
	border:1px solid red;
}