@charset "utf-8";

/*-------------------------------------------------------

	CSS INFORMATION
	
	Site URL: http://www.onpino.jp/
	date :
	
	Order of description
	
	Default_Style_clear
	
	1 : container			(#container)
	2 : header 				(#header)
	3 : navigation 			(#navigation)
	4 : wrapper 			(#wrapper)
	5 : footer 				(#footer)
	6 : category 			(category)
	
--------------------------------------------------------*/

/*------------------------------------------------------
	__Default_Style_clear
------------------------------------------------------*/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, img, form, input {
	margin: 0;
	padding: 0;
}
address {font-style: normal;}
h1, h2, h3, h4, h5, h6 {font-weight: normal;}
ul, ol, li {list-style: none;}
img {
	border: none;
	vertical-align: bottom;
}
hr { display: none;}

body {
	color: #666;
	font-size: 62.5%;
	font-family:
		Verdana,
		Arial,
		"Hiragino Kaku Gothic Pro",
		"ヒラギノ角ゴ Pro W3",
		Osaka,
		"MS P Gothic",
		"ＭＳ Ｐゴシック",
		'メイリオ',
		'Meiryo',
		sans-serif;
	line-height: 1.0;
}

a {color: #0048aa; text-decoration: none;}
a:link    {color: #0048aa;}
a:visited {color: #0048aa;}
a:hover   {color: #0048aa; text-decoration: underline;}
a:focus   {color: #0048aa;}
a:active  {color: #0048aa;}

html {overflow: auto;} /*Fire fox scrollbar*/

/*-------------------------------------------------------
	1 : container			(#container)
-------------------------------------------------------*/
#container { background: url(../img/bg_header.jpg) left top repeat-x;}

/*-------------------------------------------------------
	2 : header 				(#header)
-------------------------------------------------------*/
#header {
	width: 760px;
	height: 93px;
	margin: 0 auto;
	position: relative;
	margin-bottom: 15px;
}
#header #logo {
	position: absolute;
	top: 0;
	left: 0;
	font-size: 1.0em;
}
#header p#ttl {
	position: absolute;
	top: 0;
	left: 241px;
}

/*-------------------------------------------------------
	3 : navigation 			(#navigation)
-------------------------------------------------------*/
ul#navigation {
	width: 760px;
	height: 33px;
	position: absolute;
	top: 60px;
	left:0;
	background: url(../img/global_nabi.jpg) no-repeat;
}
ul#navigation li { float: left;}
ul#navigation li a ,
ul#navigation li span {
	display: block;
	height: 33px;
	text-indent: -9999px;
	font-size: 0;
	line-height: 0;
}
ul#navigation li.navi_00 a ,
ul#navigation li.navi_00 span { width: 91px;}
ul#navigation li.navi_01 a { width: 111px;}
ul#navigation li.navi_02 a { width: 111px;}
ul#navigation li.navi_03 a { width: 111px;}
ul#navigation li.navi_04 a { width: 111px;}
ul#navigation li.navi_05 a { width: 111px;}
ul#navigation li.navi_06 a { width: 114px;}

ul#navigation li.navi_01 a:hover { background: url(../img/global_nabi.jpg) no-repeat -91px -33px;}
ul#navigation li.navi_02 a:hover { background: url(../img/global_nabi.jpg) no-repeat -202px -33px;}
ul#navigation li.navi_03 a:hover { background: url(../img/global_nabi.jpg) no-repeat -313px -33px;}
ul#navigation li.navi_04 a:hover { background: url(../img/global_nabi.jpg) no-repeat -424px -33px;}
ul#navigation li.navi_05 a:hover { background: url(../img/global_nabi.jpg) no-repeat -535px -33px;}
ul#navigation li.navi_06 a:hover { background: url(../img/global_nabi.jpg) no-repeat -646px -33px;}

ul#navigation li.navi_01_01 a {
	width: 111px;
	height: 33px;
	background: url(../img/global_nabi.jpg) no-repeat -91px -33px;
}
ul#navigation li.navi_02_01 a {
	width: 111px;
	height: 33px;
	background: url(../img/global_nabi.jpg) no-repeat -202px -33px;
}
ul#navigation li.navi_03_01 a {
	width: 111px;
	height: 33px;
	background: url(../img/global_nabi.jpg) no-repeat -313px -33px;
}
ul#navigation li.navi_04_01 a {
	width: 111px;
	height: 33px;
	background: url(../img/global_nabi.jpg) no-repeat -424px -33px;
}
ul#navigation li.navi_05_01 a {
	width: 111px;
	height: 33px;
	background: url(../img/global_nabi.jpg) no-repeat -535px -33px;
}
ul#navigation li.navi_06_01 a {
	width: 114px;
	height: 33px;
	background: url(../img/global_nabi.jpg) no-repeat -646px -33px;
}

/*-------------------------------------------------------
	4 : wrapper 			(#wrapper)
-------------------------------------------------------*/
#wrapper {
	width: 760px;
	margin: 0 auto 0px auto;
	position:relative;
	padding:0 0 10em 0;
}
#wrapper p {
	font-size: 1.2em;
	line-height: 1.6;
	margin: 0 0 20px 0;
}
#visual { position:relative; zoom:1;}
#visual a {
	position: absolute;
	right: 10px;
	bottom: 35px;
}
img.main_visual { margin-bottom: 20px;}
#maincontent {
	width: 640px;
	float: left;
}
img.mainimage { margin-bottom: 20px;}

#content {
	width: 760px;
	float: left;
	clear: both;
	margin-bottom: 50px;
}
.ph_img {
	width: 186px;
	float: left;
	margin: 15px 0 0 0;
}
.txt_lead {
	width: 544px;
	float: right;
}
#content_inner {
	width: 760px;
	height: 234px;
	position: relative;
	background: url(../img/bg_content.gif) left top no-repeat;
}
.col_001 img {
	position: absolute;
	top: 15px;
	left: 12px;
}
.col_001 p {
	position: absolute;
	top: 14px;
	left: 108px;
	font-size: 1.2em;
	line-height: 1.4;
}

.col_002 img {
	position: absolute;
	top: 15px;
	left: 392px;
}
.col_002 img#arrow {
	position: absolute;
	top: 17px;
	left: 568px;
}
.col_002 p {
	position: absolute;
	top: 14px;
	left: 486px;
	font-size: 1.2em;
	line-height: 1.4;
}

.col_003 img {
	position: absolute;
	top: 96px;
	left: 12px;
}
.col_003 p {
	position: absolute;
	top: 94px;
	left: 108px;
	font-size: 1.2em;
	line-height: 1.4;
}

.col_004 img {
	position: absolute;
	top: 96px;
	left: 392px;
}
.col_004 p {
	position: absolute;
	top: 94px;
	left: 486px;
	font-size: 1.2em;
	line-height: 1.4;
}

.col_005 img {
	position: absolute;
	top: 176px;
	left: 12px;
}
.col_005 p {
	position: absolute;
	top: 176px;
	left: 108px;
	font-size: 1.2em;
	line-height: 1.4;
}
.col_006 img {
	position: absolute;
	top: 176px;
	left: 392px;
}
.col_006 p {
	position: absolute;
	top: 176px;
	left: 486px;
	font-size: 1.2em;
	line-height: 1.4;
}

/*-------------------------------------------------------
	5 : footer 			(#footer)
-------------------------------------------------------*/
#footer {
	width: 100%;
	clear: both;
	height: 52px;
	padding: 1px 0 0 0;
	background: url(../img/footer_line.gif) left top repeat-x;
}
#footer_link {
	width: 760px;
	height: 27px;
	margin: 0 auto;
	position: relative;
	background: url(../img/footer_nabi.gif) left top no-repeat;
}
#footer ul li { float: left;}
#footer ul li a {
	display: block;
	height: 29px;
	text-indent: -9999px;
	font-size: 0;
	line-height: 0;
}
#footer ul li.navi_06 a { width: 64px;}
#footer ul li.navi_07 a { width: 116px;}
#footer ul li.navi_08 a { width: 66px;}
#footer ul li.navi_09 a { width: 84px;}
address {
	position: absolute;
	top: 34px;
	right: 0;
	font-style: normal;
	color: #9cf;
}
/*-------------------------------------------------------
	6 : category 			(category)
-------------------------------------------------------*/

#bread_rubbish {
	width: 760px;
	margin: 0 auto 20px auto;
}
#bread_rubbish ul { font-size: 1.0em;}
#bread_rubbish ul li {display: inline;}
#consept {
	width: 760px;
	float: left;
	clear: both;
	margin: 15px 0 20px 0;
}
#consept h1,
#clear_txt h1 ,
#consept h2,
#clear_txt h2 ,
#consept h3,
#clear_txt h3 { margin-bottom: 15px;}
.consept_txt,
.left_txt {
	width: 500px;
	float: left;
}

#wrapper .consept_txt p,
#wrapper .left_txt p { line-height: 1.8em;}

.consept_ph,
.right_ph {
	width: 240px;
	float: right;
}
.recruitment {
	width: 760px;
	float: left;
	clear: both;
	margin: 0px 0 30px 0;
}
.recruitment h1 {
	margin:0 0 15px 0;
}
.recruitment01 {
	width: 760px;
	float: left;
	clear: both;
	margin: 0px 0 30px 0;
}
.professional {
	width: 370px;
	float: left;
}
.service {
	width: 370px;
	float: right;
}
#wrapper table#box {
	width: 760px;
	margin: 15px 0 0 0;
	border-left: 1px solid #dbdae5;
	border-right: 1px solid #dbdae5;
	border-top: 1px solid #dbdae5;
	font-size: 1.2em;
	color: #333;
}
#wrapper table#box td {
	line-height: 1.7;
	padding: 10px 10px 8px 12px;
}
#wrapper table#box td.ttl_a {
	width: 150px;
	font-weight: bold;
	border-right: solid 1px #dbdae5;
	border-bottom: solid 1px #dbdae5;
}
#wrapper table#box td.lead_a { border-bottom: solid 1px #dbdae5;}
#sitemap {
	margin: 15px 0 0 30px;
	font-size: 1.2em;
}
#sitemap li { padding: 10px 0 0 0;}
#sitemap li a {
	padding-left: 14px;
	background: url(../img/ic_arrow_001.gif) left center no-repeat;
}
#wrapper:after
{
content: ".";
display: block;
height: 0px;
clear: both;
visibility: hidden;
}


/* */
#wrapper #leadtxt {
	position:absolute;
	left:0;
	bottom:15px;
	width:760px;
	font-size:10px;
}
#wrapper #leadtxt h1 ,
#wrapper #leadtxt p {
	display:inline;
	font-size:11px;
	line-height:120%;
}

#wrapper #content_ttl {
	padding:0;
	margin:0;
}

#message {
	padding:0 0 0 0;
	margin:0 0 15px 50%;
	zoom:1;
	float:left;
}
#message_inr {
	padding:5px 10px;
	border:solid 1px #dbdae5;
	float:left;
	margin:0 0 0 0;
	position:relative;
	left:-50%;
	zoom:1;
}
#message p {
	padding:0 0 8px 0;
	margin:0;
	font-size:14px;
	font-weight:bold;
	color:#0b419b;
	white-space:nowrap;
}
#message ol {
	padding:0 0 0 0;
	list-style:none;
}
#message ol li {
	padding:0 0 5px 1em;
	list-style:none;
}