@charset "shift_jis";

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0 none;
	border-collapse: collapse;
	color: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	list-style-type: none;
	margin: 0;
	outline: medium none;
	padding: 0;
	table-layout: auto;
	text-decoration: none;
	vertical-align: top;
}

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

ul,li,dl,dt,dd {
	margin: 0;
	padding: 0;
}

li {
	list-style: none;
}
.hidden {
	display: block;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  width:0px;
  height:0px;
  font-size:0;
  line-height:0;
}
.clearfix:after{
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}

.clearfix:after { clear:both }
.clearfix { zoom:1 } /* For IE 6/7 */

div.pcHead,
div.pcFoot,
div.pcGnav {
	display: block;
}

div.spHead,
div.spFoot,
div.spGnav {
	display: none;
}

/* Defalut */
#salad .pc{display:block;}
#salad .sp{display:none;}

#salad {
	min-width: 950px;
	font-size:14px;
	line-height: 1.6;
	background: #fff;
}

#salad a:hover {opacity: 0.8;}
/*#salad a:active {color:#666;}*/

#salad img {vertical-align: bottom;}


/* main
------------------------------------------ */
.main {width: 100%;}

.main .main-ttl {
	height:122px;
	background:url(../img/bg_ttl_head.png) 0 0 repeat-x;
}

.main h1 img {
	margin: 0 auto;
}

.main .sub-bg {
	width: 100%;
	min-width: 950px;
	background: #e9f7fc url(../img/bg_main.jpg) center top no-repeat;
}

.main h1.sub-ttl {
	width: 1320px;
	min-width: 950px;
	padding: 0;	
	margin: 0 auto;
}

.main h1.sub-ttl img{
	margin: 0 auto;
}

.main .bg-lead {
	background: #dbf5ff;
}

.main .lead {
	min-width: 950px;
	width: 100%;
	margin: 0 auto;
	padding: 15px 0;
	color: #00b0ec;
	font-size: 16px;
	line-height: 1.5; 
	text-align: center;
}

/*
common ------------------------------------------ */
.wrap {
	width:100%;
	margin: 0 auto;
}

.inner {
	min-width: 950px;
	width: 950px;
	margin: 0 auto;
}

h2 {
	padding-top: 32px;
	margin-bottom: 20px;
	font-weight: bold;
	text-align: center;		
}

h2 .pink {
	display: inline-block;
	padding: 5px 40px 0;
	color: #e9518e;
	font-size: 28px;
	background: url(../img/bg_sec01_tit_left.gif) left center no-repeat,
	url(../img/bg_sec01_tit_right.gif) right center no-repeat;
}

h2 .brown {
	padding: 0 10px;
	color: #41210f;
	font-size: 42px;
	text-shadow: 3px 3px #fef500;
	background: linear-gradient(transparent 60%, #fef500 40%);
} 

.subTxt {
	margin-bottom: 32px;
	font-size: 16px;
	line-height: 1.38;
	text-align: center;
}


/* sec01
------------------------------------------ */
.sec01 {
	background: url(../img/bg_sec01.jpg) center 0 no-repeat;
	padding-bottom: 70px;
}



.sec01 h3 {
	color: #8cc40f;
	font-weight: bold;
}

.sec01 .foodBlock {
	overflow: hidden;
	width: 838px;
	margin: 0 auto 30px;
}

.sec01 .foodBlock h3 {
	font-size: 26px;
	margin-bottom: 10px;
}

.sec01 .foodBlock .ph{
	float: left;
	position: relative;
	padding-bottom: 15px;
	z-index: 1;	
}
.sec01 .foodBlock .ph:before, .sec01 .foodBlock .ph:after{
	position: absolute;
	bottom: 25px;
	z-index: -1;
	content: '';
	width: 50%;
	height: 50%;
	box-shadow: 0 10px 10px rgba(0,0,0,.4);
}
.sec01 .foodBlock .ph:before {
	left: 10px;
	-webkit-transform: rotate(-4deg);
	transform: rotate(-4deg);
}

.sec01 .foodBlock .ph:after{
	right: 10px;
	-webkit-transform: rotate(4deg);
	transform: rotate(4deg);
}

.sec01 .foodBlock .txtArea{
	float: left;
	width: 396px;
	margin-top: 48px;
	margin-left: 38px;
}

.sec01 .foodBlock .txtArea .btn {
	margin-top: 10px;
}

.sec01 .foodList {
	overflow: hidden;
}

.sec01 .foodList li {
	float: left;
	width: 300px;
	margin-right: 25px;
}

.sec01 .foodList li:last-child {
	margin-right: 0;
}

.sec01 .foodList li h3 {
	margin: 10px auto 8px;
	font-size: 20px;
	line-height: 1.4;
	text-align: center;
}

.sec01 .foodList li:nth-child(2) h3 a,
.sec01 .foodList li:nth-child(3) h3 a {
	margin-top: 15px;
	display: inline-block;
}


.sec01 .foodList li .btn {
	margin-top: 12px;
}

/* sec02
------------------------------------------ */
.sec02 {
	background: url(../img/bg_sec02.png) center top repeat-y;
	padding-bottom: 30px;
}

.sec02 .productList {
	overflow: hidden;
}

.sec02 .productList li {
	width: 300px;
	float: left;
	margin-bottom: 45px;
	margin-right: 25px;
	text-align: center;
}

.sec02 .productList li h3 {
	margin-bottom: 5px;
	font-weight: bold;
}

/*.sec02 .productList li:nth-child(2) h3,
.sec02 .productList li:nth-child(3) h3{
	margin-top: 10px;
	display: inline-block;
}*/

.sec02 .productList li:nth-child(3),
.sec02 .productList li:nth-child(6) {
	margin-right: 0;
}

.sec02 .productList li p {
	margin-top: 5px;
}

.sec02 .bnrList {
	overflow: hidden;
	margin-top: 20px;
}

.sec02 .bnrList li {
	/*width: 465px;
	float: left;*/
	margin-bottom: 40px;
	margin-right: 20px;
	text-align: center;
}

.sec02 .bnrList li:last-child {
	margin-right: 0;
}

.sec02 .bnrList li p {
	margin-top: 5px;
}



.sec03 {
	background: url(../img/bg_sec03.jpg) center bottom no-repeat;
}

.sec03 .foodList {
	overflow: hidden;
	width: 950px;
	margin: 0 auto;
	padding-bottom: 40px;	
}

.sec03 .foodList02 {
	overflow: hidden;
	width: 737px;
	margin: 0 auto;	
	padding-bottom: 80px;	
} 

.sec03 .foodList li, .sec03 .foodList02 li  {
	float: left;
	width: 300px;
	margin-right: 25px;

}

.sec03 .foodList li:last-child, .sec03 .foodList02 li:last-child  {
	margin-right: 0;
}

.sec03 .foodList li h3, .sec03 .foodList02 li h3 {
	margin: 10px auto 8px;
	color: #00b0ec;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
}

.sec03 .foodList li .btn, .sec03 .foodList02 li .btn {
	margin-top: 12px;
}

.sec03 .foodList02 li .ph {
	position: relative;
	z-index: 1;
}

.sec03 .foodList02 li:first-child {
	position: relative;
	padding-top: 20px;
	padding-left: 56px;
}

.sec03 .foodList02 li .icn01 {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}

.sec03 .foodList02 li:last-child {
	position: relative;
	padding-top: 20px;
	padding-right: 56px;
}

.sec03 .foodList02 li .icn02 {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
}




/* SP ================================================================*/
@media screen and (max-width: 767px){

	/* Defalut */
	#salad .pc{
		display:none;
	}
	#salad .sp{
		display:block;
	}
	#salad {
		max-width: 767px;
	}
	#salad .img-rp {
		width: 100% !important;
		height: auto !important;
	}

	div.spHead,
	div.spFoot,
	div.spGnav {
		display: block;
	}

	div.pcHead,
	div.pcFoot,
	div.pcGnav {
		display: none;
	}


	#salad{
		font-size:12px;
		line-height: 1.5; 
		width:auto;
		min-width: 0;
		margin:0 auto;
		max-width: 767px;
		overflow: hidden;
	}

	.main .main-ttl {
		height: auto;
		background-size: contain;
	}

	.main .main-ttl a {
		display: block;
		padding-top: 18.75%;
		background: url("../img/sp/ttl_head.png") center top no-repeat;
		background-size: contain;;
	}

	.main .sub-bg {
		min-width: 0;
	}
	
	.main h1.sub-ttl {
		width: 100%;
		min-width: 0;
		padding-top: 88%;
		background: url(../img/sp/img_main.jpg) center top no-repeat;
		background-size: contain;	
	}
	
	.main .lead {
		width: 92%;
		min-width: 0;
		margin: 0 auto;
		padding: 4%;
		font-size: 14px;
		line-height: 1.5; 
		text-align: left;
	}
	
	/*
	common */
	.wrap {
		width:100%;
	}
	
	.inner {
		width: 90%;
		min-width: 0;
		margin: 0 5%;
	}
	
	h2 {
		padding-top: 6%;
		margin-bottom: 4%;
		font-weight: bold;
		text-align: center;		
	}
	
	h2 .pink {
		display: inline-block;
		padding: 1% 8% 0;
		font-size: 14px;
		background: url(../img/bg_sec01_tit_left.gif) left center no-repeat,
		url(../img/bg_sec01_tit_right.gif) right center no-repeat;
		background-size: 6%;
	}
	
	h2 .brown {
		padding: 0 1%;
		font-size: 21px;
		text-shadow: 3px 3px #fef500;
		background: linear-gradient(transparent 60%, #fef500 40%);
	} 
	
	.subTxt {
		margin-bottom: 6%;
		font-size: 14px;
		line-height: 1.38;
		text-align: left;
	}
	
	
	/* sec01 */
	
	.sec01 {
		background: url(../img/sp/bg_sec01_01.jpg) center top no-repeat, url(../img/sp/bg_sec01_02.jpg) center bottom no-repeat;
		background-size: 100%;
		padding-bottom: 62%;
	}
	
	.sec01 h3 {
		color: #8cc40f;
		font-weight: bold;
		text-align: center;	
	}
	
	.sec01 .foodBlock {
		overflow: hidden;
		width: 100%;
		margin: 0 auto 30px;
	}
	
	.sec01 .foodBlock h3 {
		font-size: 17px;
		margin-bottom: 2%;
	}
	
	.sec01 .foodBlock .ph{
		float: none;
		position: relative;
		padding-bottom: 0;
		z-index: 1;	
	}
	
	.sec01 .foodBlock .ph:before, .sec01 .foodBlock .ph:after{
		box-shadow: none;
	}
	
	.sec01 .foodBlock .txtArea{
		float: none;
		width: 100%;
		margin-top: 4%;
		margin-left: 0;
	}
	
	.sec01 .foodBlock .txtArea .btn {
		margin-top: 3%;
	}
	
	.sec01 .foodList {
		overflow: hidden;
	}
	
	.sec01 .foodList li {
		float: none;
		width: 100%;
		margin-right: 0;
		margin-bottom: 10%;
	}
	
	.sec01 .foodList li:last-child {
		margin-right: 0;
	}
	
	.sec01 .foodList li h3 {
		margin: 4% auto 2%;
		font-size: 17px;
		line-height: 1.4;
		text-align: center;
	}
	
	.sec01 .foodList li:nth-child(2) h3 a,
	.sec01 .foodList li:nth-child(3) h3 a {
		margin-top: 0;
		display: inline-block;
	}
	
	
	.sec01 .foodList li .btn {
		margin-top: 3%;
	}
	
	
	/* sec02 */
	.sec02 {
		background: url(../img/sp/bg_sec02.jpg) center top repeat-y;
		background-size: 100%;
		padding-bottom: 7%;
	}
	
	.sec02 .productList {
		overflow: hidden;
	}
	
	.sec02 .productList li {
		width: 48%;
		float: left;
		margin-bottom: 7%;
		margin-right: 4%;
		text-align: center;
	}
	
	.sec02 .productList li h3 {
		margin: 2% auto;
		font-weight: bold;
	}
	
	/*.sec02 .productList li:nth-child(2) h3,*/
	.sec02 .productList li:nth-child(6) h3{
		margin: 1.2em auto 5%;
		display: inline-block;
	}
	
/*	.sec02 .productList li:nth-child(3) h3{
		margin-top: 0;
		display: inline-block;
	}*/
	
	.sec02 .productList li:nth-child(3){
		margin-right: 4%;
	}
	
	.sec02 .productList li:nth-child(even){
		margin-right: 0;
	}
	
	.sec02 .productList li p {
		margin-top: 3%;
	}
	
	.sec02 .bnrList {
		overflow: hidden;
		margin-top: 2;
	}
	
	.sec02 .bnrList li {
		width: 100%;
		float: none;
		margin-bottom: 6%;
		margin-right: 0;
		text-align: center;
	}
	
	.sec02 .bnrList li:last-child {
		margin-right: 0;
	}
	
	.sec02 .bnrList li p {
		margin-top: 2%;
	}
	
	
	/* sec03 */
	.sec03 {
		background: url(../img/sp/bg_sec03_01.jpg) center top no-repeat, url(../img/sp/bg_sec03_02.jpg) center bottom no-repeat;
		background-size: 100%;
		padding-bottom: 44%;
	}
	
	.sec03 h2 .pink {
		background-size: 8%;
	}
	
	.sec03 .foodList {
		overflow: hidden;
		width: 100%;
		margin: 0 auto;
		padding-bottom: 0;	
	}
	
	.sec03 .foodList02 {
		overflow: hidden;
		width: 100%;
		margin: 0 auto;	
		padding-bottom: 80px;	
	} 
	
	.sec03 .foodList li{
		float: none;
		width: 100%;
		margin-right: 0;
		margin-bottom: 10%;	
	}
	
	.sec03 .foodList li:last-child {
		margin-bottom: 5%;
	}
	
	.sec03 .foodList02 li {
		margin-bottom: 5%;
	}
	
	.sec03 .foodList li:last-child, .sec03 .foodList02 li:last-child  {
		margin-right: 0;
	}
	
	.sec03 .foodList li h3{
		margin: 4% auto 2%;
		color: #00b0ec;
		font-size: 17px;
		font-weight: bold;
		line-height: 1.4;
		text-align: center;
	}
	
	.sec03 .foodList02 li h3 {
		margin: 4% auto 2%;	
		padding-right: 5%;		
		width: 90%;
		font-size: 17px;
		text-align: center;
	}
	
	.sec03 .foodList02 li h3 + p {
		width: 90%;
	}
	
	.sec03 .foodList li .btn, .sec03 .foodList02 li .btn {
		margin-top: 3%;
	}
	
	.sec03 .foodList02 li .ph {
		position: relative;
		z-index: 1;
	}
	
	.sec03 .foodList02 li .ph img {
		width: 90%!important;
		height: auto;
		margin: 0 auto;
	}
	
	.sec03 .foodList02 li .btn img {
		width: 90%!important;
		height: auto;	
		margin: 0 auto;
	}
	
	.sec03 .foodList02 li:first-child {
		position: relative;
		width: 100%;
		padding: 5% 0 0 5%;
	}
	
	.sec03 .foodList02 li .icn01 {
		position: absolute;
		top: 0;
		left: 1%;
		z-index: 10;
	}
	
	.sec03 .foodList02 li:last-child {
		position: relative;
		width: 100%;
		padding: 5% 0 0 5%;
	}
	
	.sec03 .foodList02 li .icn02 {
		position: absolute;
		top: 0;
		right: 6%;
		z-index: 10;
	}


}