@charset "utf-8";
/*
///
/// index.css ----- shirofotoのindex.html用のCSS[#v08060102]
///
/// Copyright (C) 2008, azan workshop
/// #v08052401  matt    New
/// #v08052501  matt    任意サイズ、アスペクト比の画像対応
/// #v08052502  matt    リンクボタンの対応
/// #v08053101  matt    構成のブラッシュアップ
/// #v08060101  matt    キャプション対応
/// #v08060102  matt    画像ロードの関数化と自動更新
///
/// ・このHTML構成では、ブラウザの互換モードでないと期待通り
/// 　にレイアウト表示されない。
/// 　　‐標準モードでは、コンテンツはブラウザの上下中央に
/// 　　　表示されない
/// 　　‐互換モードにするには、DOCTYPE宣言からURLを除く
///
/// ・#v08053101まではAboutなどのボタンの<a>タグに対して
/// 　position : absolute; と位置の指定をしていたが、
/// 　この方法ではIE 5.0でリンクが有効にならないことが判明。
/// 　#v08053101では外側を<div>で囲って、それに対して設定する
/// 　ことで対処
///
/// ・動作確認環境
/// 　　‐Windows版   IE 5.0、5.5、6.0、7.0
/// 　　‐Windows版   Firefox 2.0
/// 　　‐Macintosh版 Safari 3.1
/// 　　‐Macintosh版 Firefox 2.0
///
*/

  
  body {
    margin              : 0;
    padding             : 0;
    background-color    : #ffffff;
      /*background-image    : url(../top/background.png); */

      /*背景のPNG画像の背景色は#ccccccだが、background-colorを
      #ccccccにしても色が合わない。
      そのため、同じ背景色の1pxのPNG画像をbackground-imageと
      して並べておく。
    */
  }
  
  a {
  outline: none;
  outline-width: 0;
  }
  
  table.Background {
    margin              : 0;
    padding             : 0;
    width               : 100%;
    height              : 100%;
    border-collapse     : collapse; /* add #v09011301 */
  }
  
  table.Background td {
   	margin:auto;
    vertical-align      : top;      /* add #v09011301 */
    padding-top         : 0;        /* add #v09011301 */
  }
  
  div.Content {
    position            : relative;
    /* top              : 0;        cut #v09011301 */
    margin              : auto;
    height           :  626px;    /*cut #v09011301 */
    width               :  939px;
	overflow:hidden;
    /*
      ここでheightとwidthを指定しないと、Safariで写真フレーム
      の位置がずれてしまうことに注意
    */
  }
  
  div.Frame {
    position            : absolute;
    top                 : 28;
    left                : 338;
    /* 
      このtopとleftの設定を除くとSafariでちらつく。
      ただし、縦長の画像であれば、これを設定してもちらつく
    */
  }
  
  img.Frame {
    visibility          : hidden;
  }
  
  img.Photo {
    position            : absolute;
    visibility          : hidden;
    /* 
      hiddenにしておくと、画像ファイルが存在しないときに
      エラーアイコンが表示されないというメリットもある。
      画像ファイルが存在しないときに、説明画像を表示する
      というアイデアもある
    */
  }
  
  img.Button {
    border              : none;
  }
  
  
    div.Logo {
    position            : absolute;
    top                 : 32px;
    left                : 63px;
  }

    div.address {
    position            : absolute;
    top                 : 420px;
    left                : 18px;
  }
  
    div.Top {
    position            : absolute;
    top                 : 170px; 
    left                : 23px;
  }
  
  div.PhotoCabi {
    position            : absolute;
    top                 : 170px;
    left                : 141px;
  }

    div.Profile {
    position            : absolute;
    top                 : 312px;
    left                : 23px;
  }
  
    div.WORKs {
    position            : absolute;
    top                 : 312px;
    left                : 141px;
  }
  
    div.Diary {
    position            : absolute;
    top                 : 479px;
    left                : 23px;
  }

    div.Door6 {
    position            : absolute;
    top                 : 479px;
    left                : 141px;
  }

    div.Line {
    position            : absolute;
    top                 : 25px;
    left                : 383px;
  }

    div.h_home {
    position            : absolute;
    top                 : 60px;
    left                : 630px;
  }

    div.h_site {
    position            : absolute;
    top                 : 6px;
    left                : 700px;
  }

    div.h_event {
    position            : absolute;
    top                 : 26px;
    left                : 576px;
  }

    div.h_soudan {
    position            : absolute;
    top                 : 26px;
    left                : 700px;
  }

    div.h_kigyo {
    position            : absolute;
    top                 : 26px;
    left                : 490px;
  }

    div.topic {
    position            : absolute;
    top                 : 340px;
    left                : 385px;
  }

    div.canpaign {
    position            : absolute;
    top                 : 400px;
    left                : 15px;
  }

    div.column {
    position            : absolute;
    top                 : 345px;
    left                : 20px;
  }

    div.shop {
    position            : absolute;
    top                 : 550px;
    left                : 20px;
  }

    div.UC {
    position            : absolute;
    top                 : 250px;
    left                : 70px;
    font-size:30px;
  }

.UC-text  {
    font-size:30px;
    line-height:120%;
    width:550px;
    margin:0 auto;
    color:green;
	font-family: sans-serif;

    div.tachikawa {
    position            : absolute;
    top                 : 660px;
    left                : 20px;
  }


    div.kichijoji {
    position            : absolute;
    top                 : 720px;
    left                : 20px;
  }
    div.Topics_bak {
    position            : absolute;
    top                 : 300px;
    left                : 263px;
  }

	iframe.Topics_iframe {
	position            : absolute;
	border              : none;
	top                 : 320px;
	left                : 263px;
	width : 376px;
	height : 200px;

  }

    div.Topics {
    position            : absolute;
    top                 : 320px;
    left                : 285px;
  }

    div.smalltext {
    position            : absolute;
    top                 : 345px;
    left                : 285px;
    text-align:left
  }

    .smalltext{
	font-size:0.8em;
	line-height:150%;
	width:340px;
	margin:0 auto;
	font-family: sans-serif;
  }

    div.topic-text {
    position            : absolute;
    top                 : 380px;
    left                : 390px;
    text-align:left
  }

.topic-text  {
    font-size:11px;
    line-height:160%;
    width:360px;
    margin:0 auto;
	font-family: sans-serif;

  }

    div.hino-text {
    position            : absolute;
    top                 : 630px;
    left                : 20px;
    text-align:left
  }

.hino-text  {
    font-size:11px;
    line-height:160%;
    width:360px;
    margin:0 auto;
	font-family: sans-serif;

  }

    div.tachikawa-text {
    position            : absolute;
    top                 : 690px;
    left                : 20px;
    text-align:left
  }

.tachikawa-text  {
    font-size:11px;
    line-height:160%;
    width:360px;
    margin:0 auto;
	font-family: sans-serif;

  }


    div.kichijoji-text {
    position            : absolute;
    top                 : 750px;
    left                : 20px;
    text-align:left
  }

.kichijoji-text  {
    font-size:11px;
    line-height:160%;
    width:360px;
    margin:0 auto;
	font-family: sans-serif;

  }

    div.catch-text {
    position            : absolute;
    top                 : 12px;
    left                : 10px;
    text-align:left
  }

.catch-text  {
    font-size:9px;
    line-height:120%;
    width:550px;
    margin:0 auto;
    color:green;
	font-family: sans-serif;

  }


    div.Footer {
    position            : absolute;
    top                 : 770px;
    left                : 5px;
    text-align:center
  }

.Footer  {
    font-size:11px;
    line-height:160%;
    width:660px;
    margin:0 auto;
	font-family: sans-serif;

  }

.text11         {
	 color: #222222; 
	font-size: 11px; 
	line-height: 16px; 
	text-decoration: none
 }

a        {
	color: #0000cc;
	font-size: 11px;
}

a:hover   {
	color: #900;
	font-size: 11px;
	 /* line-height: 16px;
	text-decoration: none */
}

  /* add #v08060101 */
  iframe.Caption {
    display             : none;
  }
  
  div.Caption {
    display             : none;
    margin              : 0 12px;
    /* 
    背景を白くするかどうかは好み
    background-color    : #ffffff;
    */
    text-align          : left;
    font-size           : 0.9em;
    line-height         : 1.4em;
  }
  /* end #v08060101 */
  
  /* add #v08060102 */
  div.Option {
    position            : absolute;
    top                 : 900px;
    left                : 300px;
    color               : gray;
    font-size           : 0.9em;
  }
  /* end #v08060102 */