@charset "UTF-8";
/* CSS Document */
body {
margin: 0;
padding: 0;
text-align: center;
background-color: #f2f2f2;
}
div,p,h1,h2,h3,ul,li,th,td,input,textarea{
margin: 0;
padding: 0;
font-family:"Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3","メイリオ", Meiryo, "ＭＳ Ｐゴシック",sans-serif;
font-size: small;
color:#4f444e;
}
img{
border: 0;
}
a{
color: #007acf;
}
a:hover{
color:#00148f;
}
.clearr{
clear: right;
line-height:0;
}
.clearl{
clear: left;
line-height:0;
}
.clearboth{
clear:both;
line-height:0;
}

/* ======= general classes ======= */
h2,
h3{
color: #3a4e64;
}
h3{
margin:0 0 25px 0;
font-size:1.2em;
}
small{
font-size: 0.85em;
font-weight:normal;
}
strong{
font-weight:bold;
}
/* ========== centering ========== */
#home,
#works,
#support,
#corporate,
#service,
#staff,
#blog,
#contact,
#privacy{
margin: 0 auto 15px auto;
width: 920px;
border-right:1px solid #b7b7b7;
border-left:1px solid #b7b7b7;
border-bottom:1px solid #b7b7b7;
background-color:#fff;
text-align: left;
}
/* ========== home header ========== */
#header-home{
margin:0 0 1px 0;
background:url(../images/home_header_image.jpg);
height:404px;
}
#header-home img{
margin:122px 0 0 0;
}
/* ========== global header ========== */
#header{
margin:0 0 1px 0;
background:url(../images/header.jpg);
height:132px;
}
#header h1,
#header p{
display:none;
}
/* ========== home and global navigation ========== */
#home #menu{
padding:0 0 0 65px;
background-image:url(../images/navbg.jpg);
height:36px;
}
#works #menu,
#support #menu,
#corporate #menu,
#service #menu,
#staff #menu,
#blog #menu,
#contact #menu,
#privacy #menu{
padding:0 0 0 30px;
background-image:url(../images/navbg.jpg);
height:36px;
}
/* = navigation = */
#menu ul{
list-style-type: none;
}
#menu li{
float:left;
}
#menu li a{
display:block;
height: 36px;
}
#menu li a:hover{
background-position: 0 -36px;
}
#menu li a span{
display:none;
}
/* = nav00 2nd pages = */
#menu li.nav00 a{
width: 60px;
background-image:url(../images/nav00.jpg);
}
/* = nav01 = */
#menu li.nav01 a{
width: 103px;
background-image:url(../images/nav01.jpg);
}
/* = nav02 = */
#menu li.nav02 a{
width: 139px;
background-image:url(../images/nav02.jpg);
}
/* = nav03 = */
#menu li.nav03 a{
width: 102px;
background-image:url(../images/nav03.jpg);
}
/* = nav04 = */
#menu li.nav04 a{
width: 102px;
background-image:url(../images/nav04.jpg);
}
/* = nav05 = */
#menu li.nav05 a{
width: 128px;
background-image:url(../images/nav05.jpg);
}
/* = nav06 = */
#menu li.nav06 a{
width: 89px;
background-image:url(../images/nav06.jpg);
}
/* = nav07 = */
#menu li.nav07 a{
width: 127px;
background-image:url(../images/nav07.jpg);
}
/* = nav current settings = */
#works #menu li.nav01 a,
#support #menu li.nav02 a,
#corporate #menu li.nav03 a,
#service #menu li.nav04 a,
#staff #menu li.nav05 a,
#blog #menu li.nav06 a,
#contact #menu li.nav07 a{
background-position: 0 -36px;
}
/* ========== global main settings ========== */
#home #main{
margin:30px 40px 0 40px;
}
#works #main,
#support #main,
#corporate #main,
#service #main,
#staff #main,
#blog #main,
#contact #main,
#privacy #main{
margin:60px 40px 0 40px;
}
/* ========== home main ========== */
#home #main #leftcolumn{
margin:0 15px 0 0;
float:left;
width:475px;
}
#home #main #rightcolumn{
float:right;
width:350px;
}
/* = news = */
#news{
margin:0 15px 0 0;
width:320px;
float:left;
}
#news h2{
margin:0 0 10px 0;
}
#news ul{
list-style:none;
}
#news li{
margin:0 0 0.8em 0;
line-height:1.5em;
}
#news #news_table{
width:320px;
}
#news #news_table td.date{
width:80px;
vertical-align:top;
line-height:1.5em;
padding-bottom:10px;
}
#news #news_table td.text{
vertical-align:top;
line-height:1.5em;
padding-bottom:10px;
}
/* = goto_rent = */
#goto_rent{
margin:0 0 15px 0;
float:left;
}
/* = goto_works = */
#goto_works{
margin:0 0 15px 0;
}
/* = goto_rent and goto_works = */
#goto_rent img,
#goto_works img{
border:1px solid #b7b7b7;
}
#goto_rent a:hover img,
#goto_works a:hover img{
border:1px solid #3a3a3a;
}
/* = links = */
#links {
margin:0 0 30px 0;
padding:10px 0 0 0;
border-top:1px solid #b7b7b7;
}
#links img{
margin:0 3px 0 0;
border:1px solid #fff;
}
#links img.nomargin{
margin:0 0 0 0;
}
#links a:hover img{
border:1px solid #b7b7b7;
}
/* = goto_contact = */
#goto_contact {
margin:0 0 30px 0;
width:350px;
height:102px;
background-image:url(../images/home_contact.gif);
}
#goto_contact h2.phone{
display:none;
}
#goto_contact a{
display:block;
position:relative;
top:70px;
left:105px;
width:202px;
height:22px;
background-image:url(../images/home_goto_contact.jpg);
}
#goto_contact a:hover{
background-position:0 -22px;
}
#goto_contact a span{
display:none;
}
/* ========== footer ========== */
#footer{
padding:30px 40px 20px 40px;
background:url(../images/footer_bar.gif) bottom no-repeat;
background-color:#eaebed;
}
#footer p{
font-size:0.85em;
line-height:1.5em;
}
#footer p.nav{
margin:10px 0 0 0;
}
#footer p a{
color: #4f444e;
text-decoration:none;
}
#footer p a:hover{
color: #007acf;
}
#footer p.copyright{
text-align:right;
}
/* = 2nd footer = */
#footer #rightside{
float:right;
width:350px;
}
#footer #leftside{
margin:0 15px 0 0;
float:left;
width:475px;
}
#pagetop{
padding:50px 40px 10px 0;
vertical-align:bottom;
text-align:right;
font-size:0.75em;
}
#pagetop a{
color: #4f444e;
text-decoration:none;
}
#pagetop a:hover{
color: #007acf;
}
/* ========== 2nd global ========== */
/* = title column = */
#titlecolumn{
margin:0 30px 0 0;
float:left;
width:185px;
}
#maincolumn{
float:right;
width:625px;
}
/* = submenu = */
#titlecolumn ul{
margin:30px 15px 0 15px;
list-style-type:none;
}
#titlecolumn li{
margin:0 0 15px 0;
padding:0 0 0 10px;
background:url(../images/submenu_bullet.gif) no-repeat 0 4px;
line-height:1.5em;
}
#titlecolumn li a{
color: #3a4e64;
text-decoration:none;
}
#titlecolumn li a:hover{
color: #007acf;
}
/* ========== corporate ========== */
/* = message = */
#message{
margin:0 0 50px 0;
padding:0 175px 0 0;
background:url(../images/corporate_ceophoto.jpg) top right no-repeat;
}
#message h4{
font-size:1.1em;
margin:0 0 1.2em 0;
}
#message p{
line-height:1.5em;
margin:0 0 1em 0;
}
#message p.name{
text-align:right;
}
/* = data = */
#data{
margin:0 0 50px 0;
padding:0 160px 0 0;
}
#data table th,
#data table td{
padding:7px 15px;
vertical-align:top;
line-height:1.5em;
}
#data table th{
border-top:1px solid #b7b7b7;
border-right:1px solid #b7b7b7;
text-align:left;
}
#data table td{
border-top:1px solid #b7b7b7;
}
#data table th.end,
#data table td.end{
border-bottom:1px solid #b7b7b7;
}
/* = map = */
#map p{
line-height:1.5em;
margin:0 0 1em 0;
}
#map iframe{
margin:0 0 10px 0;
}
/* ========== contact ========== */
#contact p.lead{
line-height:1.5em;
margin:0 0 50px 0;
}
#contact table{
margin:0 0 25px;
}
#contact table th,
#contact table td{
padding:12px 15px;
vertical-align:top;
line-height:1.5em;
}
#contact table th{
border-top:1px solid #b7b7b7;
border-left:1px solid #b7b7b7;
text-align:left;
background-color:#efefef;
}
#contact table td{
border-top:1px solid #b7b7b7;
border-right:1px solid #b7b7b7;
}
#contact table th.end,
#contact table td.end{
border-bottom:1px solid #b7b7b7;
}
#contact input.s{
width:150px;
}
#contact input.m{
width:300px;
}
#contact input.l{
width:420px;
}
#contact textarea{
width:420px;
height:100px;
}
#contact #button{
text-align:center;
}
#contact input.button{
margin:0 0 50px 0;
width:6em;
}
#contact small{
color:#ff631e;
}
#contact #phone,
#contact #mail{
margin:0 0 50px 0;
padding:30px 0 30px 30px;
border:1px solid #b7b7b7;
width:300px;
}
#contact p.number{
padding:0 30px 0 45px;
background:url(../images/contact_phoneimage.gif) no-repeat 0 3px;
font-family:Arial, Helvetica, sans-serif;
font-size:2.5em;
}
#contact p.time{
padding:0 0 0 50px;
line-height:1.5em;
}
/* ========== support amd service ========== */
#support p.lead{
line-height:1.5em;
margin:0 0 50px 0;
}
#service p.lead{
line-height:1.5em;
margin:0 0 10px 0;
}
#support h4,
#service h4{
font-size:1.1em;
margin:0 0 0.5em 0;
}
#support p,
#service p{
line-height:1.5em;
margin:0 0 2em 0;
}
#support .box,
#service .box{
margin:0 0 50px 0;
padding:30px 50px;
border:1px solid #b7b7b7;
background:url(../images/box_bg.jpg) repeat-y;
}
#service img.system{
margin:0 0 50px 0;
}
/* ========== staff ========== */
#staff p{
line-height:1.5em;
}
#staff .photo1{
margin:0 0 15px 0;
width:625px;
height:150px;
background-color:#efefef;
}
#staff .photo3{
margin:0 0 50px 0;
width:625px;
height:150px;
background-color:#efefef;
}
#staff .photo1 img,
#staff .photo3 img{
float:left;
}
#staff .photo1 p,
#staff .photo3 p{
padding:20px 20px 0 20px;
float:left;
width:348px;
}
#staff .photo2{
margin:0 0 50px 0;
}
#staff .set{
margin:0 7px 15px 0;
width:151px;
float:left;
}
#staff .set_nomargin{
margin:0 0 15px 0;
width:151px;
float:left;
}
#staff .photo2 p{
margin:3px 0 0 0;
padding:5px 0 5px 9px;
border-left:4px solid #efefef;
}
/* ========== blog ========== */
#blog #bloglink p{
width:575px;
text-align:right;
}
/* ========== works ========== */
/* = title = */
#works #title{
margin:0 0 20px 0;
}
/* = 2nd link = */
#works #title p.link{
margin:10px 0 10px 680px;
padding:0 0 0 10px;
background:url(../images/submenu_bullet.gif) no-repeat 0 4px;
>background:url(../images/submenu_bullet.gif) no-repeat 0 6px;
line-height:1.5em;
}
#works #title p.link a{
color: #3a4e64;
text-decoration:none;
}
#works #title p.link a:hover{
color: #007acf;
}
/* = top contents = */
#works #contents{
}
#works #contents .set1,
#works #contents .set2{
margin:0 12px 12px 0;
>margin:0 12px 6px 0;
border:1px solid #b7b7b7;
width:179px;
padding:10px;
_padding:9px;
float:left;
}
#works #contents .set2{
margin:0 0 12px 0;
>margin:0 0 12px 0;
}
#works #contents .set1 p,
#works #contents .set2 p{
margin:5px 0 0 0;
line-height:1.5em;
}
.category{
background:#009999;
padding:3px 10px;
font-size:0.75em;
font-weight:bold;
color:#fff;
}
.color-reform{
background:#d36a4f;
}
.color-architect{
background:#5867a7;
}
.color-build{
background:#538f4b;
}
.color-order{
background:#4c94dd;
}
.color-shop{
background:#c47ab7;
}
#works #contents .set1 img,
#works #contents .set2 img{
border:1px solid #fff;
}
#works #contents .set1 a:hover img,
#works #contents .set2 a:hover img{
border:1px solid #b7b7b7;
}
/* = 2nd contents = */
#works #contents #info{
margin:0;
padding:19px;
border:1px solid #b7b7b7;
}
#works h3{
margin:0 0 20px 0;
font-size:1.2em;
}
#works #contents #info #story{
margin:10px 0 0 0;
padding:40px 40px 25px 150px;
background:url(../images/works_story_bg.gif) no-repeat;
}
#works #contents #info #story p{
line-height:1.5em;
margin:0 0 15px 0;
}
#works #story img{
float:right;
margin:0 0 5px 20px;
}
/* ========== privacypolicy ========== */
#privacy h4{
font-size:1.1em;
margin:0 0 0.5em 0;
}
#privacy p{
line-height:1.5em;
margin:0 0 2em 0;
}
#privacy p.right{
text-align:right;
}