@charset "utf-8";

/* BODY
---------------------------------------------*/

html {
	width: 100%;
	height: 100%;
	background-color: #fff;}

* html .png {behavior: expression(IEPNGFIX.fix(this));}

body,div,
dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
	font-size: 100%;
	list-style: none;}

body {
	text-align: center;
	color: #333;
	font-family: Meiryo, "メイリオ", Verdana, "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
	font-size: 14px;}

input, select {padding: 1px;}

img {
	vertical-align: bottom;
	border: none;}

a   {
	color: #333;
	text-decoration: none;}

a:hover {
	color: #999;
	text-decoration: underline;}

em,address {font-style: normal;}

strong {font-weight: bold;}

p {line-height: 1.5em;}

.clear {clear: both;}

/* ALL
---------------------------------------------*/

#all,#header {
	width: 940px;
	margin: 0 auto;
	text-align: left;
	letter-spacing: 0.05em;}


.center {text-align: center;}
.right {text-align: right;}

.alpha a:hover img {
	filter: alpha(opacity=60);
	-moz-opacity:0.60;
	opacity:0.60;}

/* pankuzu
---------------------------------------------*/
#pankuzu {margin: 0 0 5px 0px;}

#pankuzu li {
	display: inline;
	font-size: 12px;
	color: #666;}

#pankuzu a {
	color: #666;
	margin-right: 4px;
	text-decoration: underline;}

#pankuzu a:hover {color: #000; }


/* 2nd LAYOUT
---------------------------------------------*/

#sec {background: url(../img/bg.jpg) left top repeat-x;}

#sec #header {height: 348px;}

#sec h2 {
	position: absolute;
	left: 0; top: 145px;
	z-index: 1;}

#path li {
	display: inline;
	font-size: 12px;}

#path li a {margin-right: 0.5em;}

/* HEADER
---------------------------------------------*/

#header {position: relative;}

#header p{
	position: absolute;
	top: 10px;
	font-size: 12px;
	color: #636262;}

#header h1 {
	position: absolute;
	top: 48px;}

#topnavi {
	position: absolute;
	right: 0; top: 5px;}

#topnavi li {
	float: left;
	margin-right: 4px;
	text-indent: -9999px;}

#topnavi li a {
	display: block;
	overflow: hidden;
	height:0 !important;
	height /**/: 17px;
	padding-top: 17px;
	background-image: url(../img/topnavi.gif);}
	
.hnv01 a {width: 92px; background-position: 0 0;}
.hnv02 a {width: 92px; background-position: -92px 0;}
.hnv03 a {width: 92px; background-position: -184px 0;}

.hnv01 a:hover {background-position: 0 -17px;}
.hnv02 a:hover {background-position: -92px -17px;}
.hnv03 a:hover {background-position: -184px -17px;}

#topnavicont {
	position: absolute;
	right: 0; top: 50px;}

#topnavicont li {
	margin-right: 4px;
	text-indent: -9999px;}

#topnavicont li a {
	display: block;
	overflow: hidden;
	height:0 !important;
	height /**/: 74px;
	padding-top: 74px;
	background-image: url(../img/top_otoiawase.gif);}
	
.topnv01 a {width: 268px; background-position: 0 0;}
.topnv01 a:hover {background-position: 0 -74px;}

#topnaviaccess {
	position: absolute;
	right: 0; top: 137px;}

#topnaviaccess li {
	margin-right: 4px;
	text-indent: -9999px;}

#topnaviaccess li a {
	display: block;
	overflow: hidden;
	height:0 !important;
	height /**/: 58px;
	padding-top: 58px;
	background-image: url(../img/accessmap.jpg);}
	
.topnv02 a {width: 274px; background-position: 0 0;}
.topnv02 a:hover {background-position: 0 -58px;}

#navi {
	position: absolute;
	left: 0; top: 219px;
	z-index: 1000;}

#navi li {
	float: left;
	position: relative;
	width: 133px;
	text-indent: -9999px;}

#navi li em a {
	display: block;
	overflow: hidden;
	height:0 !important;
	height /**/: 52px;
	padding-top: 52px;
	background-image: url(../img/navi.jpg);}
	
.gnv01 a {background-position: 0 0;}
.gnv02 a {background-position: -133px 0;}
.gnv03 a {background-position: -266px 0;}
.gnv04 a {background-position: -399px 0;}
.gnv05 a {background-position: -532px 0;}
.gnv06 a {background-position: -665px 0;}
.gnv07 a {background-position: -798px 0;}

.gnv01 a:hover {background-position: 0 -52px;}
.gnv02 a:hover {background-position: -133px -52px;}
.gnv03 a:hover {background-position: -266px -52px;}
.gnv04 a:hover {background-position: -399px -52px;}
.gnv05 a:hover {background-position: -532px -52px;}
.gnv06 a:hover {background-position: -665px -52px;}
.gnv07 a:hover {background-position: -798px -52px;}


/* CONTENTS
---------------------------------------------*/

#contents {clear: both;}

#sec #contents {
	margin-top: 15px;
	padding-bottom: 25px;}

.basettl {
	height: 31px;
	margin: 40px 0 20px 0;
	padding-left: 32px;
	background: url(../img/bg_basettl.gif) left top no-repeat;}

#banner {margin-top: 25px;}

#banner ul {
	position: relative;
	width: 987px;}

#banner ul li {
	display: block;
	width: 308px;
	float: left;
	margin-right: 21px;}

/* FOOTER
---------------------------------------------*/
#footer {
	clear: both;
	margin-top: 25px;
	background: url(../img/bg_footer.gif) left top repeat-x;}

   /* PAGE TOP
 */
#footpagebox {
	width: 940px;
	text-align: right;}

#footbox {
	width: 940px;
	margin: 0 auto;}

#ftcontact {
	position: relative;
	width: 687px;
	height: 114px;
	margin: 0 auto 15px auto;}

#ftcontact p {position: absolute;}


#ftcontact p.ft_imagelinks a {
      display: block;
      width: 687px;  /* 画像1枚分の横幅(※1) */
      height: 114px; /* 画像1枚分の高さ(※2) */
      text-indent: -5000px; /* 文字を消す */
   }

   /* ▼マウスが載ったときの装飾 */
#ftcontact p.ft_imagelinks a:hover {
      background-position: top right;
   }


#ftcontact p.ft_imagelinks a.ft_bt {
      background-image: url(../img/ft_otoiawase.gif);
   }

p .sitemap{
	text-align: left;}

   /* ▼フッターレフト */
.ftleft {
	float: left;
	width: 420px;
	padding-bottom: 10px;}

.ftleft p{
	padding-left: 5px;
	padding-bottom: 10px;
	text-align: left;}

.ftleft dl {
	float: left;
	text-align: left;
	letter-spacing: 0;}


.ftleft dl dt {
	font-weight: bold;
	font-size: 14px;
	color: #fff;
	line-height: 20px;}

.ftleft dl dd {
	font-size: 11.5px;
	padding-top: 0.5em;}
	
.ftlist01 {width: 210px;}
.ftlist02 {width: 210px;}

.ftleft dl dd ul li {
	display: block;
	margin-bottom: 3px;
	padding-left: 5px;
	letter-spacing: 0;}

.ftleft dl dd ul li a {
	padding-left: 16px;
	color: #fff;
	text-decoration: none;
	background: url(../img/arw_ft01.gif) 6px 0.4em no-repeat;}

.ftleft dl dd ul li a:hover {
	padding-left: 16px;
	color: #fff;
	text-decoration: underline;
	background: url(../img/arw_ft02.gif) 6px 0.4em no-repeat;}

	
/* forIE */
* html .ftleft dl dd ul li {line-height: 1em;}
*:first-child+html .ftleft dl dd ul li {line-height: 1em;}

   /* ▼フッターライト */
.ftright {
	position: relative;
	float: right;
	width: 520px;
	height: 178px;
	background: url(../img/store.jpg)  no-repeat;}

.ftright strong{
	float: left;
	margin-top: 15px;
	margin-right: 20px;}

.ftright dl {
	float: left;
	text-align: left;
	width: 240px;
	margin-right: 20px;}

.ftright dl dt {}

.ftright dl dt img {}

.ftright dl dd {
	color: #fff;
	font-size: 12px;
	padding: 10px 6px;}

.ftright dl dd img {vertical-align:top;}
.ftright dl dd address {margin-bottom: 0.5em;}

.ftright em a{
	color: #fff;
	font-size: 12px;}

.ftright .ftmap p {
	position: absolute;
	top: 120px;
	left: 230px; }

p.ft_maplinks a {
      display: block;
      width: 68px;  /* 画像1枚分の横幅(※1) */
      height: 68px; /* 画像1枚分の高さ(※2) */
      text-indent: -5000px; /* 文字を消す */
   }

   /* ▼マウスが載ったときの装飾 */
p.ft_maplinks a:hover {
      background-position: top right;
   }


p.ft_maplinks a.ft_mapbt {
      background-image: url(../img/ft_map.gif);
   }

.copy {
	clear: both;
	position: relative;
	color: #086B37;
	font-size: 10px;
	text-align: center;
	margin: 0 0;}


/* CLEARFIX
---------------------------------------------*/

.cl:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;}

.cl{ display: inline-block; }

/* Hides from IE-mac \*/
* html .cl { height: 1%; }
.cl { display: block; }
/* End hide from IE-mac */

/* AJAX
---------------------------------------------*/