@charset "utf-8";



* { margin:0 ;padding:0 }



body {

	font: 100% "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;

	background: url(../img_common/bg.gif) repeat 0 0;

	margin: 0; 

	padding: 0;

	text-align: center;

	color: #333;

}



a img { border:none }





/* 基本リンク設定 */

a:link {

  text-decoration:underline; color:#FF6501 ;}

a:active {

  text-decoration:underline; color:#FF6501 ;}

a:visited {

  text-decoration:underline; color:#FF6501 ;}	

a:hover {

  text-decoration:none; color:#FF6501 ;}







#container { 

	width: 860px;

	margin: 0 auto ;

	padding:0 4px ;/* グラデ分 */

	background: url(../img_common/wrapper_bg.gif) repeat-y center    ;

	text-align: left;

} 





/* ★ヘッダー --------------------------------------------------------------------------------- */

#header {

	padding: 0 22px 0 25px;

	height:70px ;

} 

#header #catch{

	margin:0px 0 5px 0;

	padding:7px 0 0 0 ;

	font-size:75%;

}



#header h1 {

	margin: 0;

	padding:0;

	font-size:70% ;

	font-weight:normal ;

	color:#333 ;

}

#header h1 a{

	display:block ;

	float:left ;

	width:194px ;	/*ロゴ画像横サイズ*/

	height:47px ;	/*ロゴ画像縦サイズ*/

	margin:0 ;

	padding:0 ;

	background:url(../img_common/logo.gif) left no-repeat    ;/*社名等ロゴ画像*/

	}

#header h1 a span { display:none ;}



/* header 右側ボックス */

#header .wrapp{width:400px ;float:right}





/* 右上 #shop-navi */

#header ul#shop-navi {

	width:308px ;

	height:43px ;

	margin:-26px 0 12px 0 ;

	padding:0 ;

	text-align:right ;

	float:right ;

	background:url(../img_common/shop_navi_bg.gif) left -43px no-repeat    ;

	}



#header ul#shop-navi li{

	width:100px;

	height:43px;

	display:block;

	float:left ;

	margin:0 0 0px 0 ;

	padding:0 ;

	margin:0 ;

	}

#header ul#shop-navi a {

	display:block ;

	margin:0px 0 0 0;

	height:100%;

	}



#header ul#shop-navi a.shop-n01:hover {

	background:url(../img_common/shop_navi_bg.gif) 0px 0px no-repeat    ;}



#header ul#shop-navi a.shop-n02:hover {

	background:url(../img_common/shop_navi_bg.gif) -100px 0px no-repeat    ;}



#header ul#shop-navi a.shop-n03:hover {

	background:url(../img_common/shop_navi_bg.gif) -200px 0px no-repeat    ;}



#header ul#shop-navi a span { display:none ;}





/* top-navi */

#header #top-navi{

	width:300px;

	height:auto;

	margin-right:3px ;

	float:right;

	font-size:70%;

	text-align:right ;

	}



#header #top-navi a{

	color:#333 ;

	text-decoration:none ;

}

#header #top-navi a:hover{

	color:#F60}







/* pan-list */

#pan-list{

	margin:0 0 0 0 ;

	padding:0 20px;

	font-size:70%;

	height:20px ;

	line-height:20px ;

	clear:both}



#pan-list a{

	text-decoration:none ;

	color:#333 ;

}

#pan-list a:hover {

	color:#FF6501 ;	

}





#sidenavi {

	float: right; 

	width: 180px;

	padding: 0px 0;

	border:1px solid #000 ;

}





/* #navi */

#navi{

	height:32px ;

	margin:7px 0 0px 0 ;

	padding:0 ;

	text-align:left;

	clear:both ;

	background:url(../img_common/navi_bg.gif) left -32px no-repeat    ;

}

#navi ul{

	height:100% ;

	list-style:none;

	padding-left:41px;

	}

#navi li{

	float:left;

	width:100%;

	height:32px;

	text-indent:-9999px}

#navi li a {

	display:block ;

	height:100% ;

	}

#navi li.navi01 { width:107px; margin-right:5px ;}

#navi li.navi01 a:hover { background:url(../img_common/navi_bg.gif) -41px 0px no-repeat    ;}

#navi li.navi01 a#on { background:url(../img_common/navi_bg.gif) -41px 0px no-repeat    ;}



#navi li.navi02 { width:122px; margin-right:4px ;}

#navi li.navi02 a:hover { background:url(../img_common/navi_bg.gif) -153px 0px no-repeat    ;}

#navi li.navi02 a#on { background:url(../img_common/navi_bg.gif) -153px 0px no-repeat    ;}



#navi li.navi03 { width:136px; margin-right:5px ;}

#navi li.navi03 a:hover { background:url(../img_common/navi_bg.gif) -279px 0px no-repeat    ;}

#navi li.navi03 a#on { background:url(../img_common/navi_bg.gif) -279px 0px no-repeat    ;}



#navi li.navi04 { width:85px; margin-right:3px ;}

#navi li.navi04 a:hover { background:url(../img_common/navi_bg.gif) -420px 0px no-repeat    ;}

#navi li.navi04 a#on { background:url(../img_common/navi_bg.gif) -420px 0px no-repeat    ;}



#navi li.navi05 { width:132px; margin-right:2px ;}

#navi li.navi05 a:hover { background:url(../img_common/navi_bg.gif) -508px 0px no-repeat    ;}

#navi li.navi05 a#on { background:url(../img_common/navi_bg.gif) -508px 0px no-repeat    ;}



#navi li.navi06 { width:160px; margin-right:0px ;}

#navi li.navi06 a:hover { background:url(../img_common/navi_bg.gif) -642px 0px no-repeat    ;}

#navi li.navi06 a#on { background:url(../img_common/navi_bg.gif) -642px 0px no-repeat    ;}





/* content */

#content {

	width:820px;

  	margin: 0 auto ;

}



#content h3, #content p {

}



#content h3 {

	width:758px ;

	height:38px ;

	line-height:38px;

	margin-bottom:10px ;

	margin-top:8px ;

	padding:7px 0 0 62px ;

	color:#643432;

	background:url(../img_common/h3_bg.gif) left no-repeat    ;/*社名等ロゴ画像*/



	font-size:17px ;

	font-family:"ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;

}





/* ページトップへ */

#content .pagetop {

	margin:10px 0 30px 0 ;

	text-align:right ;

	font-size:75% ;

	clear:both;

}





/* #footer-link */

#content #footer-link {

	margin:0px 0 25px 0 ;

	text-align:center ;

	font-size:75% ;

	color:#999;

	clear:both;

}

#content #footer-link a{

	margin:0 1px ;

	color:#555 ;

	text-decoration:none ;

	}



#content #footer-link a:hover{

	color:#F60 ;

}





/* #footer */

#footer {

	width:860px ;

	height:28px;

	margin:0 auto;

	padding:30px 0 0 0;

	clear:both;

	text-align:center;

	font-size:75% ;

	color:#FFF;

	background: url(../img_common/footer_bg.gif) #DDDDDD ;

}

.base #footer p {

	margin: 0;

}







/* 再使用できる各種クラス-------------------------- */



.float-r { float: right;

	margin-left: 22px;}



.float-l {

	float: left;

	margin-right: 22px;}



.clearfloat { 

	clear:both;

    height:0;

    font-size: 1px;

    line-height: 0px;

}





/* text */



.txt-c { text-align:center }

.txt-l { text-align:left }

.txt-r { text-align:right }





/* size */



.w60 { width:60px }



.w70p { width:70% }

.w85p { width:85% }

.w95p { width:95% }

.w100p { width:100% }



.txt-c { text-align:center }

.txt-r { text-align:right }

.txt-l { text-align:left }







/* テキストベースページ 共通設定 ------------------------- */



#content #base01 {

	font-size:75% ;

}



#content #base01 h3{

	margin:8px 0 20px 0 ;

}



/* 見出し */

#content h4 {

	width:auto ;

	height:20px;

	line-height:20px;

	margin:20px 0;

	padding-left:12px;

	color:#633;

	font-size:100%;

	background:url(../img_common/h4_base.gif) no-repeat left #f5f1ce;

}

#content h4.h4-01{ width:4em }

#content h4.h4-02{ width:5em }

#content h4.h4-03{ width:7em }

#content h4.h4-04{ width:10em }

#content h4.h4-05{ width:12em }

#content h4.h4-06{ width:15em }

#content h4.h4-07{ width:16em }

#content h4.h4-08{ width:17em }

#content h4.h4-09{ width:18em }

#content h4.h4-10{ width:19em }





/* キャッチコピー */

#content .base01-catch {

	width:786px;

	margin:25px auto 0px auto ;

	line-height:1.5em;

}



/* 枠付きボックス */

#content #base01-box {

	width:806px;

	margin:20px auto 0px auto ;

	line-height:1.5em;

	background:url(../img_common/base01_box2.gif) repeat-y ;/* 左右ボーダー */

}



#content #base01-box #base01-box-in {

	padding:30px 33px 30px 33px;

	background:url(../img_common/base01_box1.gif) top no-repeat ;/* 上ボーダー */

}





/* ハトムギとはページ  ------------------------- */

/* 枠付きボックス */

#content #base01-box .boxpattern01 {

	width:746px ;

	margin-bottom:30px ;

	/*for IE 5.5-7*/

	zoom:1;

	}



#content #base01-box .boxpattern01:after {

	/*for modern browser*/

	content:".";

	display: block ;

	height:0px ;

	clear:both ;

	visibility:hidden ;

	}



/* 枠付き写真ボックス */

#content #base01-box .boxpattern01 .h-photo {

	padding:5px ;

	float:left;

	border:1px solid #ccc ;

	margin-top:6px ;

	}



#content #base01-box .boxpattern01 p {

	width:460px ;

	line-height:2em ;

	float:right ;

}




