/*
	 *  @2009
	 * Screen CSS
	 *
	 *
	 */


@import 'reset.css';


html { color: #ccc; background: #0e0e0e url(/image/bg-hp-html.png) repeat-x 0 0; }
body { padding: 100px 0 0; }

#content:after { display: block; height: 0; clear: both; visibility: hidden; content: '.' } /* 6, 7 */

#page { width: 655px; height: 402px; margin: 0 auto; padding: 40px 0 0; background: url(/image/bg-hp-page.jpg) no-repeat 0 0; }

/* top */
#logo { display: none; }

/* content */
#boxs { width: 560px; margin: 155px auto 0; }
#boxs .box { width: 178px; float: left; margin: 0 3px; }
#boxs .box h2 { height: 95px; font-size: 19px; }
#boxs .box h2 a { position: relative; display: block; width: 100%; height: 100%; }
#boxs .box h2 strong { display: none; }
#boxs .box h2 span { position: absolute; left: 9px; bottom: 5px; width: 160px; color: #faa; font-weight: bold; text-transform: uppercase; text-align: center; }
#boxs .box-1 h2 { background: url(/image/bg-hd-box-1.png) no-repeat 0 0; }
#boxs .box-2 h2 { background: url(/image/bg-hd-box-2.png) no-repeat 0 0; }
#boxs .box-3 h2 { background: url(/image/bg-hd-box-3.png) no-repeat 0 0; }
#boxs .box div { height: 100px; margin: 25px 0 0; padding: 5px 10px; background: url(/image/bg-hp-box-desc.png) no-repeat 0 0; }
#boxs .box:hover div { color: #faa; }