/* ===============================================================\*/
/* トップページ用CSS
/* 更新日:2009.09.20
/* 制作者:Y.O
/* 
/* 目次：
/* 　　　1.レイアウトの設定
/* 　　　　リンク
/*
/* 　　　2.ヘッダーの詳細設定
/* 　　　　[1]ヘッダーメニューの設定
/* 　　　　[2]ヘッダー検索窓の設定
/* 　　　　[3]メニューの設定
/* 　　　　[4]フラッシュの設定
/*
/* 　　　3.コンテンツの詳細設定
/* 　　　　[1]新着情報の設定
/* 　　　　[2]キャンペーン情報の設定
/* 　　　　[3]事業所向けサービスの設定
/* 　　　　[4]ご家庭向けサービスの設定
/* 　　　　[5]下部バナーの設定
/*
/* 　　　4.フッターの詳細設定
/*
/* ===============================================================\*/
/* ===============================================================
　　　↓1.レイアウトの設定↓ 
===============================================================\*/
body {
  margin:0;
  padding:0;
  text-align:center;
  background-image: url(../image/bg.jpg);
  background-position:top;
  background-repeat:repeat-x;
  background-color: #AAE5FF;
}

* {
  margin:0px;
  padding:0px;
  vertical-align: top;
}

img {
  border:0;
  margin:0;
  padding:0;
  line-height:0;
}

p {
  font-size:80%;
  color:#333333;
}

.hide {
  display:none;
}

h1 {}

h2 {
  margin: 0px;
  padding: 0px;
}

h3 {
  margin: 5px 30px;
  padding: 0px;
}

address {
  background: url(../image/bg_footer.jpg);
  background-repeat: repeat-x;
  background-color: #207EC6;
  color: #FFF;
  font-style: normal;
  font-size: 80%;
  padding: 5px;
  line-height: 1.2em;
}

div#container {
  margin:0px auto;
  width:950px;
  text-align:center;
  background-color: #FFF;
}
	
/* =====リンク=====\*/
a:link {
  text-decoration: none;
  color:#333333;
}

a:visited {
  text-decoration: none;
  color:#333333;
}

a:hover {
  text-decoration: none;
  color: #147CD3;
}

a:active {
  text-decoration: none;
  color:#333333;
}

/* ===============================================================
　　　↓2.ヘッダーの詳細設定↓ 
===============================================================\*/
div#container div#header {
  width:950px;
  height: auto;
  background-image:url(../img/title_bg.gif);
  background-repeat:no-repeat;
  background-position:top;
  margin:0px;
  padding:0px;
  color:#333333;
  text-decoration:none;
  font-size:70%;
  text-align: center;
}

div#container div#header div#headerleft {
  width:250px;
  float:left;
  text-align:left;
}

div#container div#header div#headerright {
  width:690px;
  float:right;
  text-align:right;
}


div#container div#header div#headerright .headermenu {
  margin-top:38px;
}

/* =====[1]ヘッダーメニューの設定=====\*/
div#container div#header div#headerright div#headerrightwaku {
  width:430px;
  float:left;
  text-align:right;
}

div#container div#header div#headerright div#headerrightwaku li {
  list-style:none;
  display:inline;
  padding:0em;
}
 
div#container div#header div#headerright div#headerrightwaku a{
  padding:0em 0em 0em 1em;
  background-repeat:no-repeat;
  text-decoration:none;
  color:#666666;
}

/* =====[2]ヘッダー検索窓の設定=====\*/
div#container div#header div#headerright div#topkensakuwaku {
  width:240px;
  float:right;
  text-align:right;
  margin:25px 10px 0px 0px;
}

div#container div#header div#headerright div#topkensakuwaku *{
  vertical-align: middle;
}

/* =====[3]メニューの設定=====\*/
div#container div#header div#topmenu {
  clear: both;
  width: 926px;
  margin: 0px auto;
  padding: 5px 0px 0px 0px;
}

div#container div#header div#topmenu ul li {
  display: inline;
}

/* プルダウンメニュー \*/
ul.pulldown-menu li {
  font-size: 0px;
}

ul.pulldown-menu li {
  float: left;
}

ul.pulldown-menu li a {
  display: block;
}

ul.pulldown-menu li ul {
  position: absolute;
  z-index: 100;
}

/* 下層のメニューを不可視に \*/
ul.pulldown-menu li ul.off {
  display: none;
}

ul.pulldown-menu li ul span.off {
  display: none !important;
}

/* 下層のメニューを可視に \*/
ul.pulldown-menu li ul.on_office {
  display: block;
}

ul.pulldown-menu li ul span.on_office {
  display: block;
}

ul.pulldown-menu li ul li {
  float: none;
  clear: both;
  background-image: url(../image/pulldown_bg.jpg);
  float: left;
  font-size: 12px;
  text-align: left;
}

ul.pulldown-menu li ul li:hover {
  background-image: url(../image/pulldown_bg_o.jpg);
}

ul.pulldown-menu li ul li.sub {
  background-image: url(../image/pulldown_sub_bg.jpg);
}

ul.pulldown-menu li ul li.sub:hover {
  background-image: url(../image/pulldown_sub_bg_o.jpg);
}

ul.pulldown-menu li ul.on_office li {
  width: 221px;
  height: 24px;
}

ul.pulldown-menu li ul.on_home {
  display: block;
}

ul.pulldown-menu li ul.on_home li {
  height: 24px;
  width: 216px;
}

ul.pulldown-menu li ul.on_faq {
  display: block;
}

ul.pulldown-menu li ul.on_faq li {
  height: 24px;
  width: 208px;
}

ul.pulldown-menu li ul.on_company {
  display: block;
}

ul.pulldown-menu li ul.on_company li {
  height: 24px;
  width: 188px;
}

ul.pulldown-menu li ul li a {
  padding: 5px 0px 0px 49px;
}

ul.pulldown-menu li ul li.sub a {
  padding: 5px 0px 0px 63px;
}

/* =====[4]フラッシュの設定=====\*/
div#container div#header div#flash {
  width: 926px;
  margin: 0px auto;
}

/* ===============================================================
　　　↓3.コンテンツの詳細設定↓ 
===============================================================\*/
div#container div#barcontset {
  margin:0px auto;
  width:925px;
  text-align: center;
  clear:both;
}
#container #barcontset #whatsnew #news_tit {
	background-image: url(../image/news.jpg);
	height: 45px;
	width: 459px;
	text-align: right;
}
#container #barcontset #whatsnew #news_tit img {
	margin-top: 18px;
	margin-right: 10px;
}



/* =====[1]新着情報の設定=====\*/
div#container div#barcontset div#whatsnew {
  width:460px;
  float:left;
  text-align: left;
}

div#container div#barcontset div#whatsnew div#whatsnewcont {
  width: 459px;
  margin: 0px;
  padding: 0px;
  background-image: url(../image/bg_news.gif);
  background-position: bottom;
  background-repeat: no-repeat;
  font-size: 80%;
}

div#container div#barcontset div#whatsnew div#whatsnewcont dl {
  width:450px;
  font-size:90%;
  line-height:110%;
  text-align: left;
  margin: 0px 5px;
  padding: 10px 0px 10px 0px;
}
.news_line{
  background-image: url(../image/news_line.gif);
  background-repeat: no-repeat;
  background-position: bottom;
}

div#container div#barcontset div#whatsnew div#whatsnewcont dt {
	float:left;
	width:90px;
	margin-left:20px;
	padding:0px 0px 5px 15px;
	background-image: url(../image/news_yajirushi.gif);
	background-repeat:no-repeat;
	background-position: 0.1em 0.15em;
	clear:both;
	letter-spacing: 0.1em;
}

div#container div#barcontset div#whatsnew div#whatsnewcont dd {
  width:315px;
  margin-left:130px;
  padding:0px 0px 5px 0px;
}

div#container div#barcontset div#whatsnew div#whatsnewcont div.pasticon {
  text-align: right;
}

div#container div#barcontset div#whatsnew div#whatsnewcont div.pasticon_no {
  padding: 7px 10px 16px 0px;
}

div#container div#barcontset div#whatsnew div#whatsnewcont div.pasticon img {
  margin: 10px 10px 10px 0px;
  text-align: right;
}

/* =====[2]キャンペーン情報の設定=====\*/
div#container div#barcontset div#information {
  width:462px;
  float:right;
  text-align:right;
}

div#container div#barcontset div#information div#infocont {
  width: 462px;
  margin: 0px;
  padding: 10px 0px 0px 0px;
  background-image: url(../image/bg_campaign.gif);
  background-position: bottom right;
  background-repeat: no-repeat;
  text-align: left;
}

div#container div#barcontset div#information div#infocont img.leftimg {
	margin: 0px 0px 15px 25px;
	cursor: pointer;
}

div#container div#barcontset div#information div#infocont img.rightimg {
	margin: 0px 15px 15px 0px;
	cursor: pointer;
}

/* =====[3]事業所向けサービスの設定=====\*/
div#container div#barcontset div#services {
  width: 930px;
  clear: both;
}

div#container div#barcontset div#services div#jigyou {
  width:612px;
  float:left;
  text-align: center;
  margin: 0px auto;
  padding: 10px 0px;
}

div#container div#barcontset div#services div#jigyou div#jigyoucont {
  width: 612px;
  min-height: 442px;
  margin: 0px auto;
  padding: 0px 0px 20px 0px;
  background-image: url(../image/bg_company_service.jpg);
  background-position: bottom left;
  background-repeat: no-repeat;
  text-align: left;
  font-size: 80%;
  display: inline-block;
}

div#container div#barcontset div#services div#jigyou div#jigyoucont:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* Hide from IE-mac \*/
* html div#container div#barcontset div#services div#jigyou div#jigyoucont { height: 1%;}
div#container div#barcontset div#services div#jigyou div#jigyoucont { display: block;}
/* End hide from IE-mac */

div#container div#barcontset div#services div#jigyou div#jigyoucont ul {
  margin: 10px 30px 30px 30px;
}

div#container div#barcontset div#services div#jigyou div#jigyoucont ul li {
  padding: 0px 0px 8px 18px;
  background: url(../image/yajirushi_blue.jpg) no-repeat 1px 2px;
  list-style: none;
  text-align: left;
  letter-spacing: -0.05em;
  line-height: 1em;
}


div#container div#barcontset div#services div#jigyou div#jigyoucont div#jigyouleft{
  margin: 0px;
  padding: 0px;
  width: 50%;
  float: left;
  text-align: left;
}

div#container div#barcontset div#services div#jigyou div#jigyoucont div#jigyouleft h2 {
  margin-left: 5px;
  width: 299px;
  border-top: solid 1px #999;
}

div#container div#barcontset div#services div#jigyou div#jigyoucont div#jigyouright{
  margin: 0px;
  padding: 0px;
  width: 50%;
  float: right;
  text-align: left;
}

div#container div#barcontset div#services div#jigyou div#jigyoucont div#jigyouright h2 {
  padding-left: 0px;
  border-top: solid 1px #999;
  width: 301px;
}                                                                                 

/* =====[4]ご家庭向けサービスの設定=====\*/
div#container div#barcontset div#services div#katei {
  width:318px;
  float:right;
  text-align:center;
  padding: 10px 0px;
}

div#container div#barcontset div#services div#katei div#kateicont {
  width: 318px;
  min-height: 500px;
  margin: 0px auto;
  padding: 0px 0px 20px 0px;
  background-image: url(../image/bg_home_service.jpg);
  background-position: bottom right;
  background-repeat: no-repeat;
  text-align: left;
  font-size: 80%;
  display: inline-block;
}

div#container div#barcontset div#services div#katei div#kateicont:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* Hide from IE-mac \*/
* html div#container div#barcontset div#services div#katei div#kateicont { height: 1%;}
div#container div#barcontset div#services div#katei div#kateicont { display: block;}
/* End hide from IE-mac */

div#container div#barcontset div#services div#katei div#kateicont img.otameshi {
  margin: 5px 30px;
}

div#container div#barcontset div#services div#katei div#kateicont ul {
  margin: 0px 30px 0px 30px;
  border-bottom: solid 1px #C3C3C3;
}

div#container div#barcontset div#services div#katei div#kateicont ul li {
  padding: 0px 0px 8px 18px;
  background: url(../image/yajirushi_pink.jpg) no-repeat 1px 2px;
  list-style: none;
  text-align: left;
  letter-spacing: -0.05em;
  line-height: 1em;
}

/* =====[5]下部バナーの設定=====\*/
div#container div#bottomcont {
  clear: both;
  width: 950px;
  padding: 15px 0px 20px 0px;
  background-image: url(../image/foot_line.gif);
  background-position: center top;
  background-repeat: no-repeat;
  text-align: center;
}

div#container div#bottomcont img {
  margin: 5px 0px 0px 0px;
}

/*===============================================================
　　　↓4.フッターの詳細設定↓ 
===============================================================\*/
div#container div#footer {
  clear:both;
  margin:0px;
  padding:0px 0px;
  width:950px;
  background-color: #9dd9f5;
  text-align: center;
}

div#container div#footer p {
  padding: 8px 0px;
}

div#container div#footer p a:link {
  text-decoration: none;
  text-align:right;
  color:#333333;
}

div#container div#footer p a:visited {
  text-decoration: none;
  text-align:right;
  color:#333333;
}

div#container div#footer p a:hover {
  text-decoration: underline;
  text-align:right;
  color:#333333;
}

div#container div#footer p a:active {
  text-decoration: none;
  text-align:right;
  color:#333333;
}

