@charset "utf-8";
/* =======================================================================
	CSS information

	file name  :top.css
	version:1.0
	style info :トップページ用。
======================================================================= */
/* import　各ディレクトリのスタイルシートは以下を必ず読み込む
----------------------------------------------------------------------------- */
@import "default.css"; /*リセット、font.css、再定義*/
@import "base.css"; /*サイトの初期設定*/
@import "layout.css"; /*サイトの基本レイアウト*/


/* business
----------------------------------------------------------------------------- */
#business {
	width:935px;
	height:180px;
	background-image:url(../img/top/bg_buiness.gif);
	background-position:left top;
	background-repeat:repeat-x;
	position: relative;
	overflow: hidden;
	margin-bottom:3em;
	padding-left: 20px;
}

#business a{
padding-top:100px;
padding-left:10px;
padding-right:10px;
color:#333333;
font-size:12px;
}

#business .b_01 a,
#business .b_02 a,
#business .b_03 a,
#business .b_04 a,
#business .b_05 a{
	float: left;
	height:150px;
	display: block;
}
#business .b_01 a,
#business .b_02 a,
#business .b_03 a,
#business .b_04 a,
#business .b_05 a{
	display:block;
		height:150px;
	background-image:url(../img/top/list_buiness.jpg);
	background-position:left top;
	background-repeat:no-repeat;
}

#business .b_01 a {
	width:162px;
	background-position: 0px 0px;
}

#business .b_02 a{
	width:163px;
	background-position: -182px 0px;
}

#business .b_03 a{
	width:163px;
	background-position: -365px 0px;
}

#business .b_04 a{
	width:166px;
	background-position: -548px 0px;
}

#business .b_05 a{
	width:163px;
	background-position: -731px 0px;
}

#business .b_01 a:hover{
	background-position: 0px -183px;
}

#business .b_02 a:hover{
	background-position: -182px -183px;
}

#business .b_03 a:hover{
	background-position: -365px -183px;
}

#business .b_04 a:hover{
	background-position: -548px -183px;
}

#business .b_05 a:hover{
	background-position: -731px -183px;
}

#business strong {
	text-indent: -9999px;
	clear: both;
	width: 100px;
	overflow: hidden;
	visibility: hidden;
}


#business a:hover {
	text-decoration:none;
	color:#999999;
}




/* #contents_left
----------------------------------------------------------------------------- */
#contents_left .youtube a{
	padding:15px;
	font-size:90%;
	background-image:url(../img/common/arrow.gif);
	background-position:left;
	background-repeat:no-repeat;
}


#contents_left .news h2 {
	background-image:url(../img/top/bg_news.gif);
	background-position:left top;
	background-repeat:no-repeat;
	height:25px;
	padding-left:25px;
	padding-top:10px;
	margin-bottom:25px;
}

#contents_left .company h3,
#contents_left .environment h3{
	background-image:url(../img/top/bg_h3.gif);
}

/* news */
#contents_left .news {
	margin-bottom:2.5em;
	overflow:hidden;
	width:664px;
}

#contents_left .news li {
	border-bottom:#999999 1px dotted;
	overflow:hidden;
	text-indent:10px;
}

/* IE用に高さ指定、溢れた分を表示させるためにバックスラッシュハックでoverflowを指定する */
/*\*/
*html #contents_left .news li {
	height: 1em;
	overflow: visible;
}
/**/

#contents_left .news p.date {
	float:left;
	padding:10px 0px;
	margin-right:20px;
}

#contents_left .news p.newstitle {
	float:left;
	padding:10px 0px 10px 5px;
	background-image:url(../img/top/arrow_red.gif);
	background-position:left;
	background-repeat:no-repeat;
}

/* company */

#contents_left p{
line-height:150%;
font-size:90%;
}

#contents_left p strong{
padding-bottom:10px;
}
#contents_left .company {
	float:left;
	width:320px;
}

#contents_left .company .left,
#contents_left .environment .left {
	float:left;
	width:175px;
	padding-right:15px;
	font-size:90%;
	overflow:hidden;
}

#contents_left .company .right,
#contents_left .environment .right {
	float:left;
	width:130px;
	overflow:hidden;
	margin-bottom:15px;
}

#contents_left .company .btn {
	clear:both;
}

#contents_left .company .btn li {
	float:left;
	width:100px;
	text-indent:-9999px;
}

#contents_left .company .btn li.btn02 {
	margin:0px 10px;
}

#contents_left .company .btn li a{
	display:block;
	width:100px;
	background-image:url(../img/top/btn_company.jpg);
	background-position:left;
	background-repeat:no-repeat;
	height:26px;
}

#contents_left .company .btn li.btn01 a{
	background-position:0px 0px;
}

#contents_left .company .btn li.btn02 a{
	background-position:-110px 0px;
}

#contents_left .company .btn li.btn03 a{
	background-position:-220px 0px;
}

#contents_left .company .btn li.btn01 a:hover{
	background-position:0px -26px;
}

#contents_left .company .btn li.btn02 a:hover{
	background-position:-110px -26px;
}

#contents_left .company .btn li.btn03 a:hover{
	background-position:-220px -26px;
}


/* environment */
#contents_left .environment {
	float:left;
	width:320px;
	margin-left:24px;
}

/* pickup */
#contents_left .pickup {
	font-size: 92%;
	margin-bottom:2em;
	overflow:hidden;
	width:574px;
	border: 1px solid #008585;
	background-image: url(../img/top/pickup.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding-left: 80px;
	height: 20px;
	padding-top: 5px;
	padding-right: 10px;
}

/* youtube */
#contents_left .youtube {
	margin: auto;
	width: 574px;
}


/*--- add   ---*/
#container #contents #contents_left .wrap .company h4 {
	background-image: url(../img/top/quality.gif);
	background-repeat: no-repeat;
	height: 43px;
	text-indent: -9999px;
}
#container #contents #contents_left .wrap .company .right {
	text-align: center;
}
#container #contents #contents_left .wrap .environment .gleen {
	clear: both;
	background-image: url(../img/top/green_top.gif);
	background-repeat: no-repeat;
	padding-top: 5px;
	width: 309px;
}
#container #contents #contents_left .wrap .environment .gleen .gleen_under {
	background-image: url(../img/top/green_under.gif);
	background-repeat: no-repeat;
	padding-bottom: 7px;
	background-position: left bottom;
}
#container #contents #contents_left .wrap .environment .gleen .gleen_under .gleen_main {
	background-image: url(../img/top/green_img.gif);
	background-repeat: no-repeat;
	background-position: right top;
	background-color: #E7F6EE;
	padding: 10px;
	height: auto;
}
#container #contents #contents_left .wrap .environment .gleen .gleen_under .gleen_main li {
	list-style: none;
	padding-bottom: 7px;
	padding-top: 7px;
	font-size: 12px;
	background-image: url(../img/common/icon_dot.gif);
	background-repeat: no-repeat;
	background-position: 0px 10px;
	padding-left: 5px;
}
#container #contents #contents_left .wrap .environment .gleen .gleen_under .gleen_main ul {
	padding-top: 5px;
	padding-bottom: 5px;
}
#container #contents #contents_left .wrap .company .left {
	padding-left: 10px;
	padding-right: 5px;
}