@charset "utf-8";


/******************************************************************
 *
 * ベース
 *
 *****************************************************************/

html {
	font-size: 100%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%; 
	-ms-text-size-adjust: 100%; 
}

body,
button,
input,
select,
textarea {
	font-family:Verdana,"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

/* Micro clearfix */

.cf { zoom: 1; }
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }

/* 必要要素の初期設定 */

html {
	 font-size: 62.5%;
}

/* IE7のpadding設定 */
*:first-child+html body {
	padding-left: 1px;
}
 
/* IE6のpadding設定 */
*html body {
	padding-left: 1px;
}

body {
	font-size:14px;
	font-size: 1.4rem;
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	color:#333;
	background:url(../img/bg_body.png) repeat-x;
}

h1, h2, h3, h4, h5, h6 {
	margin:0;
	line-height: normal;
	letter-spacing:-1px;
	font-weight:normal;
}
p {
	margin:0;
}

ul,
ol {
  margin-left: 0;
  padding: 0;
}

dd {
  margin: 0;
}

ul,
ol {
  list-style: none;
  list-style-image: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
border:0;
}

/* ベースレイアウト */

#headerNavi {
    position: fixed;
	top:-28px;
	height:28px;
    width: 100%;
    background:#24140e;
    z-index: 100;
	text-align:center;
	margin:0 auto;
}

#headerNavi div.inner {
	margin:0 auto;
	text-align: left;
}

ul#globalNavi {
	margin:6px 0 0 3px;
}

ul#globalNavi li {
	list-style:none;
	font-size:11px;
	font-size:1.1rem;
	float:left;
	width:auto;
	margin-right:0;
	line-height:normal;
	border-right:#666c67 solid 1px;
}
ul#globalNavi li a {
	display:block;
	padding:0 6px 0 ;
	color:#fff;
}
ul#globalNavi li a:hover, ul#globalNavi li a:active, ul#globalNavi li a:focus {
	color:#ffe9a9;
	text-decoration:none;
}

#wrapper {
	background:url(../img/bg_body.png) repeat-x;
	position: relative;
	top:28px;
	margin:0 auto;
	padding:0;
	width: 100%;
	height: auto !important;	/* IE6対策 */
	height: 100%;	/* IE6対策 */
	min-heigth: 100%;
}

div#common-header {
	position:relative;
	border-bottom:#FFF 1px solid;
	height:230px;
	text-align: left;
}
#LOGO {
	position:absolute;
	top:65px;
	left:10px;
	height:48px;
	width:95%;
}
#LOGO img {
	width:100%;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}


#menuTop {
	display: none;
}
#menuBottom {
	display:block;
	padding-top:25px;
}

.MENU{
	width: 100%;
	margin: 0 auto;
}
.MENU li{
	display: block;
	float: left;
	width: 100%;
}
.MENU li a{
	display: block;
	font-weight:bold;
	padding: 12px 0 12px;
	font-size:15px;
	font-size: 1.5rem;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	border-left:#47ff00 1px solid;
	border-right:#3dd800 1px solid;
	background-color: #3dd800;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#47ff00), to(#3dd800));
	background-image: -webkit-linear-gradient(#47ff00, #3dd800);
	background-image: linear-gradient(#47ff00, #3dd800);
	color: #FFF;
	text-align: center;
	text-decoration: none;
}
.MENU li.displayMenu {
	display:none;
}
.MENU li a:hover{
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}


#ORDER {
	position:absolute;
	top:130px;
	right:0px;
	width:100%;
}

#orderBTN{
	width: 300px;
	margin: 0 auto;
}
#orderBTN li{
	display: block;
	float: left;
	width: 300px;
	margin-bottom:5px;
}
#orderBTN li.order {
	background-color: #FFF;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#ffefd5));
	background-image: -webkit-linear-gradient(#FFF, #ffefd5);
	background-image: linear-gradient(#FFF, #ffefd5);
}
#orderBTN li.contact {
	background-color: #FFF;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#ffefd5));
	background-image: -webkit-linear-gradient(#FFF, #ffefd5);
	background-image: linear-gradient(#FFF, #ffefd5);
}
.MENU li a.menuL{
    border-radius: 0pxx;        /* CSS3草案 */  
    -webkit-border-radius: 0pxx;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 0pxx;   /* Firefox用 */ 
}
.MENU li a.menuR{
    border-radius: 0px;        /* CSS3草案 */  
    -webkit-border-radius: 0px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 0px;   /* Firefox用 */ 
}
#orderBTN li a{
	display: block;
	border:#FFF solid 1px;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}
#orderBTN li.contact a{
	background:url(../img/bg_order.png) no-repeat;
	background-position:6px center;
	border:#adff8d 1px solid;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
}
#orderBTN li.order a{
	background:url(../img/bg_order.png) no-repeat;
	background-position:6px center;
	border:#adff8d 1px solid;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
}
#orderBTN li a span {
	display:block;
	text-decoration: none;
	font-weight:bold;
	font-size:17px;
	font-size: 1.7rem;
	color: #3dda00;
	padding:7px 0 7px 55px;
}
#orderBTN li.displayMenu {
	display:none;
}
#orderBTN li a:hover{
	text-decoration: none;
	background-color: #fff462;
}


#common-contents {
	margin: 0 10px 1em;
	padding:20px 0;
}

div.MAIN {
	margin: 0 auto;
}

div.MAIN p{
	margin: 0 10px 25px 10px;
	color: #333;
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1.8;
	text-align: left;
}

#footerMenu {
	padding-bottom:38px;
}
#footerMenu div.inner {
	background: #32cd32;
	line-height:1.4;
	padding:12px 0;
	width:100%;
	margin:0 auto;
	text-align:center;
	font-size: 12px;
	font-size: 1.2rem;
	color:#9acd32;
}
#footerMenu a {
	color:#FFF;
	text-decoration:none;
}
#footerMenu a:hover, div#footerMenu a:active, div#footerMenu a:focus {
	color:#fff799;
	text-decoration:none;
}

div#footer {
    height:38px;
     position:absolute;
     bottom:0;
	width: 100%;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
	color:#45c745;
	background-color:#FFF;
}
div#footer-form {
	border-top:#333 dotted 1px;
    height:38px;
	width: 100%;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
	color:#45c745;
	background-color:#FFF;
}
.fCopyright {
	width:100%;
	color:#222;
	margin:0 auto;
	padding:10px 0 0;
	text-align:center;
	font-size:11px;
}


/* 画像のスタイル指定 */
	
#common-banner {
	 margin: 0 0 1em;
}
img.adjust {
	 width: 100%;
	 max-width:100%;
	 height: 53px;
	 border: none;
}

/* 各要素のデザイン、レイアウト */

h1 {
	position:absolute;
	top:28px;
	left:12px;
	background: url(../img/bg_h1.png) no-repeat;
	padding:2px 0 0 22px;
	margin:0;
	font-size: 13px !important;
	font-size: 1.3rem;
	line-height:1.2;
	text-align:left;
	color:#434343;
}

h2 {
	display:block;
	background: url(../img/bg_h2.png) repeat-x;
	color:#333;
	font-size: 18px;
	font-size: 1.8rem;
	letter-spacing: 0.1em;
	line-height:1.0;
	margin-bottom:10px;
	padding:8px 0 6px 35px;
	background: url(../img/bg_h2.png) no-repeat;
	background-position:left;
	border-bottom:#333 dotted 1px;
	font-weight:bold;
	text-align: left;
}

h3 {
	font-size: 16px;
	font-size: 1.6rem;
	font-weight:bold;
	border-left:#9fc24d solid 6px;
	border-bottom:#bbb dotted 1px;
	padding:2px 0 2px 5px;
	margin-bottom:15px;
}

h4 {
	font-size: 16px;
	font-size: 1.6rem;
	border-bottom:#2C7ECF solid 1px;
	color:#2C7ECF;
	padding:2px 0 2px 0px;
	margin-left:10px;
	margin-right:10px;
	margin-bottom:10px;
}


/* Media Queries による切り替え */

@media only screen and (min-width: 400px) {
	
	#LOGO {
	top:55px;
	}
	.MENU li{
	width: 50%;
	}
	.MENU li.displayMenu {
	display: block;
	background: url(../img/menu-off.png) bottom repeat-x;
	height:41px;
	}
	.MENU li.displayMenu span{
	display: block;
	background: url(../img/menu-off.png) bottom repeat-x;
	border-right:#026a38 1px solid;
	border-left:#53ad65 1px solid;
	}


}


@media only screen and (min-width: 580px) {
	
	#LOGO {
	width:477px;
	}


}

@media only screen and (min-width: 670px) {
	
	.wH2 h2 {
	font-size: 20px;
	font-size: 2.0rem;
	}
	#headerNavi {
	display:none;
	}
	#menuTop {
	display:block;
	}
	#menuBottom {
	display: none;
	border-bottom:none;
	}
	#wrapper {
	top:0px;
	}

}


@media only screen and (min-width: 800px) {

	div#common-header {
	position:relative;
	border-bottom:#FFF 1px solid;
	height:115px;
	text-align: left;
	}

	#ORDER {
	position:absolute;
	top:22px;
	right:10px;
	width:220px;
	}

	#orderBTN{
	width: 100%;
	margin: 0 auto;
	}
	#orderBTN li{
	display: block;
	float: left;
	width: 220px;
	margin-bottom:5px;
	}

}

@media only screen and (min-width: 880px) {

	.MENU li{
	width: 16.6%;
	}

}

@media only screen and (min-width: 1000px) {

	.MENU li{
	width: 16.6%;
	}
	.MENU li.displayMenu {
	display:none;
	}
.MENU li a.menuL{
    border-radius: 5px 0px 0px 5px / 5px 0px 0px 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px 0px 0px 5px / 5px 0px 0px 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px 0px 0px 5px / 5px 0px 0px 5px;   /* Firefox用 */ 
}
.MENU li a.menuR{
    border-radius: 0px 5px 5px 0px / 0px 5px 5px 0px;        /* CSS3草案 */  
    -webkit-border-radius: 0px 5px 5px 0px / 0px 5px 5px 0px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 0px 5px 5px 0px / 0px 5px 5px 0px;   /* Firefox用 */ 
}
	#wrapper {
	width: 1000px;
	}
	#common-contents {
	width:1000px;
	margin: 0 auto;
	}
	div.main {
	float: left;
	width: 740px;
	padding: 0 0 0 10px;
	border-bottom: none;
	}
	div#footer {
	width: 1000px;
	}
#footerMenu div.inner {
	background: #32cd32;
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
}
	
}