@charset "UTF-8";
/* --- reset --- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,varb,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}/*html5 display-role reset for older browsers*/
body{line-height:1;}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
/* --- reset --- */
html{overflow-y:scroll;}
/* --- typo --- */
strong{font-weight:bold;}
a:link{outline:none;}
a:hover{text-decoration:none;}
a:active,a:focus{outline:none;}
html{-webkit-font-smoothing:antialiased;}
/* --- layout --- */
body{background-image: url('../img/bg.png'); background-attachment: fixed; font-family: "Comic Sans MS";}
#header{background-color: #666; height: 130px; width: 900px;}
#footer{background-color: #666; bottom: 0px; position: absolute; width: 870px; padding-top: 10px; padding-bottom: 10px; padding-left:15px; padding-right:15px;}
.footer_link{font-family: "Microsoft Sans Serif"; font-size:14px; color:#FFF; text-decoration:none;}
.footer_link:hover{color:#CCC;}
#nav{position:absolute; width:900px; height:30px; background-color: #999; margin-top:-30px;}
#section{margin-top: 50px; margin-bottom:60px; color:#000; font-size:16px; padding-left: 20px; padding-right: 20px; line-height: 1.3;}
#section_small{margin-top: 50px; margin-bottom:60px; color:#000; font-size:16px; padding-left: 120px; padding-right: 120px; line-height: 1.3;}
span{height: 1px; display: block; background-color: #9C0; width: 570px; float: left; margin-left: 25px; margin-top: 8px;}

h1{color:#000; font-size:24px; text-align:center; padding-bottom:50px; font-weight: bold;}
h2{font-size:18px;padding-bottom: 10px; padding-top: 30px; font-weight: bold;}

p{padding-bottom: 10px;}
.li_info{padding-bottom:2px;}
.li_info:before {content: "- ";}

#box{
		background-color: #FFF;
		width: 900px;
		min-height: 100%;
		overflow: hidden !important;
		height: auto !important;
		height: 100%;
		
		min-height: 100%;
		
		margin-left: -450px;
  		position: absolute;
  		left: 50%;
		
		-moz-box-shadow: 0 0 15px #999;
 		-webkit-box-shadow: 0 0 15px #999;
		box-shadow: 0 0 15px #999;
	}
	

#logo{background-image: url('../img/logo.png'); width:629px; height:56px; position:absolute; top:22px; left: 150px;}
#icon{background-image: url('../img/icon.png'); width:90px; height:80px; position:absolute; top:10px; left: 30px;}

#sel_left{float: left; width: 160px; height: 375px; padding-right: 20px; text-align:left;}
#sel_icon{float: left; width: 500px; height: 375px; background-image: url('../img/bg_index.jpg');  margin-bottom:50px;}
#sel_right{float: left; width: 160px; height: 375px; padding-left: 20px;text-align:right;}
.a_sel{color:#000; text-decoration:none;}
.a_tile{color:#000; text-decoration:none;}
.a_sel:hover{opacity: 0.7;
	filter: alpha(opacity=7);
 	-webkit-transition: opacity 0.2s linear;}
.li_sel{padding-bottom:4px;}

.right{float:right;padding-bottom: 0px; padding-left:4px; padding-right:4px;}
.left{float:left;padding-bottom: 0px;}
.align_left{text-align:left;}
.align_right{text-align:right;}
.align_center{text-align:center;}

.menu{color:#FFF; font-size:20px; text-decoration:none;}
.li_menu{float: left; text-align:center; padding-top:5px;padding-bottom:5px; padding-left: 10px; padding-right: 10px; margin-left:15px;}
.li_menu_active{background-image: url('../img/menu.png'); text-align:center; float: left; padding-top:5px;padding-bottom:5px; padding-left: 10px; padding-right: 10px; margin-left:15px;}
.li_menu:hover{background-image: url('../img/menu.png');}

.note{font-size:12px; padding-top: 10px;}
.txt_link{color:#000;}

.tile1{background-image: url('../img/bedroom.png'); background-repeat: no-repeat; height:100px; width:100px; float:left; margin-left: -450px; position:fixed; left: 50%; text-align: right;
 -webkit-transition-property: width;
 -webkit-transition-duration: 0.2s;
 
 -moz-transition-property: width ;
 -moz-transition-duration: 0.2s;
 
 transition-property: width;
 transition-duration: 0.2s;
 
 -o-transition-property: width;
 -o-transition-duration: 0.2s;
 
 -moz-box-shadow: 0 0 15px #999;
 -webkit-box-shadow: 0 0 15px #999;
 box-shadow: 0 0 15px #999;}
 
.tile2{background-image: url('../img/kitchen.png'); background-repeat: no-repeat; height:100px; width:100px; float:left; margin-left: -450px; margin-top: 120px; position:fixed; left: 50%; text-align: right;

 -webkit-transition-property: width;
 -webkit-transition-duration: 0.2s;
 
 -moz-transition-property: width ;
 -moz-transition-duration: 0.2s;
 
 transition-property: width;
 transition-duration: 0.2s;
 
 -o-transition-property: width;
 -o-transition-duration: 0.2s;
 
 -moz-box-shadow: 0 0 15px #999;
 -webkit-box-shadow: 0 0 15px #999;
 box-shadow: 0 0 15px #999;}
 
.tile3{background-image: url('../img/livingroom.png'); background-repeat: no-repeat; height:100px; width:100px; float:left; margin-left: -450px; margin-top: 240px; position:fixed; left: 50%; text-align: right;
 -webkit-transition-property: width;
 -webkit-transition-duration: 0.2s;
 
 -moz-transition-property: width ;
 -moz-transition-duration: 0.2s;
 
 transition-property: width;
 transition-duration: 0.2s;
 
 -o-transition-property: width;
 -o-transition-duration: 0.2s;
 
 -moz-box-shadow: 0 0 15px #999;
 -webkit-box-shadow: 0 0 15px #999;
 box-shadow: 0 0 15px #999;}
 
.tile4{background-image: url('../img/diningroom.png'); background-repeat: no-repeat; height:100px; width:100px; float:right; margin-right: -450px; position:fixed; right: 50%;
 -webkit-transition-property: width;
 -webkit-transition-duration: 0.2s;
 
 -moz-transition-property: width ;
 -moz-transition-duration: 0.2s;
 
 transition-property: width;
 transition-duration: 0.2s;
 
 -o-transition-property: width;
 -o-transition-duration: 0.2s;
 
 -moz-box-shadow: 0 0 15px #999;
 -webkit-box-shadow: 0 0 15px #999;
 box-shadow: 0 0 15px #999;}
 
.tile5{background-image: url('../img/bathroom.png'); background-repeat: no-repeat; height:100px; width:100px; float:right; margin-right: -450px; margin-top: 120px; position:fixed; right: 50%;
 -webkit-transition-property: width;
 -webkit-transition-duration: 0.2s;
 
 -moz-transition-property: width ;
 -moz-transition-duration: 0.2s;
 
 transition-property: width;
 transition-duration: 0.2s;
 
 -o-transition-property: width;
 -o-transition-duration: 0.2s;
 
 -moz-box-shadow: 0 0 15px #999;
 -webkit-box-shadow: 0 0 15px #999;
 box-shadow: 0 0 15px #999;}
 
 .tile6{background-image: url('../img/terrace.png'); background-repeat: no-repeat; height:100px; width:100px; float:right; margin-right: -450px; margin-top: 240px; position:fixed; right: 50%;
 -webkit-transition-property: width;
 -webkit-transition-duration: 0.2s;
 
 -moz-transition-property: width ;
 -moz-transition-duration: 0.2s;
 
 transition-property: width;
 transition-duration: 0.2s;
 
 -o-transition-property: width;
 -o-transition-duration: 0.2s;
 
 -moz-box-shadow: 0 0 15px #999;
 -webkit-box-shadow: 0 0 15px #999;
 box-shadow: 0 0 15px #999;}
 
 
.tile1:hover{width:160px;}
.tile2:hover{width:160px;}
.tile3:hover{width:160px;}
.tile4:hover{width:160px;}
.tile5:hover{width:160px;}
.tile6:hover{width:160px;}

.tile_text{padding-top:100px;}