@charset "UTF-8";
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #666666;
	margin: 0; /* 複数の異なるブラウザの初期設定値に対応するため、body エレメントのマージンと余白を 0 にすることをお勧めします */
	padding: 0;
	text-align: center; /* これにより、IE 5* ブラウザではコンテナが中央揃えになります。そして、テキストは、#container セレクタの初期設定である左揃えに設定されます */
	color: #000000;
}
.thrColLiqHdr #container { 
	width: 80%;  /* これにより、幅がブラウザの幅の 80% のコンテナが設定されます */
	background: #FFFFFF;
	margin: 0 auto; /* 自動マージン（幅と連動）により、ページが中央揃えになります */
	border: 1px solid #000000;
	text-align: left; /* この設定は body エレメントの text-align: center より優先されます。 */
} 
.thrColLiqHdr #header {
	padding: 0 10px;  /* この余白は、その下に表示される div のエレメントの左揃えと一致します。#header でテキストの代わりにイメージが使用される場合は、必要に応じて、余白を削除してください。 */
} 
.thrColLiqHdr #header h1 {
	margin: 0; /* #header div の最後のエレメントのマージンを 0 に設定することにより、マージンの相殺（div 間の原因不明のスペース）が回避されます。div の周囲に境界線が適用されている場合は、境界線によってマージンの相殺が回避されるため、この操作は不要です */
	padding: 10px 0; /* マージンの代わりに余白を使用して、エレメントを div の端に接触しない位置に維持することができます */
}
#header LI{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐ明朝";
  color : teal;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : teal;
  float : right;
  list-style-type : none;
}
.thrColLiqHdr #menu {
	padding: 0 10px;  /* この余白は、その下に表示される div のエレメントの左揃えと一致します。#header でテキストの代わりにイメージが使用される場合は、必要に応じて、余白を削除してください。 */
	background-color: teal;
} 
.thrColLiqHdr #menu h1 {
	margin: 0; /* #header div の最後のエレメントのマージンを 0 に設定することにより、マージンの相殺（div 間の原因不明のスペース）が回避されます。div の周囲に境界線が適用されている場合は、境界線によってマージンの相殺が回避されるため、この操作は不要です */
	padding: 10px 0; /* マージンの代わりに余白を使用して、エレメントを div の端に接触しない位置に維持することができます */
}
#menu LI{
  list-style-type : none;
  font-size : 1.2em;
  font-family : "ＭＳ Ｐ明朝";
  color : white;
  padding-top : 5px;
  padding-left : 10px;
  padding-right : 10px;
  padding-bottom : 5px;
  float : left;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : white;
  list-style-type : none;
}
#menulast{
  border-right-width : 250px;
  border-right-style : solid;
  border-right-color : teal;
}
/* #sidebar1 と #sidebar2 に関するヒント：
1. 単位はパーセントであるため、サイドバーの端に余白を適用することは回避してください。標準に準拠したブラウザでは、余白は幅に追加されるため、実際の幅が不特定の幅になります。 
2. 「.thrColLiqHdr #sidebar1 p」ルールで見られるように、div の端と div に含まれるエレメントの間のスペースは、エレメントに左マージンと右マージンを適用することによって設定できます。
3. 親エレメントが表示された後に Internet Explorer によって幅が計算されるため、単位がパーセントの列では原因不明のバグが発生することがあります。最終的な表示をより正確に予測する必要がある場合は、単位がピクセルの列に変更することができます。
*/
.thrColLiqHdr #sidebar1 {
	float: left; /* このエレメントは、ソースオーダー内で、その横に配置されるエレメントの前に配置される必要があります */
	width: 22%; /* このエレメントはフローティングエレメントであるため、幅が設定されている必要があります */
	/* background: #EBEBEB; 背景色は、列内のコンテンツの長さにわたって表示されます */
	padding: 15px 0; /* 上余白と下余白により、この div 内に視覚的なスペースが設定されます */
}
.thrColLiqHdr #sidebar2 {
	float: right; /* このエレメントは、ソースオーダー内で、その横に配置されるエレメントの前に配置される必要があります */
	width: 23%; /* このエレメントはフローティングエレメントであるため、幅が設定されている必要があります */
	/*background: #EBEBEB;  背景色は、列内のコンテンツの長さにわたって表示されます */
	padding: 15px 0; /* 上余白と下余白により、この div 内に視覚的なスペースが設定されます */
}
.thrColLiqHdr #sidebar1 p, .thrColLiqHdr #sidebar1 h3, .thrColLiqHdr #sidebar2 p, .thrColLiqHdr #sidebar2 h3 {
	margin-left: 10px; /* サイドバーに配置されるすべてのエレメントに左マージンと右マージンが設定されている必要があります */
	margin-right: 10px;
}

/* #mainContent に関するヒント：
1. #mainContent と #sidebar1 および #sidebar2 の間のスペースは、#mainContent div の左マージンと右マージンによって設定されます。
2. サポートされている最小解像度（800 x 600）でのフローティングエレメントの落下を回避するには、#mainContent div 内のエレメントを 300px 以下にする必要があります（イメージを含む）。
3. 下の Internet Explorer の条件分岐コメントでは、#mainContent に「hasLayout」を設定するのにズームプロパティが使用されます。これにより、いくつかの IE 固有のバグが回避されます。
*/
.thrColLiqHdr #mainContent { 
	margin: 0 24% 0 23.5%; /* この div エレメントの右マージンと左マージンにより、ページの両側に 2 つのサイドバーが設定されます。#sidebar1 div と #sidebar2 div に含まれるコンテンツの量に関係なく、列のスペースは維持されます。サイドバーのコンテンツが終了した後のスペースに #mainContent div のテキストを挿入するには、このマージンを削除します。 */
}

.thrColLiqHdr #footer { 
	padding: 0 10px; /* この余白は、その上に表示される div のエレメントの左揃えと一致します。
	background:#DDDDDD; */
} 
.thrColLiqHdr #footer p {
	margin: 0; /* フッターの最初のエレメントのマージンを 0 に設定することにより、マージンの相殺（div 間のスペース）が回避されます */
	padding: 10px 0; /* このエレメントの余白により、マージンの相殺を発生させることなく、マージンの効果とまったく同じように、スペースが設定されます */
}

/* 再使用できる各種クラス */
.fltrt { /* このクラスは、ページ上でフローティングエレメントを右側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスは、ページ上でフローティングエレメントを左側に配置するのに使用できます。フローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、div またはブレークエレメントに適用される必要があり、また、子フローティングエレメントが完全に含まれているコンテナの末尾の直前にある最後のエレメントである必要があります */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.part{
  position:relative;
  width : 120px;
  height:200px;
  float : left;  
}
.marginr20{
  margin-right : 20px;
  clear : right;
}
.marginr70{
  margin-right : 70px;
  clear : right;
}
.marginb60{
  margin-bottom : 60px;
}
.marginb90{
  margin-bottom : 90px;
}
.marginb130{
  margin-bottom : 130px;
}
.marginb150{
  margin-bottom : 150px;
}
.marginb200{
  margin-bottom : 200px;
}
.phbook{
  float : left;
  margin-right : 10px;
  margin-bottom : 10px;
  border-width : 0px 0px 0px 0px;
}
.photoleft{
  position : relative;
  border-width : 0px 0px 0px 0px;
  float : left;
  width : 200px;
  height : 260px;
}
.photo{
  position : relative;
  width : 200px;
  height : 300px;
  border-width : 0px 0px 0px 0px;
  margin-bottom : 10px; 
}
#logo{
  width : 780px;
  margin-bottom : 10px;
}
TABLE{
  padding-left : 5px;
  margin-bottom : 20px;
}
.banner{
  margin-left : 8px;
  border-width : 0px 0px 0px 0px;
}
#main H2{
  font-size : 1em;
  padding-top : 5px;
  padding-right : 5px;
  padding-bottom : 5px;
  letter-spacing : 1px;
  border-left-width : 12px;
  border-left-style : solid;
  border-left-color : olive;
  text-align : left;
  color : olive;
  font-family : "ＭＳ Ｐ明朝";
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : olive;
  padding-left : 5px;
}
#main li{
  list-style-type : none;
}
#container H2{
  font-size : 1em;
  padding-top : 5px;
  padding-right : 5px;
  padding-bottom : 5px;
  letter-spacing : 1px;
  border-left-width : 12px;
  border-left-style : solid;
  border-left-color : olive;
  text-align : left;
  color : olive;
  font-family : "ＭＳ Ｐ明朝";
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : olive;
  padding-left : 5px;
}
#container li{
	list-style-type : none;
	background-color: #FFFFFF;
}
.bold{
  font-weight : bold;
  margin-top : 10px;
  margin-bottom : 5px;
}
.book{
  font-size : 1.4em;
  font-family : "ＭＳ Ｐ明朝";
  color : navy;
  font-weight : bold;
}
.subtitle{
  font-family : "ＭＳ Ｐ明朝";
  color : navy;
  font-size : 0.8em;
}
.author{
  font-size : 1em;
  font-family : "ＭＳ Ｐ明朝";
  margin-bottom : 10px;
  margin-top : 10px;
  font-weight : bold;
  border-bottom-width : 1px;
  border-bottom-style : dotted;
  border-bottom-color : gray;
}
.intro{
  margin-bottom : 10px;
  line-height : 1.4em;
  font-family : "ＭＳ Ｐゴシック";
  font-size : 0.9em;
}
.saledate{
  margin-bottom : 5px;
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  color : navy;
}
.price{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  font-weight : bold;
  margin-bottom : 10px;
  
}
.order{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  font-weight : bold;
  color : white;
  background-color : olive;
  float : left;
  padding-top : 3px;
  padding-left : 3px;
  padding-right : 3px;
  padding-bottom : 3px;
  
}
.detail{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  font-weight : normal;
  color : olive;
  border-width : 1px 1px 1px 1px;
  border-style : solid solid solid solid;
  border-color : olive olive olive olive;
  padding-top : 3px;
  padding-left : 3px;
  padding-right : 3px;
  padding-bottom : 3px;
  float : left;
  
}
.contents{
  font-size : 1em;
  font-family : "ＭＳ Ｐ明朝";
  color : teal;
  margin-bottom : 5px;
  font-weight : bold;
  margin-top : 5px;
}
.spec{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  margin-bottom : 5px;
  line-height : 1.5em;
}
.theader{
  font-size : 0.9em;
  font-family : "ＭＳ Ｐゴシック";
  padding-top : 3px;
  text-align : center;
  font-weight : bold;
  text-decoration : underline;
  color : teal;
  border-left-width : 1px;
  border-left-style : solid;
  border-left-color : teal;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : teal;
  border-top-width : 10px;
  border-top-style : solid;
  border-top-color : teal;
}
.tmain{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  padding-bottom : 10px;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : teal;
  border-left-width : 1px;
  border-right-width : 1px;
  border-left-style : solid;
  border-right-style : solid;
  border-left-color : teal;
  border-right-color : teal;
}
.tdate{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  border-left-width : 1px;
  border-right-width : 1px;
  border-left-style : solid;
  border-right-style : solid;
  border-left-color : teal;
  border-right-color : teal;
  color : teal;
  font-weight : bold;
}
.tfooter{
  border-left-width : 1px;
  border-left-style : solid;
  border-left-color : teal;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : teal;
  font-size : 0.75em;
  font-family : "ＭＳ Ｐゴシック";
  text-align : right;
}
.rheader{
  font-size : 0.9em;
  font-family : "ＭＳ Ｐゴシック";
  padding-top : 3px;
  text-align : center;
  font-weight : bold;
  color : midnightblue;
  text-decoration : underline;
  border-left-width : 1px;
  border-left-style : solid;
  border-left-color : midnightblue;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : midnightblue;
  border-top-width : 10px;
  border-top-style : solid;
  border-top-color : midnightblue;
}
.rmain{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  padding-bottom : 10px;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : midnightblue;
  border-left-width : 1px;
  border-right-width : 1px;
  border-left-style : solid;
  border-right-style : solid;
  border-left-color : midnightblue;
  border-right-color : midnightblue;
}
.rdate{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  border-left-width : 1px;
  border-right-width : 1px;
  border-left-style : solid;
  border-right-style : solid;
  border-left-color : midnightblue;
  border-right-color : midnightblue;
  color : midnightblue;
  font-weight : bold;
}
.rfooter{
  border-left-width : 1px;
  border-left-style : solid;
  border-left-color : midnightblue;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : midnightblue;
  font-size : 0.75em;
  font-family : "ＭＳ Ｐゴシック";
  text-align : right;
}
.sheader{
  font-size : 0.9em;
  font-family : "ＭＳ Ｐゴシック";
  padding-top : 3px;
  padding-bottom : 10px;
  text-align : center;
  font-weight : bold;
  color : olive;
  text-decoration : underline;
  border-left-width : 1px;
  border-left-style : solid;
  border-left-color : olive;
  border-right-width : 1px;
  border-right-style : solid;
  border-right-color : olive;
  border-top-width : 10px;
  border-top-style : solid;
  border-top-color : olive;
}
.smain{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  padding-bottom : 5px;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : olive;
  border-left-width : 1px;
  border-right-width : 1px;
  border-left-style : solid;
  border-right-style : solid;
  border-left-color : olive;
  border-right-color : olive;
  padding-top : 10px;
  line-height : 15px;
}
.sdate{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  padding-top: 5px;
  border-left-width : 1px;
  border-right-width : 1px;
  border-left-style : solid;
  border-right-style : solid;
  border-left-color : olive;
  border-right-color : olive;
  color : olive;
  font-weight : bold;
}
.topixmain{
  font-family : "ＭＳ Ｐゴシック";
  padding-bottom : 5px;
  padding-top : 5px;
  vertical-align : top;
  padding-right : 5px;
  line-height : 1.5em;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : teal;
}
.topixdate{
  font-family : "ＭＳ Ｐゴシック";
  color : teal;
  vertical-align : top;
  padding-right : 5px;
  font-weight : bold;
  padding-top : 5px; 
}
.topixbook{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  color : teal;
  font-weight : bold;
  text-align : center;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : teal;
  margin-bottom: 10px;
  padding-bottom : 5px;
}
.reviewdate{
  font-family : "ＭＳ Ｐゴシック";
  color : navy;
  vertical-align : top;
  padding-right : 5px;
  font-weight : bold;
  padding-top : 5px; 
}
.reviewbook{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  color : navy;
  font-weight : bold;
  text-align : center;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : navy;
  padding-bottom : 5px;
}
.reviewtitle{
  font-family : "ＭＳ Ｐゴシック";
  padding-bottom : 5px;
  border-bottom-width : 1px;
  border-bottom-style : dotted;
  border-bottom-color : navy;
  padding-top : 5px;
  vertical-align : top;
  padding-right : 5px;
  line-height : 1.5em;
}
.reviewmain{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  vertical-align : top;
  padding-bottom : 5px;
  padding-top : 5px;
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : navy;
  line-height : 1.5em;
}
.searchdate{
  font-family : "ＭＳ Ｐゴシック";
  color : olive;
  vertical-align : top;
  padding-right : 5px;
  font-weight : bold;
  padding-top : 5px; 
}
.searchbook{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  color : olive;
  font-weight : bold;  
  border-bottom-width : 1px;
  border-bottom-style : solid;
  border-bottom-color : olive;
  padding-bottom : 5px;
  text-align : center;
}
.searchmain{
  font-size : 0.8em;
  font-family : "ＭＳ Ｐゴシック";
  vertical-align : top;
  padding-top : 5px;
  padding-left : 30px;
  padding-right : 5px;
  padding-bottom : 5px;
  line-height : 1.5em;
}
#header A:LINK{
  color : teal;
  text-decoration : none;
}
#header A:VISITED{
  color : teal;
  text-decoration : none;
}
#header A:HOVER{
  font-weight : bold;
  color : salmon;
  text-decoration : underline;
}
#menu A:LINK{
  color : white;
  text-decoration : none;
  background-color : teal;
}
#menu A:VISITED{
  color : white;
  text-decoration : none;
  background-color : teal;
}
#menu A:HOVER{
  font-weight : bold;
  color : salmon;
  text-decoration : underline;
  background-color : teal;
}
.book A:LINK{
  color : navy;
  text-decoration : none;
}
.book A:VISITED{
  color : navy;
  text-decoration : none;
}
.book A:HOVER{
  color : salmon;
  text-decoration : underline;
  font-weight : bold;
}

#sidebar_l A:LINK{
  color : darkslategray;
  text-decoration : none;
}
#sidebar_l A:VISITED{
  color : darkslategray;
  text-decoration : none;
}
#sidebar_l A:HOVER{
  font-weight : bold;
  color : salmon;
  text-decoration : underline;
}
#sidebar A:LINK{
  color : darkslategray;
  text-decoration : none;
}
#sidebar A:VISITED{
  color : darkslategray;
  text-decoration : none;
}
#sidebar A:HOVER{
  font-weight : bold;
  color : salmon;
  text-decoration : underline;
}
.copyng{
    position:relative;
    width:600px;
    height:244px;
}
.guard{
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    background-image:url(img/spacer.gif);
}
