
/*** ベース設定 *********************************/

table,thead,tbody{
  text-align: center; 
  vertical-align: top; 
  border: 0px; 
} 

body{
  background-color: whitesmoke; 
}

table.base{
  text-align: center;
  width : 800px;
  height: 600px;
  background-color: white; 

  border-width: thin;
  border-color: lightgrey gray gray lightgrey;
  border-style: solid;

  padding: 0px;
  border-spacing: 0px;
}

tfoot{
  text-align: left; 
  vertical-align: bottom; 
}

tr.footer{
  text-align: left; 
  vertical-align: top;
} 

td.footer{
  text-align: left; 
  padding: 10px;
} 

/*** ＭＥＮＵ設定 *******************************/

ul li{
  float: left;
  list-style-type: none;
}

li a{
  display: block;
  width: 100px;
  padding: 1px; 
  margin: 0px;
  text-decoration: none;
  text-align: center;
  color: ghostwhite;
}
a.top    {background-color: #DC1050;}
a.profile{background-color: #666699;}
a.school {background-color: #000080;}
a.order  {background-color: #663300;}
a.wedding{background-color: #006400;}
a.link   {background-color: #CC9900;}

li a:hover{
  text-decoration: none;
}

a.top:hover    {background-color: #FF0066;}
a.profile:hover{background-color: #6666CC;}
a.school:hover {background-color: #0000C0;}
a.order:hover  {background-color: #805020;}
a.wedding:hover{background-color: #008000;}
a.link:hover   {background-color: #DAA520;}

td.top    {background-color: #DC1050; height: 18px;}
td.profile{background-color: #666699; height: 18px;}
td.school {background-color: #000080; height: 18px;}
td.order  {background-color: #663300; height: 18px;}
td.wedding{background-color: #006400; height: 18px;}
td.link   {background-color: #CC9900; height: 18px;}


span{
  font-family: "Verdana",sans-serif;
  font-size: 10pt;
  font-weight: bold;
} 

/*** フォント設定 *******************************/

font{
  font : 10pt/130% "ＭＳ Ｐゴシック";
  color: dimgray;
} 

table{
  font : 10pt/130% "ＭＳ Ｐゴシック";
  color: dimgray;
} 

font.black{
  color: black;
} 

font.green{
  color: darkolivegreen;
} 

font.small{
  font : 9pt/130% "ＭＳ Ｐゴシック";
} 


/*** イメージ設定 *******************************/

img{border: 0px;} 

img.header{
  width : 800px;
  height: 64px;
}


/*** 画面単位 ***********************************/

/*** index ***/

div.information {
width: 380px;
height: 100px;
overflow: auto;
} 

td.i_date{
  width : 70px;
  text-align: left; 
  font : 9pt/130% "ＭＳ ゴシック";
} 

td.i_info{
  text-align: left; 
  font : 9pt/130% "ＭＳ Ｐゴシック";
} 


/*** profile ***/

td.p_photo{
  width : 240px;
  height: 380px;
  padding: 10px;
  text-align: left; 
} 

td.p_info{
  width : 320px;
  padding: 10px;
  text-align: left; 
} 

div.p_frame{
  padding:5px 6px 3px 6px;
  width : 180px;
  height: 240px;
  background-color:#ffffff;
  border-color:#dddddd #aaaaaa #aaaaaa #dddddd;
  border-width:1px;
  border-style:solid;
}


/*** school ***/

td.s_info{
  width : 300px;
  height: 400px;
  padding: 10px;
  text-align: left; 
} 

td.s_photo{
  width : 300px;
  padding: 10px;
  text-align: left; 
} 

img.s_subtitle{
  width : 300px;
  height: 15px;
}


/*** order ***/

td.o_intro{
  text-align  : left; 
  border-style: dotted;
  border-width: 0px 0px 2px 0px;
  border-color: darkkhaki; 
} 

td.o_submenu{
  text-align  : right; 
  border-style: dotted;
  border-width: 0px 2px 0px 0px;
  border-color: darkkhaki; 
} 

div.o_menu{
  text-align  : right; 
  border-style: dotted;
  border-width: 0px 0px 2px 0px;
  border-color: darkkhaki; 
  height: 46px;
} 

td.o_info{
  width  : 260px;
  padding: 10px 10px 10px 40px;
  text-align: left; 
} 

td.o_photo{
  width  : 160px;
  padding: 20px;
} 

div.o_frame{
  padding:4px 5px 2px 6px;
  width : 160px;
  height: 160px;
  background-color:#ffffff;
  border-color:#dddddd #aaaaaa #aaaaaa #dddddd;
  border-width:1px;
  border-style:solid;
}

img.o_subtitle{
  width : 132px;
  height: 15px;
}


/*** order form ***/

table.order_form{
  width  : 540px;
} 

td.of_name{
  width  : 240px;
  padding: 5px 5px 5px 40px;
  text-align: left;
  vertical-align: top;
} 

td.of_input{
  width  : 300px;
  padding: 5px;
  text-align: left;
  vertical-align: top;
} 

td.of_msg{
  width  : 600px;
  height : 50px;
  padding: 5px 5px 5px 20px;
  text-align: left;
  vertical-align: middle;
  color: black;
} 

td.of_submit{
  width  : 600px;
  height : 100px;
  padding: 5px;
  text-align: center;
  vertical-align: bottom;
  color: black;
}

td.of_back{
  padding: 5px 100px 5px 5px;
  text-align: right;
}


/*** How to order ***/

td.flow_base{
  padding: 1px 0px 1px 10px;
  text-align: left;
  vertical-align: middle;
  background-color: tan; 
  color: white;
  font: bold 10pt "ＭＳ Ｐゴシック";
}

td.flow_base_w{
  padding: 1px 0px 1px 10px;
  text-align: left;
  vertical-align: middle;
  background-color: darkkhaki; 
  color: white;
  font: bold 10pt "ＭＳ Ｐゴシック";
}

td.flow_arrow{
  width  : 80px;
  padding: 5px;
  text-align: center;
  vertical-align: middle;
  color: #996633;
} 

td.flow_arrow_w{
  width  : 80px;
  padding: 5px;
  text-align: center;
  vertical-align: middle;
  color: olive;
} 

td.flow_desc{
  width  : 500px;
  padding: 5px;
  text-align: left;
  vertical-align: top;
  color: black;
} 

td.flow_info{
  padding: 10px 0px 10px 20px;
  text-align: left;
  vertical-align: middle;
  color: black;
}


/*** wedding ***/

table.wedding{
  width : 800px;
  text-align: center;
}

div.w_info{
  width : 540px;
  height: 180px;
  text-align: left;
  vertical-align: middle;
}

img.w_submenu{
  width : 200px;
  height: 20px;
  margin: 0px;
  padding: 0px;
}

li a#wedding{
  display: block;
  width: 100px;
  padding: 0px; 
  margin: 0px;
  text-decoration: none;
  text-align: center;
}


/*** link ***/

div.l_info{
  width : 540px;
  height: 80px;
  text-align: left;
} 

table.link{
  width : 500px;
  margin: 0px;
  border-top  : 1px gray solid;
  border-right: 1px gray solid;
  border-left : 1px gray solid;
}

td.link_name{
  width  : 160px;
  margin: 0px;
  padding: 5px 5px 5px 20px;
  text-align: left;
  vertical-align: top;
  background-color: beige; 
  border-right : 1px gray solid;
  border-bottom: 1px gray solid;
}

td.link_info{
  width  : 300px;
  margin: 0px;
  padding: 5px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px gray solid;
}


/*** commercial_law ***/

table.commercial_law{
  width  : 500px;
  margin: 0px;
  border-top  : 1px gray solid;
  border-right: 1px gray solid;
  border-left : 1px gray solid;
}

td.law_name{
  width  : 160px;
  margin: 0px;
  padding: 5px 5px 5px 20px;
  text-align: left;
  vertical-align: top;
  background-color: aliceblue; 
  border-right : 1px gray solid;
  border-bottom: 1px gray solid;
}

td.law_info{
  width  : 300px;
  margin: 0px;
  padding: 5px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px gray solid;
}


/*** form ***/

div.form{
  width : 540px;
  height: 80px;
  text-align: left;
} 


// TABLE, TD, TH { border: 1px blue solid; } 


