@charset "utf-8";

@import "reset.css";
@import "base.css";

/* ===================================================================

 file name  : common.css

 style info : common

=================================================================== */

/* tags
--------------------------------------------------------------------*/

body{
	background-color:#01021c;
}

a{color:#333333; text-decoration:underline;}
a:hover{color:#333333; text-decoration:none;}
a:active{color:#333333; text-decoration:none;}


/* header
--------------------------------------------------------------------*/

h1{
width:256px;
height:47px;
text-indent:-9999px;
float:left;
background:url(../images/logo.gif) 0 0 no-repeat;
margin-top:7px;
}

#header{
	border-top:2px solid #e10a18;
	background:url(../images/header_bg.gif) 0 0 repeat-x;
	height:65px;
}

#headerInner{
	width:900px;
	margin:0 auto;
	}

#headerNavi{
	width:600px;
	float:right;
	}

#headerNavi ul{
	margin-top:40px;
	float:left;
}
	
#headerNavi li{
	float:left;
	margin-right:10px;
}

address{
float:right;
width:244px; 
height:33px;
margin-top:20px;
}

#flash{
	 background-color:#000;
	 text-align:center;
	 background:url(../../images/flash_line.gif) 50% 100% no-repeat;
	 padding-bottom:1px;
	 margin-bottom:15px;
	}

/*--- menu ---*/

#menu{
position:absolute;
top:48px;
}
#menu li{
float:left;
background:url(../img/menu_separate.gif) top right no-repeat;
padding-right:2px;
}


/* container
--------------------------------------------------------------------*/

#container{
width:900px;
margin:0 auto;
clear:both;
}


/* main
--------------------------------------------------------------------*/

#main{
width:670px;
float:right;
background-color:#ffffff;
}


#main h2{
margin-bottom:20px;
}

/*
#main h2{
margin-bottom:20px;
background:url(../images/bar_bg.gif) 0 0 no-repeat;
height:45px;
font-size:16px;
font-weight:bold;
padding-left:34px;
line-height:45px;
color:#FFF;
}
*/

#main h2.pageTitle{
width:630px;
margin:0 20px 20px 20px;
background:url(../images/bar_bg.gif) 0 0 no-repeat;
height:45px;
font-size:16px;
font-weight:bold;
padding-left:34px;
line-height:45px;
color:#FFF;
}

#main h3{
	background:url(../images/h3_bg.gif) 0 0 no-repeat;
height:36px;
padding-top:6px;
color:#FFFFFF;
font-weight:bold;
font-size:14px;
padding-left:35px;
margin-bottom:10px;
}

#main h4{
background:url(../images/h4.gif) 0 0 no-repeat;
height:32px;
font-weight:bold;
padding-left:20px;
line-height:32px;
font-size:14px;
margin-bottom:10px;
}


#pageTop{
text-align:right;
clear:both;
margin-bottom:15px;
margin-right:15px;
}

.pan{
clear:both;
width:900px;
margin-left:auto;
margin-right:auto;
zoom:100%;
}

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

.pan li{
float:left;
height:30px;
line-height:30px;
color:#FFF;
}

.pan a{
color:#FFF;
}

.contact{
	clear:both;
	}

.contact .tel{
	background:url(../images/contact_tel.gif) 0 0 no-repeat;
	width:305px;
	height:129px;
	text-indent:-9999px;
	float:left;
	}
	
.contact .mail{
	background:url(../images/contact_mail_bg.gif) 0 0 no-repeat;
	width:305px;
	height:129px;
	float:right;
	text-align:center;
	}

.contact .mail img{
	width:235px;
	height:45px;
	margin-top:50px;
}

/* index
--------------------------------------------------------------------*/


#index #mainImage{
	background:url(../images/top_main_bg.gif) 0 0 no-repeat;
	height:310px;
	margin-bottom:30px;
	position:relative;
	}
	
#index #concept{
   top: -10px;
   right: -30px;
   position:absolute;
}

#index #news{
	border:1px solid #949494;
	background-color:#f0f0f0;
	width:630px;
	margin:0 auto 20px auto;
	}
	
	
#index #newsInner{
	background-color:#fff;
	margin:0 4px 4px 4px;
	padding:10px;
	}

#index #newsInner dl{
	clear:both;
width:595px;
margin:0 auto;
padding:5px 0;
border-bottom:1px solid #e5e5e5;
}

#index #newsInner dt{
background:url(../images/arrow.gif) 0 50% no-repeat;
width:100px;
padding-left:15px;
float:left;
font-weight:bold;
}

#index #newsInner dd{
float:right;
width:460px;
}



/* side
--------------------------------------------------------------------*/

#side{
width:215px;
float:left;
}

#sideMenu{
	background-color:#5a5a5a;
	margin-bottom:20px;
}

#sideMenu a{color:#303030; text-decoration:none;}
#sideMenu a:hover{color:#ffffff; text-decoration:none;}
#sideMenu a:active{color:#ffffff; text-decoration:none;}

#sideMenu ul{
	margin:0 auto;
	padding-bottom:1px;
	width:213px;
}


#sideMenu li{
display:block;
width:213px;
height:44px;
line-height:44px;
background:url(../images/side_menu_bg.gif) 0 0 no-repeat;
font-weight:bold;
}


#sideMenu li a{
display:block;
height:44px;
line-height:44px;
padding-left:25px;
}


#sideMenu li a.on{
display:block;
height:44px;
font-weight:bold;
color:#fff;
background-image:url(../images/side_menu_bg_on.gif);
}

#sideMenu li a:hover{
display:block;
height:44px;
padding-left:25px;
line-height:44px;
font-weight:bold;
color:#fff;
text-decoration:none;
background-image:url(../images/side_menu_bg_on.gif);
}


.blog_side  { background:url(../../images/sidemenu_bg.gif) repeat-y 0 0;
width:215px;}

.side_bottom { background:url(../../images/blog_bottom.gif) no-repeat; height:5px; width:214px;
margin-bottom:12px;}

.blog_side li { border-bottom:dotted #333 1px;
width:160px;
margin:0 auto;
padding:5px;
padding-left:28px;
background:url(../../images/arrow.gif) 10px 12px no-repeat;}

.blog_side li:last-child{
border-bottom:none;
}

.blog_side .last { border-bottom:none;}



/* footer
--------------------------------------------------------------------*/

#footer{
background:url(../images/footer_bg.gif) 0 0 repeat-x;
height:25px;
clear:both;
text-align:center;
margin-bottom:10px;
margin-top:15px;
}

#footer a{
	background:url(../images/footer_arrow.gif) 0 50% no-repeat;
	padding-left:13px;
	margin-left:10px;
	font-size:11px;
	text-decoration:none;
}

#footer p{
margin-left:30px;
line-height:25px;
}

#copyArea{
	width:900px;
	margin:0 auto;
	height:100px;
	}

#copy{
	width:280px;
	float:left;
	}

#footerTel{
	width:464px;
	float:right;
	}


/* conmany
--------------------------------------------------------------------*/

#company{
	margin:20px;
	}

	
/* news
--------------------------------------------------------------------*/

#news{
	margin:20px;
	}
	
#news .tag { text-align:left;
border-bottom:dotted 1px;
margin:0px auto 10px auto;
padding-bottom:5px;
}
	
/* consept
--------------------------------------------------------------------*/

#consept { background:url(../../images/obsession_bg.jpg) 0 0 repeat-y;
width:670px;}

#consept h2 { margin-top:15px;
margin-left:20px;
} 


#ceo { float:right;
display:inline;
padding-right:20px;
margin-bottom:25px;}

#contact { width:630px;
margin-left:20px;
margin-bottom:10px;
margin-top:40px;}


/* flow
--------------------------------------------------------------------*/

#flow { width:628px;
margin:0 auto;}

#flow h2 {margin-top:15px;}

#flow01 {width:628px;height:205px;}
#flow02 {width:629px;height:181px;}
#flow03 {width:628;height:273px;}
#flow04 {width:628;height:235px;}
#flow05 {width:628;height:233px;}
	
	
/* products
--------------------------------------------------------------------*/

#products { width:630px;
margin:0 auto;
}

#products h2 { margin-top:15px;
}


#products td { vertical-align:top;
}

#products table {
	width:630px;
	margin-top:10px;
}


#products dl { margin:10px;}


#products dl dt { color:#e10a18;
font-weight:bold;
font-size:1.2em;}

/* order
--------------------------------------------------------------------*/
#order { width:630px;
margin:0 auto;
}

#order h2 { margin-top:15px;}

#order p { float:left;
display:inline;
margin-left:10px;
margin-top:5px;
margin-bottom:10px;}

.step { width:630px;
background:url(../../images/square_middle.gif) 0 0 repeat-y;
margin-top:10px;
}

.stepHeader{
background:url(../../images/square_top.gif) 0 0 no-repeat;
height:10px;

}

.stepFooter{
background:url(../../images/square_bottom.gif) 0 0 no-repeat;
height:10px;

}



.step_text { width:443px;
font-size:1.1em;}

.arrow { width:117px;
height:47px;
margin:8px auto;
margin-top:10px;
}

/* blog
--------------------------------------------------------------------*/


.blog { width:630px;
margin:0px auto 20px auto;
}

.blog h3 a{
color:#fff;
text-decoration:none;
line-height:26px;
}

.tag { text-align:right;
border-bottom:dotted 1px;
width:630px;
margin:0px auto 20px auto;
padding-bottom:5px;
font-size:115%;
}

.tag a { color:#0075a9;}

.tag em { font-weight:bold;}

.blogcontents {
margin:10px 0 10px 0;
padding-bottom:20px;
font-size:120%;
border-bottom:dotted 1px;
}

.trackbacks,
.comments{
margin:10px 0 10px 0;
padding-bottom:20px;
border-bottom:dotted 1px;
}

#comments-open{
margin:10px 0 10px 0;
padding-bottom:20px;	
}

#trackbacks h4,
#comments h4,
#comments-open h4{
background-color:#01021C;
color:white;
font-size:100%;
height:1.5em;
line-height:1.5em;
}

.blogComment{
text-align:right;	
}

.readmore { text-align:right;
margin-bottom:20px;}

.readmore a{ color:#0075a9;}


.blogNext{
	text-align:center;
	margin:10px auto;
}


/* recipe
--------------------------------------------------------------------*/

#recipe{
	margin:20px;
	}

.recipeBox{
	border:1px solid #c1c1c1;
	padding:2px;
	clear:both;
	margin-bottom:15px;
	}

.recipeBox02{
	border:1px solid #dbdbdb;
	padding:10px;
	}
.Box { margin-top:5px;}

.recipeBox .pic{
	float:left;
	width:264px;
	margin-top:10px;
	}
	
.recipeBox table{
	float:right;
	width:325px;
	}
	
.recipeBox table tr { }


.recipeBox table td { padding:6px;border-bottom:1px solid #dbdbdb;}
.Number{
	font-weight:bold;
	color:#ff0000;
	padding:6px;
	vertical-align:top;
	}
	

	
.recipeBox .pic02{
	float:right;
	width:264px;
	margin-left:10px;
	margin-top:10px;
	}
	
.recipeBox .txt02{
	float:left;
	width:325px;
	margin-top:10px;
	}
	


/* contact
--------------------------------------------------------------------*/

#contact_page {width:630px;
margin:0 auto;
}

#contact_page h2 { margin-top:15px;
font-size:1.1em;}


#privacy_text li { background:url(../../images/red_square.gif) no-repeat 0 5px;
padding-left:17px;
font-size:1.1em;
line-height:1.4em;}

#privacy_sub { margin:20px;
margin-bottom:30px;}

#contact_page table{
	border-top:1px solid #bfbfbf;
	border-right:1px solid #bfbfbf;
	width:630px;
	margin-top:10px;
	}

#contact_page table th{
	border-bottom:1px solid #bfbfbf;
	border-left:5px solid #e10a18;
	background-color:#eeeeee;
	width:183px;
	font-weight:bold;
	color:#00011b;
	padding:10px;
	padding-left:20px;
	}
	
#contact_page table td{
	border-bottom:1px solid #bfbfbf;
	padding:10px;
	}
#contact_page table td input { width:266px;
padding:2px;}


#contact_page table .address { width:415px;}

#contact_page table select{ padding:1px;}

#form_btn { width:230px;
margin:20px auto;}

#form_btn #submit { margin-left:38px;}