/*  キホン
---------------------------------------------*/

* {
	margin: 0;
	padding: 0;
	font-size: 100%;
}


body {
   font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
   メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", Helvetica,
   Arial, sans-serif;
   font-size: 75%;
   line-height: 1.5;　/* まぁ適当に変更 */
   color: #333333;　/* まぁ適当に変更 */
}

html>/**/body {
   font-size: 12px; /* IE以外で12pxを指定 */
}


img {
	border: none;
	vertical-align: top;
}


p {
   font-size: 83%;　/* 10/12=83.333 を切り上げ */
   margin-bottom: 0px ; margin-top: 0px ; padding-bottom:0px ; padding-top:0px ;
}


a  {
   text-decoration: none;
}


a:active {
   color: #000000;
}


a:link {
   color: #000000;
}


a:visited {
   color: #000000;
}


a:hover {
   color: orange;
}


H1 {
   font-size: 160%;　/* 10/12=83.333 を切り上げ */
   font-weight: normal;
   margin-bottom: 0px ; margin-top: 0px ; padding-bottom:10px ; padding-top:0px ;
}


H2 {
   font-size: 110%;　/* 10/12=83.333 を切り上げ */
   margin-bottom: 0px ; margin-top: 0px ; padding-bottom:5px ; padding-top:20px ;
   color: orange;
}


p.news {
   font-size: 100%;
   margin-bottom: 0px ; margin-top: 0px ; padding-bottom:0px ; padding-top:0px ;
   line-height: 1.5;
}


p.concept {
   font-size: 110%;
   margin-bottom: 0px ; margin-top: 0px ; padding-bottom:0px ; padding-top:0px ;
   line-height: 1.5;
}


p.shoptext {
   width: 413px; /* 700 - 20 - 2 = 668 */
   height: 70px; /* 600 - 20 -2 = 578 */
   border: 1px solid #000000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -45px 0 0 -275px; /* ボックス全体を天地左右サイズの半分移動 */
   font-size: 110%;
   line-height: 1.5;
   padding: 35px 10px 10px 125px; 
   background: url(../img/mark/wow.gif) no-repeat ;
   background-position: 65px 30px;
}


p.w_catch1 {
   width: 450px; /* 700 - 20 - 2 = 668 */
   height:150px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: 170px 0 0 -325px;
   font-size: 150%;
   line-height: 1.25;
}


p.w_catch2 {
   font-size: 140%;
   line-height: 1.25;
}





/*  ナビ
---------------------------------------------*/

#globalNav {
   width: 375px; /* 720 - 20 - 2 = 698 */
   height: 20px; /* 500 - 20 -2 = 478 */
   position: absolute; /* bodyに対する位置指定 */
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -240px 0 0 -30px; /* ボックス全体を天地左右サイズの半分移動 */
	width: 375px;
	height: 20px;
	list-style-type: none;
	background: #FFFFFF url(../img/gNavi.gif) left top no-repeat ;
}

#globalNav li {
	float: left;
	width: 75px;
}

#globalNav li a {
	display: block;
	overflow: hidden;
	width: 100%;
	height: 0 !important;
	height /**/:20px;
	padding-top: 20px;
	background-image: url(../img/gNavi.gif);
	color: #FFFFFF;
}



/*  ナビ・背景画像のコントロール
---------------------------------------------*/
	
	/* 通常 */
	#nav01 a { background-position:  0     0; }
	#nav02 a { background-position: -75px  0; }
	#nav03 a { background-position: -150px 0; }
	#nav04 a { background-position: -225px 0; }
	#nav05 a { background-position: -300px 0; }
	
	/* オンマウス */
	#nav01 a:hover { background-position:  0     -19px; }
	#nav02 a:hover { background-position: -75px  -19px; }
	#nav03 a:hover { background-position: -150px -19px; }
	#nav04 a:hover { background-position: -225px -19px; }
	#nav05 a:hover { background-position: -300px -19px; }





/*  mailto
---------------------------------------------*/

.mailto {
   width: 250px;
   height: 20px; 
   position: absolute;
   top: 50%;
   left: 50%;
   margin: 270px 0 0 -325px;
   
}
  

.mailto a {
	background-image:url(../img/mail_bk.gif);
	background-repeat:no-repeat;
	padding-left:20px

	}
	

.mailto a:hover	{
	background-image:url(../img/mail_or.gif);
	background-repeat:no-repeat;
	padding-left:20px

	}





/*  リスト＠会社概要
---------------------------------------------*/

dl {
   margin-bottom: 10px ; margin-top: 0px ; padding-bottom:0px ; padding-top:0px ;
   font-size: 100%;　/* 10/12=83.333 を切り上げ */
}


dl.info dd {
   font-size: 100%;
   margin: 0,0,0,;
}





/*  リスト＠施工例インデックス
---------------------------------------------*/

#worksIndex {
	float: left;
	margin: 0 10px 0 0; 
 } 


.clear {
	clear: both;
	height: 43px; 
 } 
 

p.workIndexText {
   font-size: 110%;
   line-height: 1.5;
}


span.workIndexNum {
	color: orange;
	font-weight: bold; 
}


span.workSpec {
   font-size: 84%;
   line-height: 2;}





/*  リスト＠データシート
---------------------------------------------*/

dl.datasheet dd {
   margin: -2em 0 0 80px;
   line-height: 2.5;　/* まぁ適当に変更 */
}






/*  ボックス
---------------------------------------------*/

#maincontainer  {

   width: 700px; /* 700 - 20 - 2 = 668 */
   height: 600px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -300px 0 0 -350px; /* ボックス全体を天地左右サイズの半分移動 */
   background: url(../img/waku.gif) ;
}


#catch1  {

   width: 600px; /* 700 - 20 - 2 = 668 */
   height: 50px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -185px 0 0 -300px; /* ボックス全体を天地左右サイズの半分移動 */
}


#catch2  {

   width: 280px; /* 700 - 20 - 2 = 668 */
   height: 50px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -185px 0 0 40px; /* ボックス全体を天地左右サイズの半分移動 */
}


#contents1  {

   width: 280px; /* 700 - 20 - 2 = 668 */
   height: 390px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -132px 0 0 -300px; /* ボックス全体を天地左右サイズの半分移動 */
}


#contents2  {

   width: 280px; /* 700 - 20 - 2 = 668 */
   height: 390px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -132px 0 0 37px; /* ボックス全体を天地左右サイズの半分移動 */
}


#contents3  {

   width: 600px; /* 700 - 20 - 2 = 668 */
   height: 390px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -132px 0 0 -300px; /* ボックス全体を天地左右サイズの半分移動 */
}


#illust1  {

   width: 360px; /* 700 - 20 - 2 = 668 */
   height: 370px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -190px 0 0 -500px; /* ボックス全体を天地左右サイズの半分移動 */
}


#illust2  {

   width: 220px; /* 700 - 20 - 2 = 668 */
   height: 315px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -140px 0 0 -450px; /* ボックス全体を天地左右サイズの半分移動 */
}


#works_top_img  {

   width: 650px; /* 700 - 20 - 2 = 668 */
   height:425px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -195px 0 0 -325px; /* ボックス全体を天地左右サイズの半分移動 */
}



#w_arrow {
   width: 100px;
   height: 21px; 
   position: absolute; /* bodyに対する位置指定 */
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: 213px 0 0 225px; /* ボックス全体を天地左右サイズの半分移動 */
   	background-image:url(../img/mark/arrow.gif);
	background-repeat:no-repeat;
	background-position: right center; 
	line-height: 1.6; 
}



.mailto a {
	background-image:url(../img/mail_bk.gif);
	background-repeat:no-repeat;
	padding-left:20px

	}






#iwashi  {

   width: 135px; /* 700 - 20 - 2 = 668 */
   height: 180px; /* 600 - 20 -2 = 578 */
   border: 0px solid #000;
   position: absolute; /* bodyに対する位置指定 */  
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: 50px 0 0 63px; /* ボックス全体を天地左右サイズの半分移動 */
}








/*  ヘッダー＆フッター
---------------------------------------------*/

#logo {
   width: 200px;
   height: 50px; 
   position: absolute; /* bodyに対する位置指定 */
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: -280px 0 0 -325px; /* ボックス全体を天地左右サイズの半分移動 */
}


#copywrite {
   width: 250px;
   height: 20px; 
   position: absolute; /* bodyに対する位置指定 */
   top: 50%; /* ボックスの左上カドを天地のセンターに */
   left: 50%; /* ボックスの左上カドを左右のセンターに */
   margin: 270px 0 0 117px; /* ボックス全体を天地左右サイズの半分移動 */
   color: #CCCCCC;

}