@charset "utf-8";
/* CSS Document */


/* ********************************************************************************
 * Kyle room Layout
 * ******************************************************************************** */
body {background:url(../images/common/bg_popup-page.gif) repeat-x left top #00070d; text-align:center;}
	#wrapper {width:500px; margin:0 auto; text-align:left; position:relative;}
	body#room #wrapper {background:url(../images/room/bg_room.jpg) no-repeat left top;}
	body#wallpaper #wrapper {background:url(../images/room/bg_wallpaper.jpg) no-repeat left top;}
	body#sound #wrapper {background:url(../images/room/bg_sound.jpg) no-repeat left top;}
	body#anime #wrapper {background:url(../images/room/bg_anime.jpg) no-repeat left top;}
	
		#main-title {position:absolute; left:27px; top:20px;}
		#logo {position:absolute; top:17px; right:30px;}
		#return {position:absolute; top:72px; right:30px;}
			#return a {display:block; overflow:hidden; height:0; width:63px; padding-top:18px; background:url(../images/room/btn_top.gif) no-repeat left top;}
			#return a:hover {background:url(../images/room/btn_top_on.gif) no-repeat left top;}
			
		#return_02 {position:absolute; top:72px; right:30px;}
			#return_02 a {display:block; overflow:hidden; height:0; width:120px; padding-top:18px; background:url(../images/room/btn_return.gif) no-repeat left top;}
			#return_02 a:hover {background:url(../images/room/btn_return_on.gif) no-repeat left top;}
			
		#return03 {position:absolute; top:0px; right:0px;}
			#return03 a {display:block; overflow:hidden; height:0; width:63px; padding-top:18px; background:url(../images/room/btn_top.gif) no-repeat left top;}
			#return03 a:hover {background:url(../images/room/btn_top_on.gif) no-repeat left top;}
			
		#contents {height:473px;}
	
		/* index.html */
		#contents .btn01,
		#contents .btn02,
		#contents .btn03 {position:relative;}
		#contents .btn01 .new,
		#contents .btn02 .new,
		#contents .btn03 .new {position:absolute;}
		
		#contents .btn01 .new {top:-3px; right:-8px;}
		#contents .btn02 .new {top:-3px; right:-8px;}
		
		#contents .btn01 {position:absolute; top:206px; left:44px;}
			#contents .btn01 a {display:block; overflow:hidden; height:0; width:113px; padding-top:116px; background:url(../images/room/btn_wallpaper.jpg) no-repeat left top;}
			#contents .btn01 a:hover {background:url(../images/room/btn_wallpaper_on.jpg) no-repeat left top;}
		#contents .btn02 {position:absolute; top:155px; left:227px;}
			#contents .btn02 a {display:block; overflow:hidden; height:0; width:113px; padding-top:116px; background:url(../images/room/btn_sound.jpg) no-repeat left top;}
			#contents .btn02 a:hover {background:url(../images/room/btn_sound_on.jpg) no-repeat left top;}
		#contents .btn03 {position:absolute; top:294px; left:332px;}
			#contents .btn03 a {display:block; overflow:hidden; height:0; width:135px; padding-top:126px; background:url(../images/room/btn_anime.jpg) no-repeat left top;}
			#contents .btn03 a:hover {background:url(../images/room/btn_anime_on.jpg) no-repeat left top;}
		
		/* wallpaper.html */
		#contents #wp-list {position:absolute; top:160px; left:60px;}
			#contents #wp-list li {float:left; margin:0 7px 18px 0; position:relative;}
			#contents #wp-list li a:hover img {opacity:0.8; filter:alpha(opacity=80);}
			#contents #wp-list li img.new {position:absolute;}
				#contents #wp-list li.wp02 img.new {top:-5px; right:-5px;}
				#contents #wp-list li.wp03 img.new {top:-5px; right:-5px;}
				#contents #wp-list li.wp04 img.new {top:-5px; right:-5px;}
			
		#contents #txt01 {position:absolute; top:95px; left:60px;}
		#contents #howto {position:absolute; top:143px; right:60px;}
			#contents #howto a:hover img {opacity:0.7; filter:alpha(opacity=70);}
		#contents #sample {position:absolute; top:165px; left:60px;}
		#contents #size {width:378px; height:41px; position:absolute; top:400px; left:60px;}
			#contents #size li {float:left; height:21px; margin:0;}
			#contents #size li a {display:block; overflow:hidden; height:0;}
			
			#contents #size li.size01 a {background:url(../images/room/btn_01.gif) no-repeat left top; padding-top:21px; width:127px;}
			#contents #size li.size02 a {background:url(../images/room/btn_02.gif) no-repeat left top; padding-top:21px; width:125px;}
			#contents #size li.size03 a {background:url(../images/room/btn_03.gif) no-repeat left top; padding-top:21px; width:126px;}
			#contents #size li.size04 a {background:url(../images/room/btn_04.gif) no-repeat left top; padding-top:20px; width:127px;}
			#contents #size li.size05 a {background:url(../images/room/btn_05.gif) no-repeat left top; padding-top:20px; width:125px;}
			#contents #size li.size06 a {background:url(../images/room/btn_06.gif) no-repeat left top; padding-top:20px; width:126px;}
			
			#contents #size li.size01 a:hover {background:url(../images/room/btn_01_on.gif) no-repeat left top; padding-top:21px; width:127px;}
			#contents #size li.size02 a:hover {background:url(../images/room/btn_02_on.gif) no-repeat left top; padding-top:21px; width:125px;}
			#contents #size li.size03 a:hover {background:url(../images/room/btn_03_on.gif) no-repeat left top; padding-top:21px; width:126px;}
			#contents #size li.size04 a:hover {background:url(../images/room/btn_04_on.gif) no-repeat left top; padding-top:20px; width:127px;}
			#contents #size li.size05 a:hover {background:url(../images/room/btn_05_on.gif) no-repeat left top; padding-top:20px; width:125px;}
			#contents #size li.size06 a:hover {background:url(../images/room/btn_06_on.gif) no-repeat left top; padding-top:20px; width:126px;}
		
		#prev {position:absolute; left:28px; top:260px;}
		#next {position:absolute; right:28px; top:260px;}
			#prev a:hover img,
			#next a:hover img{opacity:0.7; filter:alpha(opacity=70);}
		
		
		/* howto.html */
		#contents h2 {position:absolute; top:85px; left:30px;}
		#contents #back {position:absolute; top:82px; right:30px;}
			#contents #back a:hover img {opacity:0.7; filter:alpha(opacity=70);}
		#contents .txt_win {position:absolute; top:117px; left:30px;}
		#contents .txt_mac {position:absolute; top:243px; left:30px;}
		#contents #attention {position:absolute; top:421px; left:44px;}
		
		
		/* sound.html */
		#sound #main-title {top:23px;}
		#sound #contents h2 {position:absolute; top:107px; left:30px;}
		#sound .txt_sound {position:absolute; top:142px; left:30px;}
		#sound .sound_title {position:absolute; top:207px; left:27px;}
		#sound #flash_sound {position:absolute; top:260px; left:30px;}
		#sound #return {position:absolute; top:74px; right:30px;}
		
		
		/* anime.html */
		#anime #main-title {top:24px;}
		#anime #flash-area {position:absolute; top:76px; left:30px;}
		
	/* Footer */
	#footer {position:relative;}
		#footer a {display:block; overflow:hidden; height:0; padding-top:27px; background:url(../images/room/btn_close.gif) no-repeat left top;}
			#footer a:hover {background:url(../images/room/btn_close_on.gif) no-repeat left top;}