@charset "utf-8";

/* +++++++++++++++++++++++++++++++++++++++++++
	Title:CSS for Social Business Net
	Modify: 2009/03/19
  +++++++++++++++++++++++++++++++++++++++++++ */

/* +++++++++++++++++++++++++++++++++++++++++++
	======INDEX=====
	1. Import
	2. Global Setting
	3. Font
	4. Link
	5. Rayout
	6. Head
	7. Foot
	8. Navigation
	9. SBCB_logo
	10. Topics
  +++++++++++++++++++++++++++++++++++++++++++ */

/*----------------------------------------------------------------------------------------
	1. Import
---------------------------------------------------------------------------------------- */

/* reset.css */
@import url(reset.css);

/*----------------------------------------------------------------------------------------
	2. Global Setting
---------------------------------------------------------------------------------------- */

body {
	color: #4A4A4A;
	background: #FFF url(../img/bgBody.jpg) repeat-y top center;
	font-size: 62.5%;
	line-height: 1.7;
	text-align:center;
}
.iepngfix {
	behavior:expression(IEPNGFIX.fix(this));
}
br.clear {
	font-size:1%;
	line-height:1%;
	clear:both;
}
.contentBody {
	margin:0 10px;
}
.hidenavi {
	display:none;
}

/*----------------------------------------------------------------------------------------
	3. Font
---------------------------------------------------------------------------------------- */

p {
	font-size:1.4em;
	margin:0 0 20px;
}

/*----------------------------------------------------------------------------------------
	4. Link
---------------------------------------------------------------------------------------- */

a {
	color:#09326A;
	text-decoration:underline;
	outline:0;
}
a:hover {
	text-decoration:none;
}


/*----------------------------------------------------------------------------------------
	5. Rayout
---------------------------------------------------------------------------------------- */
#wrapper {
	padding:0 20px;
	background:transparent url(../img/bgWrap.jpg) no-repeat top center;
	text-align:center;
}
#head {
	width:900px;
	height:153px;
	margin:0 auto;
	background:#FFF url(../img/bgHead.gif) no-repeat bottom center;
	position:relative;
	top:0;
	left:0;
	text-align:left;
}
#main {
	width:900px;
	margin:0 auto;
	padding:30px 0 50px;
	text-align:left;
	background:#FFF;
}
#foot {
	width:920px;
	margin:0 auto;
	padding:10px 0 60px;
	position:relative;
	top:0;
	left:0;
	text-align:left;
	background:#FFF url(../img/bgFoot.gif) no-repeat top center;
}

/*----------------------------------------------------------------------------------------
	6. Head
---------------------------------------------------------------------------------------- */

#head h1 {
	text-align:center;
	padding:30px 0 0;
}
#head ul {
	width:138px;
	position:absolute;
	top:27px;
	right:0;
}
#head ul li {
	margin:0 0 9px;
}

/*----------------------------------------------------------------------------------------
	7. Foot
---------------------------------------------------------------------------------------- */

#foot p#btnTop {
	width:98px;
	height:10px;
	position:absolute;
	top:10px;
	right:0;
}
#foot ul {
	margin:0 0 10px;
	padding:0;
}
#foot ul li {
	display:inline;
	margin:0 6px 0 0;
	padding:0 6px 0 0;
	border-right:1px solid #222;
}
#foot p {
	margin:0;
	color:#666;
	font-size:1.0em;
}

/*----------------------------------------------------------------------------------------
	8. Content(Top)
---------------------------------------------------------------------------------------- */
#main #content {
	width:900px;
	position:relative;
	top:0;
	left:0;
}
#main #content #topStory {
	width:900px;
	height:234px;
	margin:0 0 40px;
	background:transparent url(../img/bgTopStory.gif) no-repeat;
	position:relative;
	top:0;
	left:0;
}
#main #content #topStory h2 {
	position:absolute;
	top:20px;
	left:20px;
}
#main #content #topStory p.phTopStory {
	width:144px;
	height:144px;
	background:transparent url(../img/bgPhTopStory.gif) no-repeat;
	position:absolute;
	top:70px;
	left:20px;
}
#main #content #topStory p.phTopStory img {
	margin:3px;
	/margin:2px 3px;
}
#main #content #topStory ul.topStoryQA {
	width:400px;
	position:absolute;
	top:90px;
	left:185px;
}
#main #content #topStory ul.topStoryQA li {
	margin:0 0 25px;
	padding:0 0 0 60px;
	height:43px;
	font-size:1.6em;
	line-height:1.4;
}
#main #content #topStory ul.topStoryQA li.question {
	background:transparent url(../img/icnTopStoryQ.gif) no-repeat left center;
}
#main #content #topStory ul.topStoryQA li.answer {
	background:transparent url(../img/icnTopStoryA.gif) no-repeat left center;
	line-height:43px;
}
#main #content #topStory p.btnTopStory {
	width:282px;
	height:228px;
	position:absolute;
	top:5px;
	right:20px;
}
#main #content #topCategory {
	width:658px;
	position:relative;
	z-index:3;
}
#main #content #topCategory h2 {
	margin:0 0 25px;
}
#main #content #topCategory ul.topCategoryList {
	width:658px;
}
#main #content #topCategory ul.topCategoryList li {
	width:144px;
	margin:0 20px 30px 0;
	float:left;
	display:block;
}
#main #content #topCategory ul.topCategoryList li.last {
	margin:0 0 30px;
}
#main #content #topCategory dl dt {
	margin:0 0 10px;
}
#main #content #topCategory dl dd h3,
#main #content #topCategory dl dd p {
	font-size:1.2em;
	line-height:1.4;
}
#main #content #topCategory dl dd h3 {
	font-weight:bold;
	margin:0 0 10px;
}
#main #content #topCategory p.phTopCategory {
	width:144px;
	height:144px;
	background:transparent url(../img/bgPhTopCategory.gif) no-repeat;
	margin:0 0 10px;
}
#main #content #topCategory p.phTopCategory img {
	margin:3px;
	/margin:2px 3px;
}
#main #content #topRegion {
	width:221px;
	position:absolute;
	top:274px;
	right:0;
}
#main #content #topRegion h2 {
	margin:0 0 25px 0;
}
#main #content #topRegion ul.topRegionList {
	width:221px;
	margin:0 0 15px 0;
}
#main #content #topRegion ul.topRegionList li {
	width:103px;
	height:32px;
	font-size:1%;
	line-height:1%;
	margin:0 15px 23px 0;
	float:left;
}
#main #content #topRegion ul.topRegionList li.right {
	margin:0 0 23px;
}
#main #content #topMap {
	width:406px;;
	position:absolute;
	top:600px;
	right:0;
}
#main #content #topMap .topMapBase {
	width:406px;
	height:326px;
	position:relative;
}
#main #content #topMap .topMapBase p {
	width:406px;
	height:326px;
	position:absolute;
	top:0;
	left:0;
}
#main #content #topMap .topMapBase p.topMap00 {
	z-index:1;
}

/*----------------------------------------------------------------------------------------
	9. Content(Sub)
---------------------------------------------------------------------------------------- */
#main .sub#content {
	width:900px;
	background:transparent url(../img/bgMain.gif) repeat-y top left;
}
#main .sub#content #mainCnt {
	width:700px;
	float:right;
	text-align:left;
}
#main .sub#content #mainCnt h2 {
	margin:0 0 25px;
}
#main .sub#content #mainCnt .headArea {
	border:1px solid #D1E4EA;
	margin:0 0 20px;
}
#main .sub#content #mainCnt .headArea h2 {
	font-size:2.1em;
	font-weight:bold;
	color:#1B7697;
	line-height:1;
	margin:12px 12px 8px;
}
#main .sub#content #mainCnt .headArea ul {
	margin:0 12px 8px;
}
#main .sub#content #mainCnt .headArea ul li {
	font-size:1.4em;
	line-height:1.4;
}
#main .sub#content #mainCnt h3 {
	margin:0 0 15px;
}
#main .sub#content #mainCnt h3.ttlList {
	font-size:2.8em;
	font-weight:bold;
	color:#1B7697;
	margin:0 0 30px 15px;
}
#main .sub#content #mainCnt h4 {
	font-size:1.4em;
	margin:0 0 10px 10px;
}
#main .sub#content #mainCnt p {
	font-size:1.4em;
	margin:0 0 40px 10px;
}
#main .sub#content #mainCnt p.phMrg {
	margin:0 0 20px 10px;
}
#main .sub#content #mainCnt p.impact {
	font-size:1.4em;
	font-weight:bold;
	color:#666;
}
#main .sub#content #mainCnt p.impact img {
	margin:0 0 0 15px;
}
#main .sub#content #mainCnt .phDetail {
	width:700px;
	height:176px;
	margin:0 0 20px;
	background:transparent url(../img/bgPhDetail.gif) no-repeat;
}
#main .sub#content #mainCnt .phDetail ul {
	margin:0 0 0 12px;
}
*html #main .sub#content #mainCnt .phDetail ul {
	margin:0 0 0 4px;
}
#main .sub#content #mainCnt .phDetail ul li {
	margin:16px 0 0 8px;
	padding:0 20px 0 0;
	float:left;
}
#main .sub#content #mainCnt .phDetail ul li p {
	width:142px;
	height:142px;
	margin:0;
	padding:0;
	border:1px solid #E5E5E5;
}
#main .sub#content #mainCnt .phDetail ul li p img {
	margin:2px;
}
#main .sub#content #mainCnt .cntProposal {
	margin:0 0 40px;
}
#main .sub#content #mainCnt .cntProposalBody {
	margin:15px 0 0 5px;
	padding:5px 0 20px;
}
#main .sub#content #mainCnt .cntProposalBody p.proposalImage {
	float:left;
	width:112px;
	margin:0 15px 20px 0;
	padding:0 0 0 20px;
}
#main .sub#content #mainCnt .cntPoint {
	margin:0 0 40px;
}
#main .sub#content #mainCnt .cntPointBody {
	margin:15px 0 0px 5px;
	padding:0 0 20px;
}
#main .sub#content #mainCnt .cntProposal h3,
#main .sub#content #mainCnt .cntPoint h3 {
	margin:0;
}
#main .sub#content #mainCnt .cntProposal h4 {
	font-size:1.8em;
	font-weight:bold;
	line-height:1.2;
	margin:0 20px 10px 150px;
}
#main .sub#content #mainCnt .cntPoint p.pointImage {
	float:left;
	width:87px;
	margin:0 15px 20px 0;
	padding:0 0 0 20px
}
#main .sub#content #mainCnt .cntProposal p {
	margin:0 0 10px 150px;
}
#main .sub#content #mainCnt .cntProposal p.who {
	font-weight:bold;
}
#main .sub#content #mainCnt .cntPoint p {
	margin:0 0 0 150px;
}
#main .sub#content #mainCnt .cntPoint p.name {
	text-align:right;
	font-weight:bold;
}
#main .sub#content #mainCnt table.tblContact {
	width:100%;
	font-size:1.4em;
	border-collapse:collapse;
	margin:0 0 30px;
}
#main .sub#content #mainCnt table.tblContact th,
#main .sub#content #mainCnt table.tblContact td {
	padding:5px 10px;
	border:1px solid #B3B3B3;
}
#main .sub#content #mainCnt table.tblContact th {
	width:25%;
}
#main .sub#content #mainCnt table.tblContact td {
	width:75%;
}
#main .sub#content #mainCnt .mainCntList {
	width:700px;
	background:transparent url(../img/bgMainCntList.gif) repeat-y top left;
	padding:0 0 1px;
}
#main .sub#content #mainCnt .mainCntList ul.itemList li {
	width:350px;
	height:175px;
	float:left;
	position:relative;
	top:0;
	left:0;
}
#main .sub#content #mainCnt .mainCntList ul.itemList li h4 {
	width:170px;
	font-size:1.2em;
	font-weight:bold;
	line-height:1.4;
	margin:0 0 8px 170px;
	padding:25px 0 0;
}
#main .sub#content #mainCnt .mainCntList ul.itemList li p {
	width:170px;
	font-size:1.2em;
	line-height:1.4;
	margin:0 0 0 170px;
}
#main .sub#content #mainCnt .mainCntList ul.itemList li p.area {
	color:#888;
	margin:10px 0 0 170px;
}
#main .sub#content #mainCnt .mainCntList ul.itemList li p.phItemList {
	width:144px;
	height:144px;
	background:transparent url(../img/bgPhTopCategory.gif) no-repeat;
	margin:0;
	position:absolute;
	top:17px;
	left:17px;
}
#main .sub#content #mainCnt .mainCntList ul.itemList li p.phItemList img {
	margin:3px;
	/margin:2px 3px;
}
#main .sub#content #navi {
	width:160px;
}
#main .sub#content #navi p {
	width:160px;
	height:34px;
	margin:0 0 34px;
}
#main .sub#content #navi dl dt {
	height:32px;
}
#main .sub#content #navi dl dd {
	margin:0 0 34px;
}