@charset "Shift-JIS";

/* ===============================================================
  CSS Info : 公式トップ用スタイル
=============================================================== */

/* ---------------------------------------------------------------
  重要なお知らせ
--------------------------------------------------------------- */

#notice {
  width: 756px;
  margin: 10px 2px;
  padding-bottom: 15px;
  background: url(../img/home/bg_notice_btm.gif) no-repeat center bottom;
}

#notice img {
  vertical-align: bottom;
}
#notice dt {
  float: left;
  padding: 15px 0 0 15px;
}

#notice dd {
  padding: 12px 0 0 156px;
  background: url(../img/home/bg_notice_top.gif) no-repeat center top;
}

#notice dd p {
  padding-right: 10px;
}

#notice dd ul {
  margin-top: 12px;
  /zoom: 1;
}

#notice dd ul:after {
  content: "";
  display: block;
  clear: both;
}

#notice dd li {
  display: inline;
  float: left;
  margin-right: 11px;
}

#notice dd a:hover img {
  filter: alpha(opacity=70);
  opacity: .7;
}

#notice a {
  color: blue;
  text-decoration: underline;
}

#emergency {
  margin: 10px 2px;
}

#emergency img {
  vertical-align: bottom;
}

#emergency2 {
  width: 756px;
  margin: 10px 2px 8px;
  padding-bottom: 10px;
  background: url(../img/home/bg_emergency_btm2.gif) no-repeat center bottom;
}

#emergency2 div {
  padding-top: 11px;
  background: url(../img/home/bg_emergency_top2.gif) no-repeat;
}

#emergency2 table {
  width: 100%;
}

#emergency2 table tr th {
  width: 155px;
  padding: 0 45px 0 11px;
}

#emergency2 table tr td {
  padding-right: 20px;
}

#emergency2 table tr td a {
  text-decoration: underline;
}
/* ---------------------------------------------------------------
  フラッシュスライダー
--------------------------------------------------------------- */

#flash,
#topvisual {
  margin: 2px 2px 0;
}

/* ---------------------------------------------------------------
  サービスバナー
--------------------------------------------------------------- */

#banners { /* clearfix */
  position: relative;
	width: 740px;
  height: 80px;
  margin: 10px;
  background: url(../img/home/bg_banner.gif) no-repeat;
}

#banners ul {
  position: absolute;
  top: 9px;
  left: 8px;
}

#banners ul li {
  float: left;
  width: 141px;
  margin-right: 5px;
}

#banners ul li a {
  float: left;
}

#banners ul li a:hover {
  filter: alpha(opacity=50);
  opacity: 0.5;
}

/* ---------------------------------------------------------------
  共通ボックス
--------------------------------------------------------------- */

.section {
  margin-bottom: 12px;
  padding: 1px;
  border: 1px solid #ccc;
}

/* ---------------------------------------------------------------
  目的から探す
--------------------------------------------------------------- */

.section.purpose { /* clearfix */
  width: 756px;
}

.section.purpose ul {
  margin: 6px 0 0 5px;
  overflow: hidden;
}

.section.purpose ul li {
  display: inline;
  float: left;
  width: 244px;
  margin-right: 4px;
  padding-bottom: 10px;
  background-repeat: no-repeat;
  background-position: 3px 26px;
}

.section.purpose ul li ul {
  margin: 0;
  padding: 5px 0 0 54px;
  line-height: 1.3;
}

.section.purpose ul li ul li {
  display: list-item;
  float: none;
  width: 183px;
  margin: 0;
  padding: 0 0 0 7px;
  background: url(../img/icn_arrow_blue_s.gif) no-repeat 0 0.25em;
}

/* 背景アイコン
-------------------------------------------------------- */

.section.purpose ul li#process {
  background-image: url(../img/home/icn_process.gif);
}
.section.purpose ul li#internet {
  background-image: url(../img/home/icn_internet.gif);
}
.section.purpose ul li#phone {
  background-image: url(../img/home/icn_phone.gif);
}
.section.purpose ul li#campaign {
  background-image: url(../img/home/icn_campaign.gif);
}
.section.purpose ul li#price {
  background-image: url(../img/home/icn_price.gif);
}
.section.purpose ul li#help {
  background-image: url(../img/home/icn_help.gif);
}

/* ---------------------------------------------------------------
  サービスから探す
--------------------------------------------------------------- */

.service .section ul {
  margin-top: 6px;
}

.service .section ul li {
  display: inline;
  float: left;
  margin: 0 4px 0 5px;
}

.service .section ul li a {
  float: left;
}

.service .section ul li a:hover {
  filter: alpha(opacity=50);
  opacity: 0.5;
}

/* サービスから探す
-------------------------------------------------------- */

.service .section.basic {
  float: left;
  width: 436px;
}

.service .section.basic ul {
  width: 436px;
}

/* 法人向けサービスから探す
-------------------------------------------------------- */

.service .section.business {
  float: right;
  width: 304px;
}

.service .section.business ul {
  width: 304px;
}

.service .section.business ul li {
  padding-bottom: 4px;
}

/* ---------------------------------------------------------------
  メインエリア
--------------------------------------------------------------- */

/* 120628 追加 */
#attention {
  width: 539px;
  height: 36px;
  line-height: 36px;
  margin-bottom: 8px;
  background: url(../img/home/bg_attention.gif) no-repeat;
}

#attention a {
  display: block;
  padding-left: 148px;
  font-weight: bold;
}
/* ---------- */

#main {
  float: left;
  width: 539px;
}

/* 共通ボックス
-------------------------------------------------------- */

#main .section {
  position: relative;
  width: 535px;
  margin-bottom: 7px;
}

/* 一覧・RSS・エリア情報ボタン、右矢印ボタン
-------------------------------------------------------- */

#main .section ul.linknav { /* clearfix */
  position: absolute;
  top: 6px;
  right: 5px;
  height: 18px;
  overflow: hidden;
}

#main .section ul.linknav li {
  display: inline;
  float: left;
  margin-left: 5px;
}

#main .section ul.linknav li a {
  display: block;
  width: 46px;
  height: 18px;   /* fot IE5.5 */
  height: /**/0;  /* for other */
  padding-top: 18px;
  background: url(../img/home/linknav_btn.gif) no-repeat;
}

#main .section ul.linknav li.to_rss a {
  background-position: 0 0;
}
#main .section ul.linknav li.to_list a {
  background-position: -46px 0;
}
#main .section ul.linknav li.to_area a {
  width: 68px;
  background-position: -92px 0;
}
#main .section ul.linknav li.to_fun a {
  width: 13px;
  height: 13px;   /* fot IE5.5 */
  height: /**/0;  /* for other */
  margin: 3px 3px 0 0;
  padding-top: 13px;
  background-position: 0 -36px;
}

#main .section ul.linknav li.to_rss a:hover {
  background-position: 0 -18px;
}
#main .section ul.linknav li.to_list a:hover {
  background-position: -46px -18px;
}
#main .section ul.linknav li.to_area a:hover {
  background-position: -92px -18px;
}
#main .section ul.linknav li.to_fun a:hover {
  background-position: 0 -49px;
}

/* リスト枠
-------------------------------------------------------- */

#main .section .listarea {
  padding: 7px 7px 5px 28px;
}

/* NTT西日本からのお知らせ
-------------------------------------------------------- */

#main .section .listarea ul li {
  height: 1%;
  line-height: 1.2;
  padding: 7px 5px 0 0;
  margin-bottom: 3px;
  background: url(../img/home/line_dot.gif) repeat-x;
}

#main .section .listarea ul li span {
  display: block;
  padding-left: 13px;
  background: url(../img/icn_arrow_blue_b_grad.gif) no-repeat 3px 0.2em;
}

/* 2010.10.22 お知らせ緊急部分リンク用に追記 */
.red {
  color: red;
  font-weight: bold;
}

.red a:link {
  color: red;
  text-decoration: underline;
}
.red a:visited {
  color: red;
  text-decoration: underline;
}

.red a:hover {
  color: #ff9999;
  text-decoration: underline;
}

.red a:active {
  color: red;
  text-decoration: underline;
}

/* ニュースリリース
-------------------------------------------------------- */

#main .section .listarea dl dt {
  height: 1%;
  margin-bottom: 3px;
  padding-top: 5px;
  background: url(../img/home/line_dot.gif) repeat-x;
}

#main .section .listarea dl dd {
  line-height: 1.2;
  margin-bottom: 5px;
  padding: 0 5px 0 13px;
  background: url(../img/icn_arrow_blue_b_grad.gif) no-repeat 3px 0.2em;
}

/* お楽しみコンテンツ
-------------------------------------------------------- */

#main .section ul.listarea { /* clearfix */
}

#main .section ul.listarea li {
  display: inline;
  float: left;
  width: 162px;
  margin: 0 2px 3px 0;
  font-size: 83%;
}

#main .section ul.listarea li dl { /* clearfix */
}

#main .section ul.listarea li dl dt {
  padding: 0;
  background: none;
}

#main .section ul.listarea li dl dt a {
  padding-left: 12px;
  background: url(../img/icn_arrow_orange_b.gif) no-repeat 2px 0.1em;
  color: #964b25;
}

#main .section ul.listarea li dl dt a:hover {
  color: #d17d53;
}

#main .section ul.listarea li dl dd.imgarea {
  float: left;
  padding: 0;
  border: 1px solid #c3c2c2;
  background: none;
}

#main .section ul.listarea li dl dd {
  line-height: 1.1;
  padding: 4px 0 0 50px;
  background: none;
}

#main .section ul.listarea li dl dd img {
  vertical-align: bottom;
}

/* ---------------------------------------------------------------
  サブエリア
--------------------------------------------------------------- */

#sub {
  float: right;
  width: 213px;
}

#sub ul li a {
  display: inline-block;
}

#sub ul li a {
  display: block;
}

#sub ul li img {
  vertical-align: bottom;
}

#sub a:hover img {
  filter: alpha(opacity=70);
  opacity: .7;
}

/* 支店情報・工事故障情報
-------------------------------------------------------- */

#sub ul.outlink {
  margin-bottom: 10px;
}

#sub ul.outlink li {
  margin-bottom: 5px;
}

#sub ul.outlink li a:hover {
  filter: alpha(opacity=50);
  opacity: 0.5;
}

/* ローカルナビ
-------------------------------------------------------- */

#sub ul.localnav {
  border: 1px solid #ccc;
  margin-bottom: 10px;
}

#sub ul.localnav li a:hover {
  filter: alpha(opacity=50);
  opacity: 0.5;
}

/* NTT西日本について */
#sub ul.localnav li#about {
  margin: 6px;
  padding-bottom: 5px;
  background: url(../img/home/bg_localnav_about_btm.gif) no-repeat left bottom;
  font-size: 83%;
}

#sub ul.localnav li#about ul {
  padding-left: 24px;
  border: 1px solid #e9e9e9;
  border-width: 0 1px;
}

#sub ul.localnav li#about ul li {
  line-height: 1.2;
  padding-left: 8px;
  background: url(../img/icn_arrow_gray.gif) no-repeat 0 0.2em;
}

#sub ul.localnav li#about ul li ul {
  padding: 0;
  border: none;
}

/* ソーシャルメディアアカウント一覧 111018：追加
-------------------------------------------------------- */

#sub .social {
  margin-bottom: 10px;
  padding-bottom: 13px;
  background: url(../img/home/social_bg_btm.gif) no-repeat center bottom;
}

#sub .social ul {
  padding: 13px 13px 10px;
  background: url(../img/home/social_bg_top.gif) no-repeat;
}

#sub .social p {
  margin-left: 13px;
  padding-left: 15px;
  background: url(../img/home/social_arw.gif) no-repeat 5px 50%;
}

/* CNWへのリンク 120404：追加
-------------------------------------------------------- */

#sub .cnw {
  margin-bottom: 10px;
  padding-bottom: 5px;
  border: 1px solid #ccc;
}

#sub .cnw dt {
  margin: 7px 0;
  text-align: center;
}

#sub .cnw dd {
  margin: 0 22px;
}

#sub .cnw p a {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  line-height: 1.3;
  margin: 4px 0 5px;
  font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

#sub .cnw .arw_min {
  padding-left: 11px;
  background: url(../img/home/arw_min.gif) no-repeat 2px 0.45em;
  color: #8998A2;
  font-size: 84%;
}

#sub .cnw .arw_blue {
  margin-bottom: 0;
  padding-left: 17px;
  background: url(../img/home/arw_blue.gif) no-repeat 2px 0.2em;
}

/* ---------------------------------------------------------------
  フロート解除
--------------------------------------------------------------- */

#banners:after,
.section.purpose:after,
.service:after,
#main .section ul.linknav:after,
#main .section ul.listarea:after,
#main .section ul.listarea li dl:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  line-height: 0;
  visibility: hidden;
}

#banners,
.section.purpose,
.service,
#main .section ul.linknav,
#main .section ul.listarea,
#main .section ul.listarea li dl {
  display: inline-block;
}

#banners,
.section.purpose,
.service,
#main .section ul.linknav,
#main .section ul.listarea,
#main .section ul.listarea li dl {
  display: block;
}

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


/**************************************
	* 情報セキュリティバナー(120119追加)
***************************************/
#security {
  position: relative;
  clear: both;
}

#security a {
  position: absolute;
  top: -61px;
  right: 0;
}
/***************************************/