@import "basic.css";



/* header style */
#header {
  position:relative;
  width:770px;
  height:85px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
  line-height:15px;
  color:#99a;
}
#header h1 {
  position:absolute;
  top:5px;
  left:205px;
  line-height:1.2em;
  font-size:1em;
}
#header h1 a {
  color:#99a;
}
#header h2 {
  position:absolute;
  top:25px;
  left:205px;
  line-height:1.15em;
  font-size:0.95em;
  font-weight:normal;
}
#header .trade {
  position:absolute;
  top:5px;
  left:0;
  width:180px;
  height:40px;
  margin-right:15px;
}

#header table {
  position:absolute;
  top:0;
  left:510px;
  width:140px;
  height:45px;
}
#header table td {
  font-size:12px;
  white-space:nowrap;
}
#header table .icon {
  width:75px;
  height:45px;
  text-align:left;
}
#header table .icon object,
#header table .icon embed {
  width:70px;
  height:43px;
  text-align:right;
}
#header table .sub {
  text-align:center;
  color:#08e;
  font-weight:bold;
  border-bottom:dashed 1px #08e;
}
#header table .list {
  text-align:center;
  border-bottom:dashed 1px #08e;
}
#header table .jump {
  text-align:center;
}

#header .reef-status {
  position:absolute;
  top:5px;
  right:0;
  width:100px;
  height:40px;
  opacity:0.8;
  -moz-opacity:0.8;
  filter:alpha(opacity=80);
}



/* main contents */
#contents {
  display:inline-block;
}
#contents {
  display:block;
  width:770px;
  margin-left:auto;
  margin-right:auto;
}
#contents:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body #contents {
  display:inline-block;
}



/* left Menu */
#left_column {
  display:inline-block;
}
#left_column {
  float:left;
  display:block;
  width:120px;
  padding-top:5px;
  text-align:left;
  vertical-align:top;
}
#left_column:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body #left_column {
  display:inline-block;
}
#left_column .sub {
  display:none;
}
#left_column .menu {
  margin-bottom:15px;
  list-style-type:none;
}
#left_column .menu li {
  position:relative;
  width:100%;
  margin-bottom:5px;
}
#left_column .menu li.sp {
  padding-top:10px;
}
#left_column .menu li ul {
  display:none;
}
#left_column .menu li em {
  position:absolute;
  left:-80px;
  width:80px;
  height:20px;
  padding-right:10px;
  text-align:center;
  line-height:20px;
  font-weight:normal;
  font-style:normal;
  color:#89a;
  background:url(../img/format/tip_left.gif) no-repeat left top;
}
html>body #left_column .menu li em {
  width:70px;
}
#left_column .menu li strong {
  display:block;
  height:20px;
  line-height:20px;
  font-weight:normal;
}
#left_column .menu li a img {
  margin:6px -10px 0 0;
}
#left_column .menu li strong a {
  position:relative;
  display:block;
  width:120px;
  height:20px;
  line-height:20px;
  text-align:center;
  white-space:nowrap;
}
#left_column .menu li strong a,
#left_column .menu li strong a:link,
#left_column .menu li strong a:visited,
#left_column .menu li strong a:active {
  background:url(../img/format/btn_left.gif) no-repeat left top;
}
#left_column .menu li strong a:hover {
  background:url(../img/format/btn_left.gif) no-repeat left bottom;
}
#left_column .menu li strong a.here {
  color:#9ab;
  background:url(../img/format/btn_left.gif) no-repeat left bottom;
}
#left_column .menu li strong a span {
  position:absolute;
  top:4px;
  left:6px;
  width:14px;
  height:14px;
  cursor:pointer;
}
#left_column .menu li strong a span,
#left_column .menu li strong a:link span,
#left_column .menu li strong a:visited span,
#left_column .menu li strong a:active span {
  display:none!important;
  background:transparent!important;
}
#left_column .menu li strong a:hover span {
  display:block!important;
  background:url(../img/format/icon_list.gif) no-repeat left top!important;
}
#left_column .menu li strong a.here span,
#left_column .menu li strong a.here:link span,
#left_column .menu li strong a.here:visited span,
#left_column .menu li strong a.here:active span {
  display:none!important;
  background:transparent!important;
}
#left_column .menu li strong a.here:hover span {
  display:block!important;
  background:url(../img/format/icon_list.gif) no-repeat left top!important;
}

#left_column .menu li ul {
  margin:5px 0 8px 0;
  padding:0;
  list-style-type:none;
}
#left_column .menu li ul li {
  margin:0;
  padding:1px 0;
  border-bottom:dashed 1px #203040;
}
html>body #left_column .menu li ul li {
  margin:0 0 1px 0;
}
#left_column .menu li ul li a {
  display:block;
  height:13px;
  min-height:13px;
  padding-left:15px;
  line-height:13px;
  font-size:12px;
}
html>body #left_column .menu li ul li a {
  height:auto;
}
#left_column .menu li ul li a,
#left_column .menu li ul li a:link,
#left_column .menu li ul li a:visited,
#left_column .menu li ul li a:active {
  background:url(../img/format/arrow_off.gif) no-repeat 5px 1px!important;
}
#left_column .menu li ul li a:hover {
  background:url(../img/format/arrow_on.gif) no-repeat 5px 1px!important;
}
#left_column .menu li ul li a.here,
#left_column .menu li ul li a.here:link,
#left_column .menu li ul li a.here:visited,
#left_column .menu li ul li a.here:active,
#left_column .menu li ul li a.here:hover {
  color:#9ab;
  background:url(../img/format/arrow_non.gif) no-repeat 5px 1px!important;
}
#left_column .menu li ul li a img {
  margin:2px -10px 0 0;
}

#left_column .QRcode {
  display:block;
  width:120px;
  height:120px;
  margin-bottom:15px;
  background:url(../img/format/QRcode.gif) no-repeat left top;
  cursor:pointer;
}

.book {
  width:120px;
  height:20px;
  margin-bottom:40px;
}

.book a {
  position:absolute;
  display:block;
  width:16px;
  height:16px;
  line-height:50px;
  background:url(../img/format/book_icons.gif) no-repeat 0 0;
  overflow:hidden;
}
.book a.yahoo {
  background-position:0 0;
}
.book a.google {
  margin-left:21px;
  background-position:-16px 0;
}
.book a.hatena {
  margin-left:42px;
  background-position:-32px 0;
}
.book a.delicious {
  margin-left:63px;
  background-position:-48px 0;
}
.book a.livedoor {
  margin-left:84px;
  background-position:-64px 0;
}
.book a.nifty {
  margin-left:104px;
  background-position:-80px 0;
}
.book a strong {
}
.book span {
  position:absolute;
  z-index:997;
  display:none;
  padding:1px 2px;
  line-height:14px;
  font-size:12px;
  color:#000;
  background:#ffffe0;
  border:solid 1px #000;
  white-space:nowrap;
}
.book span span {
  position:static;
  display:block;
  background:transparent;
  border:0;
}
.book span em {
  font-weight:normal;
  font-style:normal;
}
.book span strong {
}



#left_column .feed {
  position:relative;
  width:120px;
  margin-bottom:10px;
}
#left_column .feed a {
  display:block;
  margin-bottom:0;
}
#left_column a.bnr-feed {
  width:120px;
  height:22px;
  margin-bottom:5px;
  text-indent:-999em;
  background:url(/feed/bnr-feed.gif) no-repeat left center;
}
/*\*/
#left_column a.bnr-feed {
  overflow:hidden;
}
/**/

#left_column a.bnr-feed-blog {
  width:120px;
  height:22px;
  margin-bottom:5px;
  text-indent:-999em;
  background:url(/feed/bnr-feed-blog.gif) no-repeat left center;
}
/*\*/
#left_column a.bnr-feed-blog {
  overflow:hidden;
}
/**/



#left_column #eco-program {
  width:120px;
  text-align:center;
  list-style-type:none;
}
#left_column #eco-program li {
  margin-bottom:20px;
  color:#666;
}



#ssl-banner {
  position:relative;
  top:-10px;
  margin:0 0 10px 0;
}



/* right Menu field */
#right_column {
  display:inline-block;
}
#right_column {
  float:right;
  display:block;
  width:630px;
  padding:0 0 320px 0;
  text-align:left;
  vertical-align:top;
}
#right_column:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body #right_column {
  display:inline-block;
}


/* public style */
.title {
  width:630px;
  height:30px;
  margin-bottom:30px;
  text-indent:-999em;
  text-align:center;
  color:#324c67;
  background:url() no-repeat left top;
}
/*\*/
.title {
  overflow:hidden;
}
/**/
.title a {
  display:block;
  width:630px;
  height:30px;
  overflow:hidden;
}
.title span {
  display:none;
}

.heading {
  margin-bottom:15px;
  padding:0 0 0 5px;
  height:15px;
  line-height:15px;
  color:#ccc;
  font-size:15px;
  border-left:solid 15px #ccc;
}
.heading a,
.heading a:link,
.heading a:visited,
.heading a:active,
.heading a:hover {
  color:#ccc;
}
.heading .sub1 {
  float:left;
  margin:0 10px 0 0;
  padding:0;
  line-height:15px;
  font-size:15px;
}
.heading .sub2 {
  float:left;
  margin:2px 0 0 0;
  padding:0;
  font-size:12px;
  font-weight:normal;
  color:#999;
}
.heading .sub3 {
  float:right;
  margin:2px 0 0 0;
  font-size:12px;
  font-weight:normal;
  color:#999;
}

.heading#error {
  color:#fee;
  background-color:#e66;
  border:solid 1px #f99;
}

.para {
  display:inline-block;
}
.para {
  display:block;
  margin:0 0 0 30px;
  padding-bottom:30px;
}
.para:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body .para {
  display:inline-block;
}
.para#err_text {
  margin:50px 0;
  color:#e66;
  text-align:center;
}
.para p {
  margin-bottom:15px;
}
.para font {
  color:#c66;
}
.para blockquote {
  margin:0 0 15px 0;
  padding:5px 10px;
  border:dashed 1px #404040;
  color:#aaa;
  background:#202020;
}
.para blockquote .sub {
  margin-bottom:5px;
  font-size:1.1em;
}
.para blockquote ol,
.para blockquote ul {
  margin:0 0 0 25px;
  padding:0;
}
.para .left {
  float:left;
  margin:0 10px 10px 0;
}
.para .right {
  float:right;
  margin:0 0 10px 10px;
}
.para .sub_menu {
  line-height:1.6em;
}
.para .sub_menu dt {
  float:left;
  width:120px;
  height:1.6em;
}
.para .sub_menu dt a {
}
.para .sub_menu dd {
  float:left;
  width:480px;
  height:1.6em;
}
.para .sub_menu dd font {
  color:#e66;
}
ul.para,
ol.para {
  margin:0 0 30px 0;
  padding:0;
}
ul.para li,
ol.para li {
  margin:0 0 5px 40px;
  padding:0;
}
ul.para li ul,
ul.para li ol,
ol.para li ul,
ol.para li ol {
  margin:0;
  padding:5px 0 5px 25px;
}
ul.para li ul li,
ul.para li ol li,
ol.para li ul li,
ol.para li ol li {
  margin:0 0 5px 0;
  padding:0;
}

.caution {
  clear:both;
}
.caution p {
  margin:0;
  padding-left:15px;
  color:#c66;
  background:url(../img/format/icon_caution.gif) no-repeat 0 0.2em;
}
.caution font {
  color:#c66;
}

.embs_head {
  height:24px;
  margin:0 0 20px 0;
  padding:0 10px;
  line-height:24px;
  font-size:1.1em;
  color:#ccc;
  background:#203343;
  border:solid 1px #304050;
}
.embs_head a {
  color:#ccc;
}
.embs_head .sub1 {
  float:left;
  display:block;
  margin-right:10px;
  line-height:24px;
  font-size:1em;
}
.embs_head .sub2 {
  float:left;
  display:block;
  line-height:24px;
  font-size:0.9em;
  font-weight:normal;
}
.embs_head .sub3 {
  float:right;
  display:block;
  line-height:24px;
  font-size:0.9em;
  color:#999;
}

.embs_box {
  margin:0 0 30px 0;
  padding:1px 0;
  background:#304050;
}
.embs_box .embs_sub {
  height:24px;
  margin:0 1px 1px 1px;
  padding:0 10px;
  line-height:24px;
  font-size:1.1em;
  color:#ccc;
  background:#203343;
}
.embs_box .embs_sub .sub1 {
  float:left;
  display:block;
  margin-right:10px;
  line-height:24px;
  font-size:1em;
}
.embs_box .embs_sub .sub2 {
  float:left;
  display:block;
  line-height:24px;
  font-size:0.9em;
  font-weight:normal;
}
.embs_box .embs_sub .sub3 {
  float:right;
  display:block;
  line-height:24px;
  font-size:0.9em;
  color:#999;
}
.embs_box .embs_body {
  margin:0 1px;
  padding:5px 10px;
  line-height:18px;
  border:solid 1px #203343;
}

.menu_top {
  position:relative;
  margin:-30px 0 20px 0;
  padding:0;
  list-style-type:none;
  text-align:right;
}
.menu_top li {
  display:inline;
  margin-left:20px;
}



/* footer field */
#footer {
  clear:both;
  width:770px;
  margin-left:auto;
  margin-right:auto;
  padding:5px 0 20px 0;
  text-align:center;
  font-family:Times;
  color:#456;
  border-top:solid 1px #123;
}
#footer .menu {
}
#footer .copyright {
}
#footer em {
  font-style:normal;
}



/* login page */
body.login {
  padding:20px;
  text-align:center;
  background:#000 url();
}
body.login .login_body {
  width:630px;
  margin-left:auto;
  margin-right:auto;
  text-align:left;
}
body.login .login_body .para img {
  margin:0 2px;
  vertical-align:middle;
}
body.login .login_body .close {
  margin-top:20px;
  padding:20px 0;
  text-align:center;
  border-top:dashed 1px #456;
}
body.login .login_body .close input {
  width:80px;
  height:30px;
}



/* clearfix */
.fix {
  display:inline-block;
}
.fix {
  display:block;
}
.fix:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body .fix {
  display:inline-block;
}



/* for imgView() */
a.imgView {
  float:left;
  display:block;
  margin-right:10px;
  cursor:pointer;
}
a.imgView,
a.imgView:link,
a.imgView:visited,
a.imgView:active {
  border:solid 1px #08e;
}
a.imgView:hover {
  border:solid 1px #4ff;
}
a.imgView span {
  display:none;
}
#imgView {
  display:none;
  position:absolute;
  padding:1px;
  text-align:left;
  background:#000 url(/img/format/load.gif) no-repeat center center;
  border:solid 1px #999;
  cursor:pointer;
  z-index:999;
}
#imgView span {
  display:block;
  background:url(/img/format/btn_delete.gif) no-repeat right top;
  cursor:pointer;
}



/* alpha background */
#alphaBackground {
  display:none;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:#000 url(/img/format/alpha.png);
  z-index:998;
}
#alphaBackground img {
  position:absolute;
  bottom:0;
  left:0;
}



/* adsense */
.ads_left {
  margin-bottom:15px;
}
.ads_firefox {
  padding-top:20px;
}
.ads_right {
  position:absolute;
  top:110px;
  right:-135px;
  width:120px;
  height:600px;
}
.ads_bottom {
  clear:both;
  width:770px;
  margin:0 auto;
  padding:20px 0 20px 20px;
}
html>body .ads_bottom {
  width:750px;
}
.ads_mv_bottom {
  clear:both;
  width:730px;
  margin:0 auto;
  padding:0 0 20px 20px;
}
.ads_mv_right {
  clear:both;
  margin:0 0 30px 0;
  text-align:center;
}
.ads_mv_right div {
  width:500px;
  margin:0 auto;
}
.ads_top {
  position:absolute;
  left:30px;
  bottom:12px;
  width:730px;
}
.ads_middle {
  width:468px;
  height:15px;
  margin:0 0 20px 81px;
}
.ads_box {
  display:inline-block;
}
.ads_box {
  display:block;
  width:630px;
  margin:0 0 30px 0;
}
.ads_box:after {
  content:'.';
  clear:both;
  visibility:hidden;
  display:block;
  width:100%;
  height:0;
}
* html>body .ads_box {
  display:inline-block;
}
.ads_box div.left {
  float:left;
  width:300px;
  height:250px;
  margin:0;
}
.ads_box div.left a {
  float:left;
  width:300px;
  height:120px;
  margin:0 0 10px 0;
}
.ads_box div.left a img {
  width:300px;
  height:120px;
}
.ads_box div.right {
  float:right;
  margin:0;
}
.ads_box_bottom {
  position:relative;
  top:-300px;
  clear:both;
  width:770px;
  margin:0 auto -280px auto;
  padding:0 0 0 160px;
  text-align:left;
}
html>body .ads_box_bottom {
  width:610px;
}
.ads_box_blog {
  margin:30px 0 0 10px;
}
.ads_box_bbs {
  margin:10px 0;
}



/* contents top arrow menu */
dl.contents_menu {
  display:inline-block;
}
dl.contents_menu {
  display:block;
  margin:0 0 0 30px;
  padding-bottom:40px;
  width:600px;
}
dl.contents_menu:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body dl.contents_menu {
  display:inline-block;
}
dl.contents_menu dt {
  display:inline-block;
}
dl.contents_menu dt {
  position:relative;
  float:left;
  display:block;
  width:120px;
  height:1.6em;
  white-space:nowrap;
}
dl.contents_menu dt:after {
  content:'.';
  clear:both;
  display:block;
  visibility:hidden;
  width:100%;
  height:0;
}
* html>body dl.contents_menu dt {
  display:inline-block;
}
dl.contents_menu dt a {
  float:left;
  display:block;
  margin-top:0.4em;
  padding-left:10px;
  line-height:1.2em;
  white-space:nowrap;
  vertical-align:middle;
}
dl.contents_menu dt a,
dl.contents_menu dt a:link,
dl.contents_menu dt a:visited,
dl.contents_menu dt a:active {
  background:url(../img/format/arrow_off.gif) no-repeat left center;
}
dl.contents_menu dt a:hover {
  background:url(../img/format/arrow_on.gif) no-repeat left center;
}
dl.contents_menu dt span {
  vertical-align:middle;
}
dl.contents_menu dt span {
  float:left;
  display:block;
  padding-left:10px;
  background:url(../img/format/arrow_non.gif) no-repeat left center;
  vertical-align:middle;
}
dl.contents_menu dd {
  float:left;
  width:480px;
  padding-top:0.4em;
  padding-bottom:2px;
  line-height:1.2em;
}
dl.contents_menu dd.caution {
  float:left;
  width:600px;
  margin-top:10px;
}



/* AdReef */
#AdReef {
  width:630px;
  height:65px;
  margin:5px auto 20px auto;
}



/* RSS icon */
a.rss {
  display:block;
  padding-left:20px;
  line-height:16px;
  background:url(/img/format/icon_rss.gif) no-repeat left center;
}



/* view list */
#ViewList {
  position:absolute;
  z-index:1000;
  right:-300px;
  top:10px;
  width:300px;
  padding:45px 0 5px 0;
  line-height:15px;
  text-align:left;
  color:#393;
  background:#efe;
  -moz-border-radius:0 0 0 5px;
  -webkit-border-radius:0 0 0 5px;
  -khtml-border-radius:0 0 0 5px;
  border-radius:0 0 0 5px;
  -moz-border-bottom-left-radius:5px;
  -webkit-border-bottom-left-radius:5px;
  -khtml-border-bottom-left-radius:5px;
  border-bottom-left-radius:5px;
  -moz-box-shadow:-2px 2px 2px #012;
  -webkit-box-shadow:-2px 2px 2px #012;
  -khtml-box-shadow:-2px 2px 2px #012;
  -opera-box-shadow:-2px 2px 2px #012;
  box-shadow:-2px 2px 2px #012;
  opacity:0.5;
  -moz-opacity:0.5;
}
html>body #ViewList {
  position:fixed;
}
#ViewList h3 {
  position:absolute;
  z-index:1;
  width:20px;
  height:53px;
  left:-20px;
  top:0;
  margin:0;
  padding:22px 0 0 0;
  text-align:center;
  line-height:13px;
  text-indent:0;
  font-family:monospace;
  font-size:13px;
  color:#393;
  background:#efe url(/img/format/icon-tag.gif) no-repeat 2px 4px;
  border-right:solid 3px #efe;
  -moz-border-radius:5px 0 0 5px;
  -webkit-border-radius:5px 0 0 5px;
  -khtml-border-radius:5px 0 0 5px;
  border-radius:5px 0 0 5px;
  -moz-border-top-left-radius:5px;
  -webkit-border-top-left-radius:5px;
  -khtml-border-top-left-radius:5px;
  border-top-left-radius:5px;
  -moz-border-bottom-left-radius:5px;
  -webkit-border-bottom-left-radius:5px;
  -khtml-border-bottom-left-radius:5px;
  border-bottom-left-radius:5px;
  -moz-box-shadow:-2px 2px 2px #012;
  -webkit-box-shadow:-2px 2px 2px #012;
  -khtml-box-shadow:-2px 2px 2px #012;
  -opera-box-shadow:-2px 2px 2px #012;
  box-shadow:-2px 2px 2px #012;
}
html>body #ViewList h3 {
  height:31px;
}
#ViewList h4 {
  position:absolute;
  left:5px;
  top:0;
  padding:5px 0 5px 5px;
  font-size:13px;
  font-weight:bold;
  color:#060;
}
#ViewList h4 span {
  font-weight:normal;
}
#ViewList em {
  position:absolute;
  left:5px;
  top:21px;
  padding:5px 15px 5px 5px;
  font-style:normal;
  font-weight:normal!important;
  color:#393!important;
  background:url(/img/format/icon-push.gif) no-repeat right center;
  cursor:pointer;
}
#ViewList em:hover {
  letter-spacing:-1px;
  font-weight:bold!important;
}
#ViewList font {
  display:none;
  position:absolute;
  left:5px;
  top:21px;
  padding:5px;
  font-style:normal;
  font-weight:normal!important;
  color:#e66!important;
}
#ViewList strong {
  position:absolute;
  right:10px;
  top:23px;
  padding:5px 14px 5px 5px;
  font-weight:normal;
  color:#d33;
  background:url(/img/format/close.gif) no-repeat right center;
  cursor:pointer;
}
#ViewList strong:hover {
  letter-spacing:-1px;
  font-weight:bold!important;
}
#ViewList ol {
  position:relative;
  z-index:2;
  height:3px;
  padding:0 10px 0 30px;
  line-height:13px;
  list-style-type:decimal;
  background:#efe;
}
html>body #ViewList ol {
  height:auto;
  min-height:3px;
}
#ViewList ol li {
  position:relative;
  padding:3px 15px 3px 0;
  border-top:dashed 1px #9c9;
}
html>body #ViewList ol li {
  height:auto;
}
#ViewList ol li a {
  position:relative;
  z-index:1;
  font-size:12px;
}
#ViewList ol li a:hover {
  color:#d33;
}
a#ViewListFocus {
  font-weight:bold;
}
#ViewList ol li span {
  position:absolute;
  z-index:2;
  right:10px;
  top:6px;
  width:11px;
  height:11px;
  background:url(/img/format/close.gif) no-repeat left top;
  cursor:pointer;
}
html>body #ViewList ol li span {
  right:0;
  top:4px;
}
