﻿@charset "utf-8";

/*
---------------------------------------
# SiteName: S.Broad Program
# Update: 2008.5.22
# Editor: Yukiko.Iwama@so-net.co.jp
---------------------------------------
*/


/*---------------------------------------reset---------------------------------------*/
p, h1, h2, h4, h5, h6, h7, form, li, ul, input { margin: 0px; padding: 0px; list-style: none; }
body { margin: 0px; padding: 0px; background: #202020; color: #444444; font-size:medium; line-height: 1.5; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック"; }
a:link { color:#9B4A0F; text-decoration: underline; }
a:visited { color:#C65F13; text-decoration: underline; }
a:hover { color:#FF0000; text-decoration: underline; }
img { border: 0px; margin: 0px; padding: 0px; }
strong { font-weight: bold; }
.cl { clear: both; display: block; height: 0px; line-height: 0px; }
.no { display: none; font-size: 1px; }
.strong { font-weight: bold; }



/*---------------------------------------header---------------------------------------*/
div#header { height: 144px; width: 100%; background: url(../img/main_head_bg.gif) repeat-x 0px 0px; }
div#header div.innerBox { width: 950px; margin-right: auto; margin-left: auto; position:relative;}
div#header div.innerBox h1 { width: 281px; float: left; margin: 0px; padding: 0px; height: 83px; }
div#header div.innerBox p { float: right; width: 256px; padding: 35px 0px 0px; margin: 0px; }

/* globalMenu */
div#header div.innerBox ul {width: 950px; padding: 7px 0px 0px; margin: 0px; }
div#header div.innerBox ul li a:hover img { height: 0px; width: 0px;}


div#header div.innerBox ul li.outline { position:absolute; top:90px; left:0px;  width: 190px; height: 46px; background: url(../img/globalnavi_outline_over.gif) no-repeat 0px 0px; display: block; text-decoration: none;}
div#header div.innerBox ul li.outline a:hover { width: 190px; height: 46px; background: url(../img/globalnavi_outline_over.gif) no-repeat 0px 0px; display: block;}

div#header div.innerBox ul li.merit { position:absolute; top:90px; left:190px;  width: 190px; height: 46px; background: url(../img/globalnavi_merit_over.gif) no-repeat 0px 0px; display: block; text-decoration: none;}
div#header div.innerBox ul li.merit a:hover { width: 190px; height: 46px; background: url(../img/globalnavi_merit_over.gif) no-repeat 0px 0px; display: block;}

div#header div.innerBox ul li.maintenance { position:absolute; top:90px; left:380px;  width: 190px; height: 46px; background: url(../img/globalnavi_maintenance_over.gif) no-repeat 0px 0px; display: block; text-decoration: none;}
div#header div.innerBox ul li.maintenance a:hover { width: 190px; height: 46px; background: url(../img/globalnavi_maintenance_over.gif) no-repeat 0px 0px; display: block;}

div#header div.innerBox ul li.cost { position:absolute; top:90px; left:570px; width: 190px; height: 46px; background: url(../img/globalnavi_cost_over.gif) no-repeat 0px 0px; display: block; text-decoration: none;}
div#header div.innerBox ul li.cost a:hover { width: 190px; height: 46px; background: url(../img/globalnavi_cost_over.gif) no-repeat 0px 0px; display: block;}

div#header div.innerBox ul li.program { position:absolute; top:90px; left:760px;  width: 190px; height: 46px; background: url(../img/globalnavi_program_over.gif) no-repeat 0px 0px; display: block; text-decoration: none;}
div#header div.innerBox ul li.program a:hover { width: 190px; height: 46px; background: url(../img/globalnavi_program_over.gif) no-repeat 0px 0px; display: block;}



/* globalMenuSelected */
#outline div#header div.innerBox ul li.outline a img,
#merit div#header div.innerBox ul li.merit a img,
#maintenance div#header div.innerBox ul li.maintenance a img,
#cost div#header div.innerBox ul li.cost a img,
#program div#header div.innerBox ul li.program a img { height: 0px; width: 0px;}




/*---------------------------------------container---------------------------------------*/
/* topicPath */
div#container { background: #000000; margin: 0px; padding: 20px 0px; }
div#container ul.topicPath { margin:0px auto; width: 950px; color: #FFFFFF; padding: 0px 0px 20px; }
div#container ul.topicPath li {display:inline; line-height:110%; list-style-type:none; }
div#container ul.topicPath li.current { font-weight: bold; }
div#container ul.topicPath li a:link { color:#EE9553; text-decoration: underline; }
div#container ul.topicPath li a:visited { color:#F5C49E; text-decoration: underline; }
div#container ul.topicPath li a:hover { color:#FF0000; text-decoration: underline; }

/* innnerBoxbaselayout */
div#container h2 { margin: 0px auto; padding: 0px 0px 10px; width: 950px; color:#ffffff; }
div#container h2 img { padding-left: 30px; }
div#container span.containerHead { background: url(../img/main_container_head.gif) no-repeat 0px 0px; margin: 0px auto; padding: 0px; height: 6px; width: 950px; display: block; font-size: 0; line-height: 0; }
div#container span.containerBottom { background: url(../img/main_container_bottom.gif) no-repeat 0px 0px; margin: 0px auto; padding: 0px; height: 6px; width: 950px; display: block; font-size: 0; line-height: 0; }

/* baselayoutTitle */
div#container div.innerBox { width: 850px; background: #FFFFFF; padding: 20px 50px; margin: 0px auto; overflow: hidden; }
div#container div.innerBox h3 { margin: 0px; padding: 0px 0px 15px; }
div#container div.innerBox h4 { margin: 0px; padding: 0px 20px 15px; clear: both; }
div#container div.innerBox h5 { background: url(../img/title_h5_bg.gif) no-repeat 30px 0px; margin: 0px; padding: 0px 0px 15px 40px; }

/* baselayoutContents */
div#container div.innerBox p { margin: 0px; padding: 0px 0px 20px; }
div#container div.innerBox p.explanation { padding: 0px 20px 15px; }

div#container div.innerBox p.additionSingular { color: #930202; padding: 0px 0px 0px 1em; margin-right: 20px; margin-left: 20px; text-indent: -1em; font-size: 90%; }
div#container div.innerBox p.additionPlural { color: #930202; padding: 0px 0px 40px 1em; margin-right: 20px; margin-left: 20px; text-indent: -1em; font-size: 90%; }
div#container div.innerBox p.emphasisSingular { color: #303a9d; padding-bottom:0px; margin-right: 20px; margin-left: 20px; font-size: 90%; }
div#container div.innerBox p.emphasisPlural { color: #303a9d; padding-bottom:40px; margin-right: 20px; margin-left: 20px; font-size: 90%; }
div#container div.innerBox p.graphSingular { padding: 20px 75px 40px; }
div#container div.innerBox p.graphPlural { padding: 0px 75px 15px; }
div#container div.innerBox p.linkTop { margin: 0px; padding: 0px 0px 40px; text-align: right; }

/* baselayouFloat */
div#container div.innerBox div.service { margin-bottom: 25px; padding:0 20px; }
div#container div.innerBox div.service h5 { background: url(../../summary/img/smry_title_bg.gif) no-repeat; margin: 0px; padding: 0px 0px 5px 10px; }
div#container div.innerBox div.service ul { margin: 0px; padding: 0px 0px 15px 10px; }

/* detailedLink */
div#container div.innerBox p.detailedLink { background: url(../img/icon_arrow.gif) no-repeat 20px 13%; padding-left: 40px; }


/* caption */
div#container div.innerBox p.notes { padding: 0px 0px 40px 1em; margin-top: 10px; margin-right: 20px; margin-left: 20px; text-indent: -1em; font-size: 80%; }



/*---------------------------------------footer---------------------------------------*/
div#footer { background: #202020 url(../img/main_footer_bg.gif) repeat-x 0px 0px; height: 80px; width: 100%; clear:both;}
div#footer div.innerBox { width: 950px; margin: 0px auto; padding: 10px 0px 20px; height: 80px; }
div#footer div.innerBox p.aboutWebsite { text-align: right; width: 950px; }
div#footer div.innerBox p.copyRight { width: 950px; text-align: center; color: #FFFFFF; margin: 0px; padding-top: 20px; }


/*---------------------------------------IE HACK---------------------------------------*/
html>body div#header div.innerBox ul li.outline a { width: 190px; height: 46px; background: url(../img/globalnavi_outline_over.gif) no-repeat 0px 0px; display: block;}
html>body div#header div.innerBox ul li.merit a { width: 190px; height: 46px; background: url(../img/globalnavi_merit_over.gif) no-repeat 0px 0px; display: block;}
html>body div#header div.innerBox ul li.maintenance a { width: 190px; height: 46px; background: url(../img/globalnavi_maintenance_over.gif) no-repeat 0px 0px; display: block;}
html>body div#header div.innerBox ul li.cost a { width: 190px; height: 46px; background: url(../img/globalnavi_cost_over.gif) no-repeat 0px 0px; display: block;}
html>body div#header div.innerBox ul li.program a { width: 190px; height: 46px; background: url(../img/globalnavi_program_over.gif) no-repeat 0px 0px; display: block;}


