@charset "utf-8";
/* CSS Document */


/* ==================================================

　index.html（ホームページ）

================================================== */


/* 左側メインメニュー
---------------------------------------- */

div#contents div#main ul li a.firstCustomer { background-image: url(../../images/disposer/index/menu1.jpg); }
div#contents div#main ul li a.manual { background-image: url(../../images/disposer/index/menu2.jpg); }
div#contents div#main ul li a.IntroCase { background-image: url(../../images/disposer/index/menu3.jpg); }
div#contents div#main ul li a.impression { background-image: url(../../images/disposer/index/menu4.jpg); }
div#contents div#main ul li a.faq { background-image: url(../../images/disposer/index/menu5.jpg); }
div#contents div#main ul li a.info { background-image: url(../../images/disposer/index/menu6.jpg); }
div#contents div#main ul li a.eco { background-image: url(../../images/disposer/index/menu7.jpg); }

/* キャッチコピー */
/*
div#contents div#main div#catchCopy {
	width: 550px;
	height: 223px;
	background: url(../../images/disposer/index/catch_copy.jpg) 0 0 no-repeat;
}

div#contents div#main div#catchCopy div.nApproach {
	width:365px;
	height: 80px;
}

div#contents div#main div#catchCopy div.nApproach a.natureApproach {
	display: block;
	width:365px;
	height: 80px;
	background: url(../../images/disposer/index/menu7.jpg) 0 0 no-repeat;
	overflow: hidden;
	text-indent: -9999px;
}

div#contents div#main div#catchCopy div.nApproach a.natureApproach:hover {
	background-position: 0 bottom;
}
*/


/* 右側バナー・ニュースリリース エリア
---------------------------------------- */

/* ニュースリリース */
div#contents div#rightMenu div.newsRelease {
	background: url(../../images/disposer/index/bg_news_center.gif) 0 0 repeat-y;
}

div#contents div#rightMenu div.newsRelease div.nrTop {
	background: url(../../images/disposer/index/bg_news_top.gif) 0 0 no-repeat;
}



/* ==================================================

　howtouse/index.html（使い方）

================================================== */

div#contents div#howtouse .subtext {
	width: 520px;
}

div#contents div#howtouse div#operationwrap {
	width: 520px;
	margin-bottom: 30px;
}

div#contents div#howtouse div#operationwrap .contents01 {
	width: 130px;
	float: left;
	margin-top: 20px;
}

div#contents div#howtouse div#operationwrap .contentsImg {
	text-align: center;
	padding-bottom: 5px;
}

div#contents div#howtouse div#operationwrap .contentsWord {
	text-align: left;
	padding: 0px 0px 10px 5px;
}

div#contents div#howtouse div#operationwrap .noImg {
	padding: 0px 5px 25px 0px;
}

div#contents div#howtouse div#operationwrap .border01 {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
}

div#contents div#howtouse div#operationwrap .border02 {
	border-right-width: 1px;
	border-right-style: dotted;
	border-right-color: #CCC;	
}

div#contents div#howtouse div#operationwrap .border03 {
	border-left-width: 1px;
	border-left-style: dotted;
	border-left-color: #CCC;
}

div#contents div#howtouse .contents02 {
	width: 520px;
	margin: 20px 0px 0px 0px;
}

div#contents div#howtouse .operationImg {
	padding: 0px 20px 20px 0px;
}

div#contents div#howtouse .sentence {
	color: #F90;
}


/* ==================================================

　uservoice/index.html（利用者の声）

================================================== */

div#contents div#uservoice h4 {
	color: #F90;
}

div#contents div#uservoice div.img-box {
	float: left;
}

div#contents div#uservoice div.img-box img {
	padding: 0px 20px 10px 0px;
}



/* ==================================================

　faq/index.html（よくある質問）

================================================== */

div#contents div#faq dl {
	padding-bottom: 15px;
	line-height: 1.8em;
	border-bottom: 1px dotted #CCC;
}

div#contents div#faq dl dt {
	margin-top: 15px;
	padding: 8px 0 12px 50px;
	background-image: url(../../images/disposer/faq/q.gif);
	background-repeat: no-repeat;
	background-position: left top;
	color: #5b8800;
	font-weight: bold;
}

div#contents div#faq dl dd {
	margin-left: 40px;
	padding: 8px 0 12px 50px;
	background-image: url(../../images/disposer/faq/a.gif);
	background-repeat: no-repeat;
	background-position: left top;
}



/* ==================================================

　advantage/index.html(ディスポーザー導入メリット)

================================================== */

div#contents div#advantage {
	width: 550px;
}

div#contents div#advantage div#disposercontents {
	margin-top: 50px;
}

div#contents div#advantage .pastImg {
	padding: 0px 0px 10px 10px;
}

div#contents div#advantage .advantagetitle {
	width: 550px;
	margin-bottom: 10px;
}

div#contents div#advantage .title {
	margin-bottom: 10px;
}

div#contents div#advantage .advantageImg {
	padding: 0px 20px 20px 0px;
}

div#contents div#advantage .advantagearrow01 {
	padding: 5px 5px 40px 0px;
}

div#contents div#advantage .advantagearrow02 {
	padding: 5px 5px 10px 15px;
}



/* ==================================================

　index.html(商品紹介)

================================================== */
div#contents div#disposer div#mediaWrap {
	width: 550px;
	margin-bottom: 30px;
}

div#contents div#disposer div#bg-top {
	background-image: url(../../images/disposer/introduction/bg_media_top.gif);
	width: 550px;
	height: 15px;
}

div#contents div#disposer div#bg-bottom {
	background-image: url(../../images/disposer/introduction/bg_media_bottom.gif);
	width: 550px;
	height: 17px;
}

div#contents div#disposer div#media {
	background-image: url(../../images/disposer/introduction/bg_media_center.gif);
	background-repeat: repeat-y;
}

div#contents div#disposer div#mediaBox {
	float: left;
	margin: 5px 15px 10px 15px;
}

div#contents div#disposer div#btn {
	width: 550px;
	padding-top: 30px;
}

div.contentsArea div#disposer div.products-case {
	clear: both;
	width: 550px;
	margin-top: 20px;
}

div.contentsArea div#disposer a.btnAdvantage,
div.contentsArea div#disposer a.btnDisposer {
	display: block;
	width: 265px;
	height: 45px;
	background-repeat: no-repeat;
	background-position: top;
	text-indent: -9999px;
	overflow: hidden;
}

div.contentsArea div#disposer a.btnAdvantage {
	background-image: url(../../images/disposer/introduction/btn_advantage.gif);
}

div.contentsArea div#disposer a.btnDisposer {
	background-image: url(../../images/disposer/introduction/btn_disposer.gif);
}

div.contentsArea div#disposer a.btnAdvantage:hover,
div.contentsArea div#disposer a.btnDisposer:hover {
	background-position: bottom;
}

div#contents div#disposer .r15 {
	margin-right: 15px;
}

div#contents div#disposer .btnbottom {
	padding: 0px 10px 30px 0px;	
}

div#contents div#disposer .mediaword {
	line-height: 14px;
	padding: 0px 10px;
}


/* mediaplayer ロールオーバー
---------------------------------------- */
div#contents div#disposer div#mediaWrap ul#playbtn {
    list-style:none;
    width:100%;
}

div#contents div#disposer div#mediaWrap ul#playbtn li{
    list-style:none;
    float:left;
    width:171px;
	padding-right: 10px;
}

div#contents div#disposer div#mediaWrap ul#playbtn a{
    display:block;
    width:171px;
    height:43px;
    text-indent:-100px;
    overflow:hidden;
}

a.windows{
    background-image: url(../../images/disposer/introduction/btn_windows.gif);
}

a:hover.windows{
    background-position:0px -42px;
}

a.mac{
    background-image: url(../../images/disposer/introduction/btn_macintosh.gif);
}

a:hover.mac{
    background-position:0px -42px;
}


/* mediaplayer 時間
---------------------------------------- */
div#contents div#disposer div#mediaWrap ul#playtime {
    list-style:none;
    width:100%;
}

div#contents div#disposer div#mediaWrap ul#playtime li{
    list-style:none;
    float:left;
    width:171px;
	padding: 0px 10px 20px 0px;
	text-align: center;
}


/* mediaplayer 取得ボタン
---------------------------------------- */
div#contents div#disposer div#mediaWrap ul#mediabtn {
    list-style:none;
    width:100%;
}

div#contents div#disposer div#mediaWrap ul#mediabtn li{
    list-style:none;
    float:left;
    width:88px;
	padding: 0px 10px 0px 0px;
	margin-bottom: 30px;
}