/* -------------------------- z-index collection --------------------------  */

/* frame */
#main_content          { z-index: 0; }
#left_sidebar          { z-index: 4; }
#center_box            { z-index: 1; }
#sideslidedoor         { z-index: 3; }
#mainpannel            { z-index: 5; }
/* contents */
.room, #westfloor .room, #westfloor .widget
                       { z-index: 3; }
.pagecore              { z-index: 1; }

/* -------------------------- size collection --------------------------  */

#wrapper                { width:  95%; min-width: 1000px; max-width: 1380px; }
#main_content           { width:  99%; min-width:  990px; max-width: 1240px; }
#sideslidedoor          { width:  60%; min-width:  680px; }
#left_sidebar           { width: 250px; }
.sideroom               { width: 286px; }
#slideopen              { width: 250px; }
/* --------------  --------------- */
.pagecore               { width: 620px; }
/* --------------  --------------- */
.infoOn                 { width: 240px; }
/* --------------  --------------- */
#commentbody            { width: 100%; }
.commenttop             { width: 240px; }
.cc                     { width: 240px;}
/* --------------  --------------- */

/* ------------------ HTML tags ------------------ */
body {
  font-family: Verdana, Tahoma, Arial, Sans-serif;
  margin: 0; padding: 0;
  font-size: 9pt;
  color: #666;
  line-height: 1.4em;
  background-image: url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/greendot.png);
  text-align:center;
}

div, ul, ol {
  border-style: none;
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}
h1, h2, h3, h4, h5, h6 {
  font-family: Times, Verdana, Tahoma, Arial, Sans-serif;
  font-weight: 500;
  padding: 0 2px; margin: 0;
  line-height: 1.4em;
}

h1 { font-size: 20pt; }
h2 { font-size: 13pt; }
h3 { font-size: 10pt;
  background:url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/h3background.png) no-repeat top left;
  padding: 0 6px;
  margin: 4px 0;
}
h4 { font-size: 9pt; 
  background:url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/h4background.png) no-repeat top left;
  padding: 0 6px;
  margin: 0;
}
blockquote {
  margin: 15px 30px 10px 30px;
  padding: 0 20px 10px 20px;
  border-left: 2px solid #574f4b;
  border-right: 2px solid #574f4b;
}
/* ------------------ Utility class ------------------ */

.clear{
  clear: both;
}
.roundBorder{
  border-radius: 8px; 
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
}
.shadowEdge{
/* box-shadow がやや重いので代用 */
  border-style: solid;
  border-width: 1px 2px 2px 1px;
  border-color: #bbb;
/*  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.4); */
}
.even-row{  background-color: #fff;}
.odd-row {  background-color: #eee;}
div.p_left {   float: left; }
div.p_right {  float: right; }
div.p_left a img { border-style: none; }
div.p_right a img { border-style: none; }

.morebuttn{
  cursor: pointer;
  text-align: right;
}
.align-right {
  text-align: right; }
.align-left {
  text-align: left; }
.align-center {
  display: block; margin-left: auto; margin-right: auto; text-align: center;}

/* ------------------ functions  ------------------ */

.arrowleft{
  background:url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/cs-portfolio.png) no-repeat 0 0; 
}
.arrowright{
  background:url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/cs-portfolio.png) no-repeat -25px 0; 
}
#slideopenbutton{
  position: absolute;
  cursor: pointer;
  width: 25px;
  height: 28px;
  left: 660px;
  margin: 2px;
  top: 0px;
  display: none;
}

/* ----------- コメントのトップパネル ---------- */
#slideopen{
  margin: 2px 12px;
}
/* -------------------------- link -------------------------- */

a, a:link, a:visited { text-decoration: none;      color: teal; }
a:hover              { text-decoration: underline; color: cadetblue; }
#menu a, #menu a:link, #menu a:visited,
#footer a, #footer a:link, #footer a:visited 
                     { text-decoration: none;      color: #888; }
#footer a:hover      { text-decoration: underline; color: #777; }

/* -------------------------- HEADER -------------------------- */
#header {
  position: relative;
  background-color: #fff;
  text-align: center;
  color: #464;
  font-family: Georgia, Sans-serif; 
  text-shadow: 0 0 4px #66ff66, 0 0 2px #66ff66;
  border-bottom: dotted 2px green;
  height: 180px;
  border-radius: 30px 30px 0 0; 
  -webkit-border-radius: 30px 30px 0 0;
  -moz-border-radius: 30px 30px 0 0;
}
#header-back{
  width: 96%;
  margin: 0 auto;
  height: 160px;
  background: url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/topbottom.png) center bottom;
  background-repeat: repeat-x;
}
.leftimage{
  position: absolute;
  float: left;
  bottom: 0px;
  left: 10px;
}
.rightimage{
  position: absolute;
  float: right;
  bottom: 0px;
  right: 10px;
}

#header h1 {
  position: relative;
  width: 100%;
  text-align: center;
  margin: 0;
  padding: 40px 0 20px 0;
}
#header h1 a {
  color: #464;
}
#header h1 a:hover {
  text-decoration: none;
  color: #464;
}
#header .description {
  padding: 10px;
  font-style: italic;
}

/* -------------------------- FRAMES -------------------------- 
 *
 *  レイアウト用の place holder
 *
 */
/* 
  +--- wrapper ----------------------------------------------------+
  | +--- header -------------------------------------------------+ |
  | |                                                            | |
  | |                                                            | |
  | +--- jqueryslidemenu ----------------------------------------+ |
  | +--- main_content -------------------------------------------+ |
  | | + left_sidebar + +- center_box --------------------------+ | | main_content と center_box は々サイズで重なってる
  | | |              | | +- centerfloor -------+ +- sideroom + | | |
  | | |              | | | +- sideslidedoor -+ | |           | | | |
  | | |              | | | |                 | | |           | | | | centerfloor と sideslidedoor もぴったりかさなってる。
  | | |              | | | |                 | | |           | | | | しかも、centerfloor 何やっても見えない。謎。
  | | |              | | | |                 | | |           | | | |
  | | |              | | | |                 | | |           | | | |
  | | |              | | | |                 | | |           | | | |
  | | |              | | | |                 | | |           | | | |
  | | |              | | | +-----------------+ | |           | | | |
  | | |              | | +---------------------+ +-----------+ | | |
  | | +--------------+ +---------------------------------------+ | |
  | +------------------------------------------------------------+ |
  | +--- footer -------------------------------------------------+ |
  | |                                                            | |
  | +------------------------------------------------------------+ |
  +----------------------------------------------------------------+
 */
#wrapper {
  margin: 8px auto;
  text-align: left;
  background-color: #efe;
  border: solid 6px #8c8;

  border-radius: 30px 30px 0 0; 
  -webkit-border-radius: 30px 30px 0 0;
  -moz-border-radius: 30px 30px 0 0;
/* 重いのでコメントアウト  box-shadow: 4px 4px 4px 0 rgba(120,200,120,0.4); */

}
#main_content{
  margin: 8px auto;
  text-align: right;
}
#left_sidebar  {
  float: left;
}
#center_box{
  margin:2px auto;
}

#centerfloor {
  float: left;
  position: relative;
}
#sideslidedoor{
  position: absolute;
  text-align: left;
}
.sideroom{
  float: right;
  position: relative;
  background-color:"";
  right: 0px;
}

/* -------------------------- Column -------------------------- 
 *
 *  各カラム用
 *
 */

.floor {
  line-height: 1.4em;
  padding: 0;
  margin: 0;
}
.floortitle{
  padding: 2px 4px;
  margin: 2px 2px 10px 2px;
  font-size: 120%;
  background-color: #eee;
  border: dotted 1px #bbb;
}
.room, 
#westfloor .room, #westfloor .widget{
  list-style-type: none;
  background-color: white;
  padding: 7px;
  margin: 3px;
  border-style: solid;
  border-width: 1px 2px 2px 1px;
  border-color: #bbb;
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2);
}
.commentbox {
  background-image: url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/lightgreendot.png);
  border-style: none;
}
.pagecore{
  margin: 4px;
  padding: 10px 20px;
  line-height: 1.5em;
}
.entry_more{
  display: block;
}
.entry_more_off{
  display: none;
}
.widgettitle, #respond{
  padding: 0 0 0 0;
  margin: 0 0 4px 0;
  font-size: 140%;
  border-bottom: solid 1px red;
  cursor: pointer;
}
#respond{
  border-bottom: none 1px red;
}
.room ul, .widget ul{
  padding: 4px;
}
.room ul li, .widget ul li{
  padding: 4px;
}
.roomfooter{
  border-top:dotted 1px gray;
  text-align:right;
  font-size:90%;
}

/*
 * onMouseoverで表示するウインドウ (未使用)
 */
.infoOn{
  border-style: solid;
  border-width: 1px 2px 2px 1px;
  border-color: #bbb;
  padding: 8px;
  background-color: snow;
  position: absolute;
  display: none;
  width: 240px;
/*  box-shadow: 4px 4px 2px 0 rgba(0,0,0,0.4); */
}

/* -------------------------- POST -------------------------- */
.postmeta{
  text-align: right;
  padding: 4px;
}
.entry{
  padding:12px;
}
.entry_body{
  padding:12px;
}
.postmetadata, .entry_state {
  padding: 20px 0 0 0;
  margin: 0;
  text-align: right;
  font-size: 90%;
  border-bottom:solid 1px #fcc;
  clear: both;
}
.entry_date {
  margin: 0;
  text-align: right;
  font-size: 90%;
}
/* -------------------------- IMAGES -------------------------- */
p img, li img {
  padding: 0; max-width: 100%;  height: auto !important;}
a img {
  border: #d4be87 1px solid; padding: 3px; background: none; }
img.centered {
  display: block; margin-left: auto; margin-right: auto; }
img.alignright {
  padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.alignleft {
  padding: 4px; margin: 0 7px 2px 0; display: inline; }

/* -------------------------- COMMENTS -------------------------- */

.inputs {
  text-align: right;
  font-size: 80%;
}

.comment-body {
  margin: 0;
  padding: 8px 4px 8px 85px;
}
.kaerubutton{
  width: 40px;
  height: 40px;
  margin: 6px;
  border-radius: 8px; 
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border: solid 1px #cec;
  font-size: 0px;
  line-height: 100px;
  overflow: hidden;
  box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.4); 
}
.kaeruname{
  color: white;
}
.commentlist {
  position: relative;
  margin: 4px 0;
  padding: 8px 0;
}
.commenttop {
  background-color: red;
  padding: 4px;
  text-align: left;
  margin: 4px 4px 4px 12px;
  background-color: white;
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2);
  border-style: solid;
  border-width: 1px;
  border-color: #bbb;
}
.comment-meta {
  text-align: right;
  margin: 10px 0;
  font-size: 70%;
  color: silver;
}
.cc {
  position: relative;
  padding: 7px;
  margin: 3px;
  line-height: 1.4em;
  text-align: left;
  background-color: white;
  border-style: solid;
  border-width: 1px;
  border-color: #bbb;
  background-image:url(http://blog-imgs-52.fc2.com/o/o/t/ootataneko/kaeru11.png);
  box-shadow: 2px 2px 4px 0 rgba(0,0,0,0.4);
}

/* -------------------------- TRACKBACK -------------------------- */
.tbunit{
  border-bottom: dotted 2px green;
  padding: 4px;
}
.tb-body{
  padding: 4px;
}

/* -------------------------- FOOTER -------------------------- */
#footer {
  clear: both;
  padding: 25px 0 5px 0;
  margin-top: 20px;
  background-color: #fff;
  color: #464;
  border-top: dotted 2px green;
}
#footer p {
  font-size: 90%;
  line-height: 1.4em;
  padding: 0 10px;
  text-align: center;
}
#footer a { color: white; }

/* -------------------------- ------ -------------------------- */