@charset "utf-8";
/* CSS Document */


/**kv
===================================*/
header #kv div{ background-image:url(../img/menu/key.jpg);}

.key_tl{
	position: absolute;
	bottom: 75px;
	left: 310px;
}

/**lead
===================================*/
#lead{ width:100%; margin-bottom:40px;}
#lead > div{ width:100%;  min-height:640px; background:url(../img/menu/lead_bg.jpg) no-repeat center center;
background-size:cover;}

#lead > div > div{ width:690px; padding:210px 310px 20px 0; margin:auto; position:relative;}

#lead > div > div h2{
	position: absolute;
	top: 20px;
	left: -50px;
}
#lead > div > div p{ padding-right:150px;}


/**sec2
===================================*/

#sec2 {	
}
#sec2 div{
	width:1000px; margin:auto;
	min-height:1280px;
	position:relative;
}

#sec2 div p{
	position:absolute;
}
#sec2 .sec2_tl{
	width:1000px;
	position:absolute;
	top:30px;
	text-align:center;
	z-index:200;
}
#sec2 .sec2_bug_1{
	top:85px;
	left:255px;
	z-index:100;
}
#sec2 .sec2_bug_2{
	top: 232px;
	left: 105px;
	z-index: 90;
}
#sec2 .sec2_bug_3{
	top: 338px;
	left: 579px;
	z-index: 80;
}
#sec2 .sec2_bug_4{
	top: 360px;
	left: 514px;
	z-index: 70;
}
#sec2 .sec2_bug_5{
	top: 446px;
	left: 130px;
	z-index: 60;
}
#sec2 .sec2_bug_6{
	top: 513px;
	left: 477px;
	z-index: 50;
}
#sec2 .sec2_bug_7{
	top: 676px;
	left: 153px;
	z-index: 40;
}
#sec2 .sec2_bug_8{
	top: 809px;
	left: 326px;
	z-index: 30;
}
#sec2 .sec2_txt_1{
	top: 130px;
	left: 644px;
	z-index: 150;
}
#sec2 .sec2_txt_2{
	top: 216px;
	left: 0px;
	z-index: 150;
}
#sec2 .sec2_txt_3{
	top: 246px;
	left: 689px;
	z-index: 150;
}
#sec2 .sec2_txt_4{
	top: 416px;
	left: 810px;
	z-index: 150;
}
#sec2 .sec2_txt_5{
	top: 535px;
	left: 13px;
	z-index: 150;
}
#sec2 .sec2_txt_6{
	top: 661px;
	left: 785px;
	z-index: 150;
}
#sec2 .sec2_txt_7{
	top: 771px;
	left: 46px;
	z-index: 150;
}
#sec2 .sec2_txt_8{
	top: 968px;
	left: 256px;
	z-index: 150;
}
#sec2 .sec2_txt_9{
	top:950px;
	left:200px;
	z-index:150;
}
#sec2 div .btn{
	bottom:30px;
	text-align:center;
	width:1000px;
}

/**sec2
===================================*/

#sec3 {
	margin-bottom:40px;
	padding:40px 0;
}

#sec3 .menulist{
	margin:0 auto 30px auto;
	width:1000px;
	padding:10px 35px 35px;
	position:relative;
	background-image:url(../img/menu/menulist_bg1.jpg),url(../img/menu/menulist_bg3.jpg),url(../img/menu/menulist_bg2.jpg);
	background-repeat:no-repeat, no-repeat, repeat-y;
	background-position: center top, center bottom, center top;
	}

#sec3 .menulist .menulist_tl{
	text-align:center;
	width:1000px;
	}

#sec3 .menulist .rec1{
	width:1000px;
	margin-bottom:30px;
	}
#sec3 .menulist .rec1 dl{
	width:320px;
	float:left;
	background:url(../img/menu/menulist_rec_bg.png) no-repeat center top;
	}
#sec3 .menulist .rec1 dl dd{
	line-height:1.5em;
	text-align:center;
	}
#sec3 .menulist .rec1 dl dd.price{
	font-weight:bold;
	padding-top:3px;
	color:#e90909;
	}
#sec3 .menulist .rec1 dl dd.price strong{
	font-size:20px;
	}


#sec3 .menulist .listwrap{
	width:940px;
	padding:30px;
	background-color:hsla(0,0%,100%,0.47);
	}
#sec3 .menulist .listwrap dl{
	width:450px;
	float:left;
	margin-bottom:30px;
	}
#sec3 .menulist .listwrap dl dt{
	font-size:18px;
	font-weight:bold;
	line-height:1.4em;
	}
#sec3 .menulist .listwrap dl dt span{
	display:block;
	padding:2px 10px;
	background-color:#ff9400;
	color:#FFFFFF;
	font-size:14px;
	border-radius:8px;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	margin-bottom:2px;
	}

#sec3 .menulist .listwrap dl dd{
	font-size:12px;
	line-height:1.4em;
	}
#sec3 .menulist .listwrap dl dd.price{
	font-weight:bold;
	color:#e90909;
	font-size:14px;
	}
#sec3 .menulist .listwrap dl dd.price strong{
	font-size:16px;
	}

#sec3 .setmenu{
	margin:0 auto 30px auto;
	width:1000px;
	padding:150px 35px 35px;
	position:relative;
	background-image:url(../img/menu/menulist_bg1.jpg),url(../img/menu/menulist_bg3.jpg),url(../img/menu/menulist_bg2.jpg);
	background-repeat:no-repeat, no-repeat, repeat-y;
	background-position: center top, center bottom, center top;
	}
#sec3 .setmenu .setmenu_tl{
	text-align:center;
	width:1000px;
	position:absolute;
	top:-30px;
	}

#sec3 .setmenu .setmenu_price{
	text-align:center;
	width:1000px;
	font-size:48px;
	font-weight:bold;
	}


#sec3 .setmenu .setmenu_price span{
	color:#e90909;
	}
#sec3 .setmenu .setmenu_price span small{
	font-size:32px;	}

#sec3 .setmenu .setdtl{
	width:1000px;
	padding-top:15px;
	height:260px;
	}
#sec3 .setmenu .setdtl dl{
	width:320px;
	height:260px;
	float:left;
	position:relative;
	}

#sec3 .setmenu .setdtl dl dt{
	position:absolute;
	top:0;
	left:0;
	z-index:0;
	}
#sec3 .setmenu .setdtl dl dd{
	position: absolute;
	top: 86px;
	left: 11px;
	width: 300px;
	z-index: 10;
	text-align: center;
	font-size: 20px;
	color: #FFFFFF;
	font-weight: bold;
	line-height: 1.4em;
	}

#sec3 .setmenu .setdtl dl dd small{
	font-size:14px;
	}
#sec3 .setmenu .note{
	text-align:center;
	margin-bottom:0.8em;
	}
#sec3 .setmenu .potato{
	width:1000px;
	position:relative;
	height:480px;
	}
#sec3 .setmenu .potato .cont{
	position: absolute;
	z-index: 10;
	top: 50px;
	width: 550px;
		}
#sec3 .setmenu .potato .img{
	position:absolute;
	z-index:0;
	top:0px;
	right:0;
		}
.listwrap p img {
	position: absolute;
    bottom: 75px;
    right: 85px;
}




/**sec4
===================================*/
#sec4 { width:100%; height:560px; 
background:url(../img/menu/sec4_bg.jpg) no-repeat center center;
background-size:cover;
}
#sec4 h2{
	padding-top:40px;
}
#sec4 .roast{
	float:right;
	width:400px;
	margin-right:340px;
	
}
#sec4 .roast p{
	text-shadow: 2px 2px 2px #ffffff,
    -2px 2px 2px #ffffff,
    2px -2px 2px #ffffff,
    -2px -2px 2px #ffffff;
}

/**sec5
===================================*/
#sec5 { padding:80px 0; text-align:center;}


/* 画面外にいる状態 */
.sec2_txt_1,.sec2_txt_2,.sec2_txt_3,.sec2_txt_4,.sec2_txt_5,.sec2_txt_6,.sec2_txt_7,.sec2_txt_8{
    opacity : 0;
    transition : all 600ms ease-out 1.1s;
	transform : translate(0, 0);
	transform : scale(0.5);
	transform-origin:center center;    }
	
.sec2_bug_1{
    opacity : 1;
    transition : all 300ms ease-out 0.3s;
	transform : translate(0, 250px);
    }
.sec2_bug_2{
    opacity : 1;
    transition : all 300ms ease-out 0.7s;
	transform : translate(200px, 240px);
    }	
.sec2_bug_3{
    opacity : 1;
    transition : all 300ms ease-out 0.7s;
	transform : translate(-200px, 240px);
    }		
.sec2_bug_4{
    opacity : 1;
    transition : all 300ms ease-out 0.7s;
	transform : translate(-210px, 150px);
    }	
.sec2_bug_5{
    opacity : 1;
    transition : all 300ms ease-out 0.7s;
	transform : translate(150px, 80px);
    }	
.sec2_bug_6{
    opacity : 1;
    transition : all 300ms ease-out 0.7s;
	transform : translate(-195px, 25px);
    }	
.sec2_bug_7{
    opacity : 1;
    transition : all 300ms ease-out 0.7s;
	transform : translate(105px, -80px);
    }
.sec2_bug_8{
    opacity : 1;
    transition : all 300ms ease-out 0.3s;
	transform : translate(-70px, -220px);
    }		
/* 画面内に入った状態 */
.sec2_bug_1.scrollin,.sec2_bug_2.scrollin,.sec2_bug_3.scrollin,.sec2_bug_4.scrollin,.sec2_bug_5.scrollin,.sec2_bug_6.scrollin,.sec2_bug_7.scrollin,.sec2_bug_8.scrollin,.sec2_txt_1.scrollin,.sec2_txt_2.scrollin,.sec2_txt_3.scrollin,.sec2_txt_4.scrollin,.sec2_txt_5.scrollin,.sec2_txt_6.scrollin,.sec2_txt_7.scrollin,.sec2_txt_8.scrollin{
    opacity : 1;
	  transform : translate(0, 0);
	  transform : scale(1.0);
    }