@charset "utf-8";
/**
 * 1. import
 * 2. html, body
 * 3. HTMLtag, siteCommonClass
 * 4. Layout
 * 5. EachPageStyle
 *
 */
/**
 * 1. import
 */
@import "import/reset.css";
@import "import/util.css";
@import "import/animate.css";
/* @import "../ext_{bukkenID}/{bukkenID}.css"; */

/**
 * 2. html, body
 */
body {
	background-image: url(../imgs/bg-body.gif);
	background-repeat: repeat;
	background-position: center top;
	color: #333333;
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: normal;
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
}
/**
 * 3. HTMLtag, siteCommonClass
 */
/* anchor */
a {
	background-color: transparent;
	background-image: none;
	background-repeat: no-repeat;
	background-position: top left;
	color: #368386;
	text-decoration: underline;
}
a:visited {
}
a:hover {
	color: #368386;
	background-position: bottom right;
	text-decoration: none;
}
a:active {
}
img {
	max-width: 100%;
	height: auto;
}
table {
	width: 100%;
}
a img:hover {
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}
.link:hover {
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}
.bold{
	font-weight:bold;
}
.t-green{
	color:#3c9e2a;
}
.shadow{
	-moz-box-shadow: 0px 0px 10px #666;
	-webkit-box-shadow: 0px 0px 10px #666;
	box-shadow: 0px 0px 10px #666;
}
.absolute{
	position:absolute;
}
.relative{
	position:relative;
}

/* cap */
	.cap,
	.caption {
		background: none;
		color: #666666;
		font-size: 10px;
		line-height: 15px;
	}
	.cap {
		padding-top: 5px;
	}

/* heading */
.siteTitle {
	padding-top: 10px;
}
.contentTitle {
/*dont use <h2> selector*/
}
/**
 * 4. Layout
 */
.wrap {
	position: relative;
	width: 960px;
	margin: 0 auto;
}
body #gHeader {
}
body #logo {
	text-align: center;
}
body #hdrTel {
	position: absolute;
	top: 80px;
	right: 0px;
}
body #gFooter {
	background-repeat: repeat-x;
	padding-top: 22px;
}
body #gFooter #ftrInner01 {
	font-size: 12px;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #4c4c4c;
}

#mainContent  {
	margin-bottom:80px;
}

/* breadCrumb */
body #breadCrumb {
	margin-bottom: 20px;
}
/* hNav */
#hNav {
	position: absolute;
	top: 0px;
	right: 0px;
}
#hNav li {
	float: left;
	margin-left: 5px;
}
/* gNav */
#gNav {
	background-image: url(../imgs/bg-nav.gif);
	background-repeat: repeat-x;
	background-position: center top;
	margin-bottom: 20px;
}
#gNav li {
	float: left;
}
#gNav li, #gNav li a {
	display: block;
	width: 192px;
	height: 54px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#gNav li, #gNav li span {
	display: block;
	width: 192px;
	height: 54px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
body #gNav li:nth-child(1) a {
	background: url(../imgs/nav-top.gif) no-repeat center bottom;
}
body #gNav li:nth-child(2) a {
	background: url(../imgs/nav-utillity.gif) no-repeat center bottom;
}
body #gNav li:nth-child(3) a,body #gNav li:nth-child(3) span {
	background: url(../imgs/nav-ecology.gif) no-repeat center bottom;
}
body #gNav li:nth-child(4) a ,body #gNav li:nth-child(4) span {
	background: url(../imgs/nav-recycle.gif) no-repeat center bottom;
}
body #gNav li:nth-child(5) a,body #gNav li:nth-child(5) span {
	background: url(../imgs/nav-marketing.gif) no-repeat center bottom;
}
body #gNav li a:hover, body #gNav li.on a {
	opacity: 1;
	background-position: center top;
}
body #gNav li a:active {
	opacity: 0.5;
}
body #gNav li.on a {
	cursor: default;
}
/* fNav */
#fNav {
	border-bottom: 1px solid #fff;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
#fNav li {
	background: url(../imgs/ftr-arrow01.gif) no-repeat left 10px;
	line-height: 240%;
}
#fNav li ul li {
	background: url(../imgs/ftr-arrow02.gif) no-repeat left 10px;
}
#fNav a,#fNav span {
	color: #fff;
	padding-left: 10px;
}
#fNav .sitemap {
	float: left;
	width: 25%;
	padding: 10px;
}
/* ftrBnr */
.ftrBnr {
	position: absolute;
	top: 0px;
	right: 0px;
}
/* address */
address {
	float: left;
	width: 50%;
	font-weight: normal;
	color: #FFF;
}
address a {
	color: #FFF;
}
address a:hover {
	color: #FFF;
}
/* copyright */
#copyright {
	text-align: right;
	padding-top: 30px;
	float: right;
	width: 50%;
	color: #FFF;
}

/* pagetop */
.pagetop {
	position:absolute;
	top:-58px;
	right:0px;
}
.pagetop a{
	display: block;
	width: 94px;
	height: 38px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background:url(../imgs/bt-pagetop.png) no-repeat;
}
.pagetop a:hover{
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

/* tab */
.tabSection {
	margin-top:40px;
	margin-bottom:40px;
}
.tabSection .tab {
	text-align:center;
	width: auto;
}
.tabSection .tab li {
	display:inline-block;
	line-height:120%;
	width: 18%;
	background-image: url(../imgs/bg-tab.gif);
	background-repeat: repeat-x;
	border-radius: 5px 5px 0px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
   	margin-bottom: -2px !important;
}
.tabSection .tab a {
	font-weight:bold;
	display: block;
	padding: 15px;
	color: #fff;
	text-decoration: none;
	text-align: center;
	background-image: url(../imgs/arrow-tab.png);
	background-repeat: no-repeat;
	background-position: 8px center;
	cursor:pointer;
	border-radius: 5px 5px 0px 0px;
	-webkit-border-radius: 5px 5px 0px 0px;
	-moz-border-radius: 5px 5px 0px 0px;
}
.tabSection .bottom li {
	background-image: url(../imgs/bg-tabb.gif);
	background-repeat: repeat-x;
	border-radius: 0px 0px 5px 5px;
	-webkit-border-radius: 0px 0px 5px 5px;
	-moz-border-radius: 0px 0px 5px 5px;
   	margin-top: -2px !important;
}
.tabSection .bottom a {
	border-radius: 0px 0px 5px 5px;
	-webkit-border-radius: 0px 0px 5px 5px;
	-moz-border-radius: 0px 0px 5px 5px;
}
.tabSection .tab li.current a {
	color:#117f83;
	background:url(../imgs/bg-tabbt_ov.gif) repeat-x;
}
.tabSection .bottom li.current a {
	background:url(../imgs/bg-tabbb_ov.gif) repeat-x;
}
.tabSection .tab li.current  {
	border: 2px solid #117f83;
    border-bottom: none;
}
.tabSection .bottom li.current  {
	border: 2px solid #117f83;
    border-top: none;
}
.tabSection .contents .content {
	border-top: 2px solid #117f83;
	padding:30px;
	border-bottom: 2px solid #117f83;
}


/* etc */
.w100 {width:100px;}
.w200 {width:200px;}
.w244 {width:244px;}
.w280 {width:280px;}
.w300 {width:300px;}
.w435 {width:435px;}
.w433 {width:433px;}
.w500 {width:500px;}
.w620 {width:620px;}

#mainContent .ttl {
	font-size:14px;
	color:#4ca4a1;
	margin-bottom:10px;
}
#mainContent .Inner {
	position: relative;
	width: 900px;
	margin: 50px auto 0;
}
 #se01,#se02,#se03,#se04,#se05{
	padding-top:300px;
    	margin-top:-300px;
}


/* eco */
#eco .w465 .btn {
	position:absolute;
	top:104px;
	left:170px;
}

/* marketing */
#marketing .step {
	background:url(../../marketing/imgs/bg-step.gif) repeat-y;
}

/* company */
table.normal th {
	font-weight:bold;
	padding:20px 10px 5px 10px ;
	font-size:13px;
	color:#256B69;
	border-bottom:1px solid #ccc;
}
table.normal td {
	padding:20px 10px 5px 10px ;
		border-bottom:1px solid #ccc;
}

/* rec */
#rec .sNav {
	text-align:center;
	margin-bottom:40px;
}
#rec .sNav li{
	display:inline-block;
	*display:block;
	*zoom:1;
	border-right:1px solid #368386;
	padding-right:10px;
	padding-left:5px;
}
#rec .sNav li.end{
	border-right:none;
}






/*時々使うCSS3 start ---*/

ボックスシャドウ {
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}
ボックスシャドウ内側 {
	-moz-box-shadow: inset 1px 1px 3px #000;
	-webkit-box-shadow: inset 1px 1px 3px #000;
	box-shadow: inset 1px 1px 3px #000;
}
角丸 {
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}
トランジション {
	-webkit-transition: 1.5s;
	-moz-transition: 1.5s;
	-o-transition: 1.5s;
	transition: 1.5s;
}
透明 {
	filter: alpha(opacity=25);
	-moz-opacity: 0.25;
	opacity: 0.25;
}
背景のみ透明 {
	background-color: rgba(255,255,255,0.2);
}
グラデーション {
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000')";
	background-image: -moz-linear-gradient(top, #ffffff, #000000);
	background-image: -ms-linear-gradient(top, #ffffff, #000000);
	background-image: -o-linear-gradient(top, #ffffff, #000000);
	background-image: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#000000));
	background-image: -webkit-linear-gradient(top, #ffffff, #000000);
	background-image: linear-gradient(top, #ffffff, #000000);
}


