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

/*/////////////////////////////////////////////////////////
file name: index.css
description: 共通指定スタイルシート

1.レイアウト
2.メイン画像
3.新着情報
4.お問い合わせ
5.事例・お試し版

///////////////////////////////////////////////////////// */

/* ===========  1.レイアウト  =========== */
body {
	background: url(../../images/bg.jpg) left top repeat-x;
}

.topContents {
	position: relative;
	margin-top: 30px;
	_margin-top: 10px;
	
}



/* ===========  2.メイン画像  =========== */

#topMain {
	position: relative;
}

#mainImg {
	/*background: #FFF url(../../images/bg_index01.jpg) left top no-repeat;*/
	width: 710px;
	height: 340px;
	margin-right: 10px;
	overflow: hidden;
	float: left;
}

.linkbox {
	float: left;
	width: 180px;
	height: 257px;
	background: url(../../images/trial.jpg) left top no-repeat;
	color: #FFF;
	padding: 83px 10px 0;
}

.linkbox02 {
	float: left;
	width: 180px;
	height: 257px;
	background: url(../../images/trial.jpg) left top no-repeat;
	color: #FFF;
	padding: 83px 10px 0;
}
	
#trialLink {
	position: absolute;
	top: 200px;
	right: 0;
	background: #FF0000;
}

.mobile {
	padding-right: 60px;
	padding-top: 54px;
}


/* ===========  3.サービスラインナップ  =========== */
#service {
	width: 600px;
	float: left;
	margin-right: 30px;
}

#serviceArea01 {
	width: 260px;
	float: left;
	margin-right: 20px;
	height: 117px;
	background: url(../../images/bg_2W.jpg) left top no-repeat;
	padding: 140px 15px 0;
}

a.btn2W {
    background-image: url(../../images/btn_2W.jpg);
	background-position: 0 40px;
	height:40px;
	width: 230px;
	margin: 0 auto;
	text-align: center;
	text-indent: -9999px;
	display: block;
}

a:hover.btn2W {
    background-position: 0 0;
}

#serviceArea02 {
	width: 260px;
	float: left;
	height: 117px;
	background: url(../../images/bg_Pro.jpg) left top no-repeat;
	padding: 140px 15px 0;
}

a.btnPro {
    background-image: url(../../images/btn_Pro.jpg);
	background-position: 0 40px;
	height:40px;
	width: 230px;
	margin: 0 auto;
	text-align: center;
	text-indent: -9999px;
	display: block;
}

a:hover.btnPro {
    background-position: 0 0;
}



/* ===========  3.新着情報  =========== */

#topics {
	width: 290px;
	float: left;
}

dl.list-news {
	width: 290px;
	margin-top: 5px;
	padding-bottom: 5px;
	background: url(../images/lineDot.gif) center bottom no-repeat;
}

dl.list-news dt {
	width: 6em;
	float: left;
	background: url(../../images/bg_topics.gif) left 4px no-repeat;
	padding-left: 10px;
}

dl.list-news dd {
	padding-left: 6em;

}



/* ===========  4.お問い合わせ  =========== */
/*#boxContact {
	position: absolute;
	right: 0;
	bottom: 0;
	background: url(../../images/bg_boxContact.jpg) left bottom no-repeat;
	width: 290px;
}*/

#boxContact {
	background: url(../../images/bg_boxContact.jpg) left bottom no-repeat;
	width: 290px;
	margin-top: 10px;
}

a.btnContact02 {
    background-image: url(../../images/btn_boxContact.jpg);
	background-position: 0 25px;
	height:25px;
	width: 127px;
	text-indent: -9999px;
	display: block;
	margin-left: 163px;
}

a:hover.btnContact02 {
    background-position: 0 0;
}

/* ===========  5.事例・お試し版  =========== */
#info {
	float: left;
	width: 430px;
	padding: 20px 0 0;
}

.case {
	float: left;
	width: 210px;
	margin-right: 10px;
}

.demo {
	float: right;
	width: 210px;
}

a.btnCase {
    background-image: url(../../images/btnCase.jpg);
	background-position: 0 120px;
	height:120px;
	width: 210px;
	text-indent: -9999px;
	display: block;
}

a:hover.btnCase {
    background-position: 0 0;
}

a.btnDemo {
    background-image: url(../../images/btnDemo.jpg);
	background-position: 0 120px;
	height:120px;
	width: 210px;
	text-indent: -9999px;
	display: block;
}

a:hover.btnDemo {
    background-position: 0 0;
}