@charset "utf-8";
/* reset */
html {
	overflow:scroll;
}
body {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align:center;
	line-height:1.3;
	background-image: url(images/body_bg.jpg);
	background-repeat: repeat-x;
	font-size: 75%;
	line-height: 180%;	
}
div { zoom: 1;/*for IE 5.5-7*/}
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;
	color: #999966;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
}
table {
	border-collapse:collapse;
	border-spacing:0;
	border:1;
	background-color:none;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
caption,th {
	text-align:left;
}
hr,legend {
	display:none;
}
h1,h2,h3,h4,h5,h6 {
	font-size:105%;
}
img,abbr,acronym,fieldset,a {
	border:0;
}
ul li {
	list-style-type:none;
	line-height:1.7;
}
img{display:inline-block;}
a {
	text-decoration:none;
	color:#3399cc;/*リンク文字の色*/
}
a:hover {
	text-decoration: underline;
	color: #A0CECF;/*リンク文字ロールオーバーの色*/
}
a img{
-webkit-transition:opacity 0.5s;
}
a:hover img,
a:hover img{
background:none;
opacity:0.7;
filter:alpha(opacity="70");
}

/* base */
body {
	background-image: url(images/body_bg.jpg);
	background-repeat: repeat-x;
	background-position: top;
	text-align: center;
}
#wrap {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
}
#head {
	overflow: hidden;
	height: 105px;
	margin-top:23px;
	background-position: center bottom;
}
#head h1 {
	float: left;
	width: 250px;
}
#navi_area {
	overflow: hidden;
	float: right;
}
#navi_area li {
	float: left;
}
#main_area {
	height: 480px;
	width: 800px;
	overflow: hidden;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFF;
 text-align: center;
}


#foot {
	background-image: url(images/line_b.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 20px;
	text-align: center;
}


#viewer {
	margin: 0 auto;
	width: 800px;
	height: 387px;
	text-align: left;
	overflow: hidden;
	position: relative;
}

#viewer img {
	top: 0;
	left: 0;
	position: absolute;
}

		div.imagebox {
		   border: 1px none; /* 枠線 */
		   background-color: none;  /* 背景色 */
		   width: 245px;               /* 横幅 */
		   float: left;                /* 左に配置 */
		   margin: 5px;                /* 周囲の余白 */
		}
		p.image, p.caption {
		   text-align: center; /* 中央寄せ */
		   margin: 5px;        /* 余白・間隔 */
		}
		p.caption {
		   font-size: 80%;     /* 文字サイズ */
		   color: #99966;    /* 文字色 */
		}

		p.exp {
			clear: left;       /* 回り込みを解除 */
		}

	div.imagebox_02 {
		   border: 1px dashed #cccc99; /* 枠線 */
		   background-color: none;  /* 背景色 */
		   width: 235px;               /* 横幅 */
		   float: left;                /* 左に配置 */
		   margin: 5px;                /* 周囲の余白 */
		}
		p.image, p.caption {
		   text-align: left; /* 中央寄せ */
		   margin: 5px;        /* 余白・間隔 */
		}
		p.caption {
		   font-size: 100%;     /* 文字サイズ */
		   color: #99966;    /* 文字色 */
		}

		p.exp {
			clear: left;       /* 回り込みを解除 */
		}

	div.imagebox_03 {
		   border: 1px dashed #cccc99; /* 枠線 */
		   background-color: none;  /* 背景色 */
		   width: 535px;               /* 横幅 */
		   float: left;                /* 左に配置 */
		   margin: 5px;                /* 周囲の余白 */
		}
		p.image, p.caption {
		   text-align: left; /* 中央寄せ */
		   margin: 5px;        /* 余白・間隔 */
		}
		p.caption {
		   font-size: 100%;     /* 文字サイズ */
		   color: #99966;    /* 文字色 */
		}

		p.exp {
			clear: left;       /* 回り込みを解除 */
		}

div.imagebox_04 {
		   border: none; /* 枠線 */
		   background-color: none;  /* 背景色 */
		   width: 190px;               /* 横幅 */
		   float: left;                /* 左に配置 */
		   margin: 4px;                /* 周囲の余白 */
		}
		p.image, p.caption {
		   text-align: left; /* 中央寄せ */
		   margin: 4px;        /* 余白・間隔 */
		}
		p.caption {
	font-size: 100%;     /* 文字サイズ */
	color: #99966;    /* 文字色 */
		}

		p.exp {
			clear: left;       /* 回り込みを解除 */
		}

/*works_各カテゴリ*/
	div.imagebox_05 {
		   border: none; /* 枠線 */
		   background-color: none;  /* 背景色 */
		   width: 235px;               /* 横幅 */
		   float: left;                /* 左に配置 */
		   margin: 5px;                /* 周囲の余白 */
		}
		p.image, p.caption {
		   text-align: left; /* 中央寄せ */
		   margin: 5px;        /* 余白・間隔 */
		}
		p.caption {
		   font-size: 100%;     /* 文字サイズ */
		   color: #99966;    /* 文字色 */
		}

		p.exp {
			clear: left;       /* 回り込みを解除 */
		}

	div.imagebox_06 {
		   border: none; /* 枠線 */
		   background-color: none;  /* 背景色 */
		   width: 535px;               /* 横幅 */
		   float: left;                /* 左に配置 */
		   margin: 5px;                /* 周囲の余白 */
		}
		p.image, p.caption {
		   text-align: left; /* 中央寄せ */
		   margin: 5px;        /* 余白・間隔 */
		}
		p.caption {
		   font-size: 100%;     /* 文字サイズ */
		   color: #99966;    /* 文字色 */
		}

		p.exp {
			clear: left;       /* 回り込みを解除 */
		}




/*about*/
#main_area_a {
	padding-top: 50px;
	padding-right: 50px;
	padding-bottom: 50px;
	padding-left: 50px;
	overflow: hidden;
	text-align: left;
}

#main_area_a #main_area_a_left {
	float: left;
}
#main_area_a_left img {
	border: 10px solid #F1EDE7;
}
#main_area_a_right {
	float: right;
	width: 265px;
	margin-top: 30px;
	overflow:auto;
	height:350px;
}


#main_area_a_right #right_in {
	padding: 10px;
	margin-top: 40px;
	border: 1px solid #92B9C8;/*ラインの色を変更*/
	font-size: 90%;
}
#main_area_a_right #right_in p {
	padding-top: 5px;
	padding-bottom: 5px;
}

/*recipe*/
#main_area_r {
	padding-top: 5px;
	padding-right: 40px;
	padding-bottom: 10px;
	padding-left: 56px;
	
	text-align: left;
}

#main_area_r_02 {
	padding-top: 50px;
	padding-right: 40px;
	padding-bottom: 50px;
	padding-left: 56px;
	overflow: auto;
	text-align: left;
}

#main_area_r .main_area_r_in {
	padding-bottom: 10px;
}

#main_area_r .thickbox img {
	border: 2px solid #F1EDE7;/*ラインの色を変更*/
	margin-right: 9px;
}

#main_area_r .thickbox img.right {
	border: 2px solid #F1EDE7;/*ラインの色を変更*/
	margin-right: 0px;
}
#main_area #main_area_a #main_area_a_right ul {
	margin-bottom: 20px;
}
#main_area_a #main_area_a_right ul li {
	padding-right: 10px;
}

#main_area_a #main_area_a_right ol {
	list-style-position: inside;
}
#main_area_a #main_area_a_right ol li {
	padding-bottom: 10px;
	padding-right: 10px;
}
#main_area_a #main_area_a_right strong {
	color: #666464;/*文字の色を変更*/
}
#main_area_r .page_area {
	text-align: center;
}
#page_go {
	color: #A0CECF;/*文字の色を変更*/
}






.m_t_20px{margin-top:20px;}
.m_b_20px{margin-bottom:20px;}
.m_b_10px{
	margin-bottom:10px;
	padding: 10px;
}
.tableplan {
	background-color: #FFC;
}




#plan-menu-about a {
display: block;
overflow: hidden;
height: 72px;
width: 250px;
background-image: url(plan-menu-img/plan-menu-about01.gif);
padding-top: 0px;
text-align: center;
}
 
#plan-menu-about a:hover {
background-image: url(plan-menu-img/plan-menu-about02.gif);
}

#plan-menu-design a {
display: block;
overflow: hidden;
height: 72px;
width: 250px;
background-image: url(plan-menu-img/plan-menu-design01.gif);
padding-top: 0px;
text-align: center;
}
 
#plan-menu-design a:hover {
background-image: url(plan-menu-img/plan-menu-design02.gif);
}

#plan-menu-web a {
display: block;
overflow: hidden;
height: 72px;
width: 250px;
background-image: url(plan-menu-img/plan-menu-web01.gif);
padding-top: 0px;
text-align: center;
}
 
#plan-menu-web a:hover {
background-image: url(plan-menu-img/plan-menu-web02.gif);
}

#plan-menu-food a {
display: block;
overflow: hidden;
height: 72px;
width: 250px;
background-image: url(plan-menu-img/plan-menu-food01.gif);
padding-top: 0px;
text-align: center;
}
 
#plan-menu-food a:hover {
background-image: url(plan-menu-img/plan-menu-food02.gif);
}

#plan-menu-order a {
display: block;
overflow: hidden;
height: 72px;
width: 250px;
background-image: url(plan-menu-img/plan-menu-order01.gif);
padding-top: 0px;
text-align: center;
}
 
#plan-menu-order a:hover {
background-image: url(plan-menu-img/plan-menu-order02.gif);
}

#plan-menu-price a {
display: block;
overflow: hidden;
height: 72px;
width: 250px;
background-image: url(plan-menu-img/plan-menu-price01.gif);
padding-top: 0px;
text-align: center;
}
 
#plan-menu-price a:hover {
background-image: url(plan-menu-img/plan-menu-price02.gif);
}



.footerbox {
	float: left;
	margin: 5px 10px 10px 30px;
	text-align: left;
}

.boxContainer {
	overflow: hidden;
	text-align:center;
margin: 0 auto; 
}