﻿@charset "UTF-8";

/* -------------------------------------------------------------

[1] レイアウトに関する指定
[2] ヘッダーブロック内に関する指定
[3] コンテンツブロック内に関する指定
[4] サイドバーブロック内に関する指定
[5] フッターブロック内に関する指定
[6] CSSデザインサンプルリンク指定

----------------------------------------------------------------
CSSデザインサンプ [ URL ] http://www.css-designsample.com
------------------------------------------------------------- */


/* 一括で全ての要素の余白をゼロに指定 */
* {
  margin: 0;
  padding: 0;
}

img {
  border: none;
}

/* 全体的なリンク */

a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none;
  color: #666;
}


/* -------------------------------------------------------------
   [1] レイアウトに関する指定 */

body {
  font-size: 80%;
  text-align: center;
  font-family: "メイリオ", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Osaka", "Arial", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  padding:0;
  margin: 0;
  /* background: url(img/bg-body.gif) repeat-x 0 40px; */
  background-color: #FFF;
  color: #666
}

/*-- 全体を囲んでいます --*/
#wrapper {
  text-align: left;
  margin: 0 auto 0;
  padding: 0 10px 0;
  width: 950px;
  
  /*
  background-color: #FFF;
  border-left: 1px solid #c9c9c9;
  border-right: 1px solid #c9c9c9;
  */
}

#header {
  height: 40px;
  padding: 10px 10px 10px;
  background: #fff url(img/oblong119fl.jpg) no-repeat 50% 100%;
  /* border: 1px solid #c9c9c9; */
  border-top: 1px solid #CCC;
  border-left: 1px solid #CCC;
  border-right: 1px solid #CCC;
  border-bottom: 2px solid #009BAA;
}

#container {
  width: 100%;
  /* padding-top: 4em; */
  padding-top: 0px;
  position: relative;
}

#globalnavi {
  text-align: center;
  width: 950px;
  height: 45px;
  
  position: relative;
  
  z-index: 30; /* stick.js */
  
  padding-bottom: 5px;
}

#globalnavi-shadow {
  
  height: 3px;
  background-color: #333333;
  
  filter: alpha(opacity=25);
  -moz-opacity:0.25;
  opacity:0.25;
}

/* TOPページ */
#main-image {
  width: 700px;
  height: 280px;
  margin-top: 0px;		/* member-login-container と連動 */
  background-color:#CCC;
  
  float:left;
  
  position: relative;
  overflow: hidden;
}

/* サブページ */
#main-large-image {
  width: 950px;
  /* height: 300px; */
  background-color: #FFF;
}

#member-login {
  /* width: 186px; */
  width: 236px;
  height: 146px;
  margin-top: 0px;		/* main-image と連動 */
  background-color:#FFFFFF;

  background-image: url("./images/member.jpg");

  padding: 0;
  float: right;
  
  font-size: 100%;
  text-align: center;
}

#contact-us {
  width: 236px;
  height: 134px;
  background-color: #FFF;
  
  padding: 0;
  float: right;
  
  color: #6633CC;
  line-height: 1.4em;
  font-size: 90%;
}

#contents {
  width: 680px;
  float: right;
  
  margin-bottom: 20px;
}

#sidebar {
  width: 234px;
  float: left;
  
  margin-bottom: 20px;
}

#footer-menu {
  height: 1em;
  background-color: #666;
  color: #FFF;
  padding: 1em 3em;
  font-size: 90%;
}

#footer {
  clear: both;
  
  width: 950px;
  /* padding: 1em 0 2.5em; */
  background-color: #333;
  border-top: 3px solid #009baa;
  
  /* background-image: url("./images/footer_bg.jpg"); */
  height: 160px;
}

.left {
  float: left;
}

.right {
  float: right;
}

.clear {
  clear: both;
}

img.left {
  margin-right: 1em;
}

img.right {
  margin-left: 1em;
} 

/* -------------------------------------------------------------
   [2] ヘッダーブロック内に関する指定 */

/* 見出し */
h1 {
  font-size: 85%;
  font-weight: normal;
  text-align: right;
}

#header img {
  margin-right: 5px;
  float: left;
}


#header .nameInHeader {
  font-size: 85%;
  font-weight: normal;
  line-height: 1.2em;
  float: left;
}

#header p {
  margin-bottom: 0.5em;
  line-height: 1.2em;
}

#naviInHeader {
  float: right;
}

#naviInHeader a {
  display: block;
  width: auto;
  font-size: 85%;
  margin: 1em 30px 0 0;
  padding-left: 15px;
  background: url("images/icon_1.jpg") no-repeat 0 50%;
  float: left;
}

#globalnavi ul {
  list-style-type: none;
  width: 100%;
  margin: 0;
  padding: 0;
}

#globalnavi li {
  width: 165px;
  height: 45px;
  float: left;
  /* border-bottom: 1px solid #ccc; */
  margin: 0;
  padding: 0;
}

#globalnavi li.home {
  width: 125px;
}

#globalnavi li a span {
  display: none;
}

#globalnavi li a {
  text-decoration: none;
  text-align: center;
  padding: 0em 0;
  width: 100%;
  height: 100%;
  display: block;
  background: url(img/bg-globalnavi.jpg) no-repeat 0 50%;
  color: #000;
 
}

#globalnavi li a:hover {
  text-decoration: none;
  color: #f00;
  background: url(img/bg-globalnavi.jpg) no-repeat -140px 50%;
}

#globalnavi li.home a {
  background: url("./images/headmenu_home.jpg") no-repeat 0 50%; 
}

#globalnavi li.homepage a {
  background: url("./images/headmenu_homepage.jpg") no-repeat 0 50%; 
}

#globalnavi li.rentalserver a {
  background: url("./images/headmenu_rs.jpg") no-repeat 0 50%; 
}

#globalnavi li.network a {
  background: url("./images/headmenu_network.jpg") no-repeat 0 50%; 
}

#globalnavi li.system a {
  background: url("./images/headmenu_system.jpg") no-repeat 0 50%; 
}

#globalnavi li.rescue a {
  background: url("./images/headmenu_rescue.jpg") no-repeat 0 50%; 
}

#globalnavi li.home a:hover {
  background: url("./images/headmenu_home2.jpg") no-repeat 0 50%; 
}

#globalnavi li.homepage a:hover {
  background: url("./images/headmenu_homepage2.jpg") no-repeat 0 50%; 
}

#globalnavi li.rentalserver a:hover {
  background: url("./images/headmenu_rs2.jpg") no-repeat 0 50%; 
}

#globalnavi li.network a:hover {
  background: url("./images/headmenu_network2.jpg") no-repeat 0 50%; 
}

#globalnavi li.system a:hover {
  background: url("./images/headmenu_system2.jpg") no-repeat 0 50%; 
}

#globalnavi li.rescue a:hover {
  background: url("./images/headmenu_rescue2.jpg") no-repeat 0 50%; 
}

/* -------------------------------------------------------------
   [3] トップコンテンツブロック内に関する指定 */
   

#contents-top {
  padding-top: 5px;	/* main-image と連動 */
  padding-bottom: 25px;
  overflow: hidden;

  clear: both;  
}

.contents-top-left,
.contents-top-center,
.contents-top-right {
  width: 310px;
  height: 200px;
  float: left;
}


.contents-top-left,
.contents-top-center {
  margin-right: 10px;
}


.contents-bottom-left,
.contents-bottom-center,
.contents-bottom-right {
  width: 310px;
  height: 200px;
  float: left;
  
  margin-top: 10px;
}

.contents-bottom-left,
.contents-bottom-center {
  margin-right: 10px;
}

#contents-top a {
  text-decoration: none;
  text-align: center;
  padding: 0em 0;
  width: 310px;
  height: 200px;
  display: block;
  float: left;
}

#contents-top a:hover {
  text-decoration: none;
}

a.contents-top-left {
  background: url("./images/hp_top.jpg") no-repeat 0 50%;
  color: #333;
}

a:hover.contents-top-left {
  background: url("./images/hp_top2.jpg") no-repeat 0 50%;
  color: #000;
}

a.contents-top-center {
  background: url("./images/sys_top.jpg") no-repeat 0 50%;
  color: #333;
}

a:hover.contents-top-center {
  background: url("./images/sys_top2.jpg") no-repeat 0 50%;
  color: #000;
}

a.contents-top-right {
  background: url("./images/rs_top.jpg") no-repeat 0 50%;
  color: #333;
}

a:hover.contents-top-right {
  background: url("./images/rs_top2.jpg") no-repeat 0 50%;
  color: #000;
}

a.contents-bottom-center {
  background: url("./images/network_top.jpg") no-repeat 0 50%;
  color: #333;
}

a:hover.contents-bottom-center {
  background: url("./images/network_top2.jpg") no-repeat 0 50%;
  color: #000;
}

a.contents-bottom-right {
  background: url("./images/rescue_top.jpg") no-repeat 0 50%;
  color: #333;
}

a:hover.contents-bottom-right {
  background: url("./images/rescue_top2.jpg") no-repeat 0 50%;
  color: #000;
}

#contents-top div {
  margin: 110px 35px 0 35px;
  line-height: 1.6em;
  text-align: left;
}


/*-- 見出し --*/
h2,h3,h4,h5,h6 {
  font-size: 100%;
  margin-bottom: 1em;
  padding: 0.5em 10px;
  border-top: 1px solid #cccccc;
  border-right: 1px solid #666666;
  border-bottom: 1px solid #666666;
  border-left: 1px solid #cccccc;
}

#contents-top h2,
#contents-top h3,
#contents-top h4,
#contents-top h5,
#contents-top h6 {
  border: none;
  background-color: #333;
  color: #9f0;
}

#contents-top h2 {
  background-color: #FFF;
  color: #33FF00;
  font-size: 200%;
  font-weight: bold;
  letter-spacing: 0.1em;
  line-height: 1.2em;
  
  margin: 0;
  padding: 0;
  
  height: 60px;
}

#contents-top .contents-top-left h2 {
  color: #3300CC;
}

#contents-top .contents-top-center h2 {
  color: #339966;
}

#contents-top .contents-top-right h2 {
  color: #FF3300;
}

#contents-top .contents-bottom-center h2 {
  color: #FF9933;
  letter-spacing: 0;
  font-size: 180%;
}

#contents-top .contents-bottom-right h2 {
  color: #006600;
}

/*-- 画像　--*/
#contents-top img {
  margin-right: 0px;
}

/*-- 文字 ---*/
#contents-top p {
  line-height: 2em;
  /* margin-bottom: 1em; */
  
  letter-spacing: 0.1em;
  margin-top: 1em;
  
}

/*-- 更新情報部分 ---*/
.information {
  height: 340px;
  overflow: auto;
  margin-bottom: 20px;
  padding: 10px 15px 10px 5px;
  border-top: 5px solid #339900;
  border-bottom: 1px solid #339900;
}

.information dt {
  margin-bottom: 5px;
  padding-left: 5px;
  border-left: 5px solid #666;
}

.information dd {
  line-height: 1.5em;
  margin-bottom: 15px;
  padding-bottom: 4px;
  border-bottom: 1px solid #cccccc;
}

/* -------------------------------------------------------------
   [3.5] コンテンツブロック内に関する指定 
   width: 680px */
#contents h2,
#contents h3 {
  font-size: 150%;
  padding: 10px 0 10px 50px;
  
  background: url("./images/circle_blue.gif") no-repeat 10px 50%;
}

#contents .t_icon {
  border-top: none;
  border-right: none;
  border-bottom: 1px solid #666666;
  border-left: none;
  
  padding: 10px 0 10px 30px;
  
  background: url("./images/t_icon.jpg") no-repeat 10px 50%;
}

#contents h3 {
  font-size: 150%;
  margin-top: 30px;
  padding: 10px 0 10px 50px;
}

#contents p {
  font-size: 120%;
  line-height: 1.5em;
  
  padding: 0 20px;
}

#contents table {
  border-top: 1px solid #666;
  border-left: 1px solid #666;
  border-collapse: collapse;
  width: 100%;
}

#contents th,
#contents td {
  margin: 0;
  padding: 0.3em 1em;
  font-size: 1em;
  font-weight: normal;
  text-align: center;
  vertical-align: top;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
}

#contents th {
  text-align: left;
  padding-left: 2em;
  background-color: #ffffcc;
}

.link_pagetop {
  float: right;
  margin: 20px 5px 0 0;
  display: block;
}

#contents a:link,
#contents a:visited,
#contents a:hover,
#contents a:active { text-decoration: none; }

#contents img {
  margin: 1.5em 0;
}


/* -------------------------------------------------------------
   [4] サイドバーブロック内に関する指定 
   #sidebar width: 234px
   */

/*-- サイドバー内　文字指定 ---*/
#sidebar p {
  line-height: 1.5em;
  margin-bottom: 0.5em;
}

/*-- サイドバー内　カテゴリータイトル ---*/
#sidebar p.sidebar-title {
  text-align: center;
  line-height: normal;
  padding: 0.5em 0;
  background-color: #333;
  color: #9f0;
}

/*-- サイドバー内　リスト（UL） ---*/
#sidebar ul {
  list-style-position: inside;
  margin: 5px 0 20px;
}

#sidebar li { margin: 0 0 0.5em; }

/*-- ナビゲーション ---*/

#sidebar ul.navigation {
  list-style-type: none;
  list-style-position: outside;
  margin: 0 0 20px;
}

#sidebar ul.navigation {
  border-top: 1px solid #CCC;
}

#sidebar .navigation li {
  display: inline;
  margin: 0;
}

#sidebar .navigation a {
  /* padding(R+L)+border(R+L)+width = 234px */
  width: 192px;
  /* padding: 4px 9px; */
  padding: 12px 15px 12px 25px;
  display: block;
  /* border: 1px outset #fff; */
  border: 1px solid #CCC;
  background-color: #FFF;
  text-decoration: none;
  color: #690;
  /* 中央ぞろえ、上辺1pxボーダー消去 */
  margin: -1px auto 0;
}

#sidebar .navigation a:hover {
  /* border: 1px outset #fff; */
  border: 1px solid #CCC;
  background-color: #EEE;
  text-decoration: none;
  color: #000;
  
  margin-top: -1px;
}

#sidebar .navigation li.lower a {
  padding: 10px 0px 10px 40px;
  border: none;
  margin: 0 auto;
}


#sidebar dl { margin: 0 0 20px; }

#sidebar dt {
  margin-bottom: 5px;
  color: #360;
}

#sidebar dd {
  line-height: 1.5em;
  margin-bottom: 10px;
}

#sidebar img {
  display: block;
  margin: 0 auto;
}

/* -------------------------------------------------------------
   [5] フッターブロック内に関する指定 */

#footer-menu span {
  padding-right: 4em;
}

#footer-menu a {
  color: #FFF;
}

#footer p.description {
  color: #DDD;
  font-size: 90%;
  padding: 1em 0 0 3em;
  line-height: 1.5em;
}

#footer .logo {
  text-align: left;
  float: right;
  
  color: #DDD;
  font-size: 90%;
  line-height: 1.2em;
  
  padding-top: 30px;
  margin-right: 30px;
  background: url("./images/footer_logo.jpg") no-repeat 0 0;
}

#footer .copyright {
  clear: both;
  color: #DDD;
  font-size: 90%;
  text-align: center;
}

#footer dl {
  margin: 20px 10px 10px 10px;
  float: left;
}

#footer dt {
  margin-bottom: 5px;
}

#footer dd {
  margin-left: 5px;
  
}

/* -------------------------------------------------------------
   [6] CSSデザインサンプルリンク指定 */
#cds {
  clear: both;
  font-size: 90%;
  font-family: Geneva, Arial, Helvetica, sans-serif;
  text-align: right;
  margin: 0;
}

#cds,
#cds a,
#cds a:hover {
  text-decoration: none;
  color: #ccc;
}

/* -------------------------------------------------------------
   [7] ログインフォームコンテンツに関する指定 */
#member-login .input-domain,
#member-login .input-passwd,
#member-login .input-image {
  margin: 10px 20px 0;
  padding: 3px 5px;
  
  letter-spacing: 0.1em;
}

#member-login .input-domain,
#member-login .input-passwd {
  width: 183px;
  color: #CCC;
  ime-mode: disabled;
}

/* used in jquery */
#member-login .text-focus {
  font-weight: bold;
  color: #333;
}

#member-login .input-image {
	margin-left: 130px;
	margin-top: 5px;
}

#member-login .input-domain {
  margin-top: 10px;
}

#member-login p {
  padding-top: 10px;
}

/* -------------------------------------------------------------
   [8] JQUERY画像自動切換えに関する指定 */

#main-image div {
  top: 0;
  left: 0;
  position: absolute;
}

/* -------------------------------------------------------------
   [9] お問合せページに関する指定 */
   
#contact dl {

}
   
#contact dt {
  width: 200px;
  margin: 0;
  padding: 10px 0 10px 20px;
  float: left;
  
  clear: both;
  
  border-top: 1px solid #DDD;
}

#contact dd {
  float: left;
  width: 437px;
  margin: 0;
  padding: 10px 0 10px 20px;
  
  border-top: 1px solid #DDD;
}

#contact p {
  padding-left: 1em;
  color: #FF0033;
  font-size: 90%;
}

#contact textarea {
  width: 250px;
  height: 100px;
}
