/***************************************************************************
[Yocto-各コンテンツエリア:目次]
	基本情報
	01：Yoctoとは
	02：活用実例
	03：プラン内容
	04：導入事例
	05：お試しダウンロード
	06：お問合せ
	07：その他
	トップ（モジュールで生成されるページなど）
/***************************************************************************

/* 基本情報
*****************************************************/
div#contents{
	/*width:450px;*/
	text-align:left;
	background:#FFFFFF;
    color: #353535;
    margin-bottom:20px;
    line-height:150%;
}

div#contents h1 {
	color: #480000;
	font-size: 1.3em;
	background: url(../images/01-ttl.jpg) no-repeat center bottom;
	padding:0px 0 15px 0;
	width: 450px;
}

div#contents h2 {
	color: #480000;
	font-size: 1.1em;
	background: url(../images/h2.gif);
	background-repeat: no-repeat;
	width: 450px;
	height: 22px;
	padding-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
}

div#contents a {
	color: #0b3768;
}

div#contents-inner{
	width:450px;
	text-align:left;
	background:#FFFFFF;
    color: #353535;
    margin-bottom:20px;
    line-height:150%;
}

#contents-inner img {
	padding-left: 8px;
}

/* a */
div#contents-inner a {
	text-decoration: underline;
	font-weight: normal;
	color: #0b3768;
}

div#contents-inner a:visited {
	text-decoration: underline;
	font-weight: normal;
	color: #0b3768;
}

div#contents-inner a:hover {
	text-decoration: none;
	font-weight: normal;
	color: #606060;
}

div#contents-inner h1 {
	color: #480000;
	font-size: 1.4em;
	background: url(../images/01-ttl.jpg) no-repeat center bottom;
	width: 450px;
}

div#contents-inner h2 {
	color: #480000;
	font-size: 1.1em;
	background: url(../images/h2.gif);
	background-repeat: no-repeat;
	width: 450px;
	height: 22px;
	padding-left: 10px;
	margin-bottom: 10px;
	margin-top: 10px;
}

div#contents-inner ul {
	line-height: 110%;
    list-style-image: url(../images/bu.gif);
}

div#contents-inner li {
	line-height: 110%;
    display: marker; marker-offset: 0em;
}

/* title */
div#contents img.title{
	margin:0px 0px 15px 0px;
	clear:both;
}

div#contents img.toptitle{
	margin:0px 0px 5px 0px;
	clear:both;
}

div#contents img.subtitle{
	margin:10px 0px 15px 0px;
	clear:both;
}

div#contents img.subtitle2{
	margin:10px 0px 2px 10px;
	clear:both;
}

.txttitle {
	color: #003333;
	font-weight: bold;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
	padding:10px 0 0 10px !important;
}

.txttitle2 {
	font-weight: bold;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
	border:1px #D6D3D3 solid;
	padding:7px;
	/*width:433px;*/
	/*width:100%;*/
	margin:15px 0px 10px 0px ;
}

.txttitle3 {
	font-weight: bold;
	font-family: "ＭＳ ゴシック", "Osaka－等幅";
	color: #2C6400;
	padding: 10px 15px 0 15px;
	font-size: 1em;
	line-height: 120% !important;
	letter-spacing: 0 !important;
	margin: 0;
}

.txttitle4 {
	font-weight: bold;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
	color: #333333;
	padding:0;
	font-size:1.1em;
	line-height:120% !important;
	letter-spacing:0 !important;
	margin:0;
	text-align:center;
}

.txttitle5 {
	font-weight: bold;
	/*font-family:"ＭＳ ゴシック", "Osaka－等幅";*/
	color: #FA8647;
	padding:10px 15px 0 15px;
	font-size:1.2em;
	line-height:120% !important;
	/*letter-spacing:0 !important;*/
	margin:0;
}

div#contents-inner p.txttitle6 {
	color: #454443;
	font-weight: bold;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
	width:430px;
	margin:5px 10px;
	padding:1px 0px 1px 3px !important;
	border-left:3px solid #C2A92E;
}


.txttitle5 span.tx05s {
	font-weight:normal;
	font-size:0.8em;
	color: #666666;
}	

/* img */
img.line{
	margin:5px 0px;
}

img.fig-L{
	margin:0px 10px 10px 0px;
}

img.fig-R{
	margin:0px 0px 10px 10px;
}

/* list */
div.listarea{
	width:450px;
	margin:10px 0 10px 0;
}

div.listarea:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

ul.list01{
	list-style:none;
	padding:0px 0px 10px 0px !important;
	margin:0px 0px 0px 0px !important;
	display:block;
	width:205px;
	float:left;
}

ul.list01-long{
	list-style:none;
	padding:0px 0px 10px 0px !important;
	margin:0px 0px 0px 0px !important;
	display:block;
	float:left;
}

.list01 li,
.list01-long li{
	padding:0px 0px 0px 15px;
	margin:0px 0px 10px 0px;
	background:url(../images/icon-arrow-blue.gif) 0px 7px no-repeat;
	display:block;
}

ul.list02{
	list-style:none;
	padding:10px 0 5px 0 !important;
	margin:0 !important;
	display:block;
	width:450px;
	text-decoration: none;
}

.list02 li{
	width:220px;
	height:33px;
	padding:0 !important;
	margin:0px 2px 5px 2px !important;
	background:url(../images/btn-red.gif) 0 0 no-repeat;
	display:block;
	float:left !important;
	text-decoration: none;
}

.list02 li a{
	width: 180px;
	height: 26px;
	padding: 10px 0 0 20px;
	float: left;
	font-weight: bold;
	color: #A57A70;
	display: block;
	text-decoration: none;
}

ul.list03{
	list-style:none;
	padding:0px 0px 10px 0px !important;
	margin:0px 0px 0px 0px !important;
	display:block;
	width:205px;
	float:left;
}

.list03 li,
.list03-long li{
	padding:0px 0px 0px 15px;
	margin:0px 0px 10px 0px;
	background:url(../images/icon-circle.gif) 0px 5px no-repeat;
	display:block;
}

/* p */
div#contents p{
	padding:0px 10px 10px 10px;
	clear:both;
	overflow:hidden;
	display:block;
	margin:0px;
}

/* ul ol */
div#contents ul,
div#contents ol{
	padding:0 0 10px 15px;
	display:block;
	margin:0px;
}

div#contents li{
	margin:7px 0 0 15px;
}

.ex{
	font-size:10px;
	color:#666666;
}

/* font */
.b{
	font-weight:bold;
}

.red{
	color:#CC0000;
}

.s10{
	font-size:10px;
}

.normal{
	font-weight:normal;!important
}

/* leyout */
.center{
	text-align:center;
}

.right{
	text-align:right;
}

/* table */
table.tablearea{
	margin:0px 10px 20px 10px;
	border-bottom: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	width:430px;
	}	

.tablearea th{
	margin:0px;
	padding:7px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	background-color:#F1F4F5;
	font-weight: bold;
	}	

.tablearea td{
	margin:0px;
	padding:7px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	}	

table.tablearea02{
	margin:0px 10px 20px 10px;
	border-bottom: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	width:430px;
	}	

.tablearea02 th{
	margin:0px;
	padding:7px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	background-color:#E7F2F8;
	text-align:center;
	font-weight:normal;
	}	

.tablearea02 td{
	margin:0px;
	padding:7px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	text-align:center;
	}	

/* 01：Yoctoとは
*****************************************************/
/* 01-03 */
.tablearea ol{
	margin:0px 0px 0px 20px;
	padding:0px;
}

/* 01-05 */
div#contents-inner dl.function-l{
	padding:0 0 20px 0;
	margin:0px 0px 10px 0px;
	clear:both;
	overflow:visible;
}

div#contents-inner dl.function-l:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

div#contents-inner dd.function-d{
	float:left;
	margin:0px;
	padding:0;
	width:210px;
	display:block;
}

div#contents-inner dt.function-t{
	float:right;
	margin:0;
	padding:0;
	display:block;
	width:240px;
}

div.colum{
	background: #F1F4F5;
	margin: 10px 0;
	padding: 10px;
}

p.columttl{
	font-weight:bold;
}

div#contents p.findingtxt {
	width: 428px;
	padding: 10px;
	clear: both;
	overflow: hidden;
	display: block;
	margin: 0px;
	border: 1px solid #CCCCCC;
	background: #FFFFC3;
   line-height:150%
}

/* 02：活用実例
*****************************************************/
div.use{
	margin:0;
	padding:0;
	zoom:1;/*for IE 5.5-7*/
}

div.use-l{
	float:left;
	width:255px;
	margin:0;
	padding:0 0 0 4px;
}

div.use-r{
	float:right;
	width:175px;
	margin:0;
	padding:0;
}

/* p title */
p.usetitle {
	color: #003333;
	font-weight: bold;
	font-size: 120%;
	padding:10px 0 4px 10px!important;
}

p.usesubtitle {
	color: #003333;
	font-size: 100%;
	padding:0px 0 4px 10px !important;
}

p.usesubtitle2 {
	padding:20px 0 0 10px !important;
}


/* p other */
p.notice {
	color: #CC3300;
	font-weight: bold;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
	padding:0 0 0 6px!important;
}

p.btn-right {
	padding:0!important;
	text-align:right;
}

p.fig-center {
	padding:10px 0 15px 0!important;
	text-align:center;
}

/* yocto benefit */

div.yocto-benefit{
	margin:15px 0 20px 0;
	padding:0;
	border:1px solid #CCCCCC;
	zoom:1;/*for IE 5.5-7*/
}

div.yocto-benefit-l{
	float:left;
	width:53px;
	margin:0;
	padding:0 0 0 15px;
}

div.yocto-benefit-r{
	float:right;
	width:380px;
	margin:0;
	padding:0;
}

/*	After start
---------------------*/
div.yocto-benefit:after,
div.use:after{
	content:".";
	display: block;
	height:0px;
	clear:both;
	visibility:hidden;
}
/*	After End
---------------------*/


div.problem {
	padding:5px 0px 0px 0px;
	border:1px solid #CCCCCC;
}	


/* 03：プラン内容
*****************************************************/
/* 03 */
ul.planlist01{
	list-style:none;
	padding:0px 0px 0px 0px;
	margin:0px 10px 5px 10px;
	display:block;
	width:425px;
	color:#0E355A;
}

.planlist01 li{
	padding:0px 0px 0px 20px;
	margin:0px 0px 10px 0px;
	background:url(../images/point.gif) 0px 2px no-repeat;
	display:block;
}

ul.planlist02{
	list-style:none;
	padding:0px 0px 0px 0px;
	margin:0px 10px 5px 10px;
	display:block;
	width:425px;
	color:#CC6600;
}

.planlist02 li{
	padding:0px 0px 0px 20px;
	margin:0px 0px 10px 0px;
	background:url(../images/point.gif) 0px 2px no-repeat;
	display:block;
}

div.planformbg{
	padding:10px;
	margin:10px 0px 5px 0px;
	background:#DDE7F1;
	/*width:450px;*/
	width: auto;
}

/* 04：導入事例
*****************************************************/
div.interview{
	margin:0;
	padding:0;
	zoom:1;/*for IE 5.5-7*/
}

div.interview-l{
	display:inline;
	float:left;
	width:165px;
	margin:0;
	padding:0 0 0 10px;
}

div.interview-r{
	float:right;
	width:275px;
	margin:0;
	padding:0;
}

p.company {
	padding:0 0 10px 0 !important;
	font-weight:bold;
}

p.company a:link {
	font-weight:bold;
	color: #606060;
}

p.company a:visited {
	font-weight:bold;
	color: #606060;
}

p.company a:hover {
	font-weight:bold;
	color: #0B3768;
	text-decoration: underline;
}


p.interviewtitle {
	color: #CC3300;
	font-weight: bold;
	font-family:"ＭＳ ゴシック", "Osaka－等幅";
	padding:10px 0 10px 10px !important;
}

div.interview dl{
	width:270px;
	margin:0 0 4px 0;
	padding:0;
	zoom:1;/*for IE 5.5-7*/
}

div.interview dt{
	float:left;
	width:75px;
	margin:0;
	padding:0;
}

div.interview dd{
	float:left;
	width:187px;
	margin:0 0 0 8px;
	padding:0;
	line-height:1.1;
}


img.fig-l{
	float:left;
	margin:0;
	padding:5px 15px 5px 0;
}

img.fig-r{
	float:right;
	margin:0;
	padding:5px 0 5px 15px;
}


/*	After start
---------------------*/
div.interview:after,
div.interview dl:after{
	content:".";
	display: block;
	height:0px;
	clear:both;
	visibility:hidden;
}
/*	After End
---------------------*/



/* 05：お試しダウンロード
*****************************************************/
/* 05-01 */
.floawarea img{
	margin:0px 1px 3px 1px;
	float:left;
}

.updataarea{
	margin:0px 0px 10px 0px;
	padding:0px;
}

.updataarea dl{
	/*width:450px;*/
	width: auto;
	margin:0px 0px 10px 0px;
	display:block;
}

.updataarea dl:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

.updataarea dd{
	width:150px;
	margin:0px 10px 0px 10px;
	overflow:hidden;
	padding:0px 0px 0px 0px;
	display:block;
	float:left;
}
.updataarea dt{
	width:200px;
	margin:0px 10px 0px 10px;
	overflow:hidden;
	padding:0px 0px 0px 0px;
	display:block;
	float:left;
}

div.downloadarea{
	background:#DDE7F1;
	padding:10px 0px;
	margin:0px;
	/*width:450px;*/
	width: auto;
}


/* 06：お問合せ
*****************************************************/
/* Q&A */
.qalistarea1,
.qalistarea1 dl{
	/*width:450px;*/
	width: auto;
	margin:0px 0px 10px 0px;
	display:block;
}

.qalistarea1 dl:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

.qalistarea1 dd{
	width:381px;
	margin:0px 10px 0px 10px;
	overflow:hidden;
	padding:0px 0px 0px 20px;
	font-weight:bold;
	text-indent:-15px;
}

.qalistarea1 dt{
	width:381px;
	margin:5px 10px 0px 30px;
	overflow:hidden;
	padding:0px 0px 0px 20px;
	text-indent:-15px;
}


.qalistarea2,
.qalistarea2 dl{
	/*width:450px;*/
	width: auto;
	margin:0px 0px 10px 0px;
}

.qalistarea2 dl:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

.qalistarea2 dd{
	width:381px;
	margin:0px 10px 0px 10px;
	overflow:hidden;
	border-top:1px #D6D3D3 solid;
	border-left:1px #D6D3D3 solid;
	border-right:1px #D6D3D3 solid;
	padding:7px 7px 7px 40px;
	background:#EFEEEE url(../images/icon-q.gif) 7px 7px no-repeat;
}
.qalistarea2 dt{
	width:381px;
	margin:0px 10px 0px 10px;
	overflow:hidden;
	border:1px #D6D3D3 solid;
	padding:7px 7px 7px 40px;
	background:url(../images/icon-a.gif) 7px 7px no-repeat;
}

p.qaback{
	text-align:right;
	background:url(../images/icon-arrow-blue.gif) 310px 5px no-repeat;
	font-size:10px;
	color:#666666;
	width:430px;
	display:block;
}


/* トップ（モジュールで生成されるページなど）
*****************************************************/
/* frontlist */
div.frontlist{
	width:635px;
	margin:0;
	padding:0;
	text-align:left;
	line-height: 150%;
}

div.frontlist dl{
	/*background:url(../images/icon-blue.gif) 0px 15px no-repeat;*/
	padding:10px 0 10px 5px;
	margin:0 0 0 15px;
	clear:both;
	zoom:1;
}

div.frontlist dl:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

div.frontlist dt{
	float:left;
	margin:0;
	padding:0 0 0 5px;
	width:105px;
	display:block;
}

div.frontlist dt img{
	margin:0;
	padding:0;
}

div.frontlist dd{
	width:395px;
	float:right;
	margin:0;
	padding:0;
	display:block;
}

div.frontlist dd p{
	margin:0 !important;
}

/*div.frontlist a:link,
div.frontlist a:visited,
div.frontlist a:hover
{
	color:#000099;
	text-decoration:underline !important;
}
*/

div.frontlist ul{
	list-style:none;
	margin:0 0 10px 0 !important;
	padding:0 !important;
	clear:both;
}
div.frontlist ul a:link,
div.frontlist ul a:visited,
div.frontlist ul a:hover
{
	color:#666666 !important;
	text-decoration:underline !important;
}

div.frontlist li{
	padding:0 0 0 15px !important;
	margin:0 0 4px 0;
	/*background:url(../images/icon-blue.gif) 0px 5px no-repeat;*/
	display:block;
}

.day{
	color:#999999;
}

div.whatsnew{
	text-align:left;
	width:610px;
	zoom:1;
}

div.whatsnew:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

div.whatsnew p{
	margin:10px 0 0 30px !important;
	padding:0 !important;
}

div.contact{
	margin:10px 10px 0 30px !important;
	padding:10px 0 0 0;
	background:#FAFBFB;
}

/* ul ol */
div.whatsnew ul,
div.whatsnew ol{
	padding:0 0 10px 40px !important;
	display:block;
	margin:0px;
}

/* table */
div.whatsnew table{
	margin:0px 10px 20px 30px;
	border-bottom: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	width:580px;
	}	

div.whatsnew th{
	margin:0px;
	padding:7px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	background-color:#F1F4F5;
	font-weight: bold;
	}	

div.whatsnew td{
	margin:0px;
	padding:7px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	}	
	
/* hr */
hr{
	border:1px #CCCCCC solid;
	margin:10px 15px 0 30px;
}

/* サイトマップ
*****************************************************/
div.sitemaparea{
	margin:0 0 10px 0;
	zoom:1;
}

div.sitemaparea:after{
	display:block;
	margin-top:-1px;
	height:1px;
	content:"";
	clear:both;
}

div.sitemap-l{
	float:left;
	width:300px;
	margin:0 0 0 10px;
}

div.sitemap-r{
	float:right;
	width:300px;
	margin:0 10px 0 0;
}

div.sitemaparea p{
	background: url(../images/ttl-bg-top.gif) 0 0 repeat;
	width:270px;
	border-bottom:2px solid #BDCBCE;
	padding:8px 0 8px 30px !important;
	margin:10px 0 0 0 !important;
}
div.sitemaparea p a{
	text-align: left;
	font-family: Arial, Helvetica,sans-serif;
	font-size:12px;
	font-weight:bold !important;
	color:#485E62 !important;
}

div.sitemaparea ul{
	list-style:none;
	margin:0;
	padding:0;
}

div.sitemaparea li{
	background: url(../images/runk.gif) 0 2px no-repeat;
	padding:0 0 0 15px;
}