@charset "utf-8";

body {  
	background-image: url(../img/visual_bg.jpg);
	background-position: center top;
	background-repeat: repeat-x;
	max-width: none;
	height: inherit;
	margin: 0;
}


#scrollUp {
  bottom: 60px;
  right: 5px;
  padding: 10px 20px;
  color: #fff;
  opacity: 0.9;
}

header li {
    margin-left: 15px;
    margin-right: 15px;
    position: inherit;
    list-style: none;
}
header{
	margin-left: auto;
	margin-right: auto;
	background-image: url(../img/header_fg.gif);
	background-position: center top;
	background-repeat:no-repeat;
	max-width: none;
	height: inherit;
}
#visual,
#about,
#staff,
#movie,
#recipe,
#goods
{
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

header nav{
	background-image: url("../img/title_logo.gif");
	background-position: center top;
	background-repeat: no-repeat;
	height: 204px;
	margin: 0 auto auto;
	padding-top: 122px;
	width: 1200px;

}
header nav ul{
	width: 690px;
	margin-left: auto;
	margin-right: auto;
}
header nav .right{
	float: right;
}
header nav .left{
	float: left;
}
	.show-sm{
		display: none;
	}

#sm-nav li {
    height: 0;
}
#sm-nav a {
    font-size: 0;
}
#visual {
    margin: 0 auto auto;
}

/* 段落用にp下に20px空くように変更しました
------------------------- */
#about {
	font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;

    font-size: 14px;
    line-height: 1.8em;
    margin-top: 130px;
}



section#visual {
    background: none;
    height: 500px;
}
/* .viewer
------------------------- */
#visual {
    margin: 0 auto;
    width: 100%;
    position: relative;
    overflow: hidden;
}
#visual ul {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 0;
}
#visual ul li {
    top: 0;
    left: 0;
    width: 100%;
    position: absolute;
}
#visual ul li img {
    width: 100%;
}
#visual ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
 
#visual ul {
    display: inline-block;
    overflow: hidden;
}

#staff {
	min-width: inherit;
	width: 1px;
}
.staff{
    height: 1024px;
}
.staff_trigger img {
    padding-bottom: 50px;
}
.movie {
	background-image: url(../img/movie_bg.jpg);
	background-position: center top;
	background-repeat:repeat-x;
	max-width: none;
	height: inherit;
}
.movie a.movie {
	background-image: none;
}
.movie > section {
    padding-top: 25px;
}
#movie > h2 {
    padding-bottom: 50px;
}
#movie p{
	width: 1200px;
	height: 470px;
	background-image: url(../img/movie_fg.jpg);
	background-repeat: no-repeat;
	padding-top: 180px;
	text-align: center
}
#movie a img {
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
		 -o-transition: 0.3s ease-in-out;
			transition: 0.3s ease-in-out;
}
#movie a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
}



section#movie iframe{
	width: 1200px;
	height: 470px; 
	
}
#recipe {
	min-width: inherit;
	width: 1px;
}
.recipe > section {
    height: 700px;
    margin-top: -15px;
}
.goods {
	background-image: url(../img/goods_bg.jpg);
	background-position: center top;
	background-repeat:repeat-x;
	max-width: none;
	height: inherit;
}
.goods > section {
    padding-top: 15px;
    padding-bottom: 100px;
}
#goods{

}
#goods > h2 {
    padding-bottom: 40px;
}
#goods h3 {
    background-color: #fff;
    border-radius: 10px;
    margin-bottom: 15px;
    margin-top: 50px;
    padding: 10px;
    text-align: center;
}
#goods .item {
}

/*
	#goods .item .photo{
    border: 10px solid #fff;
}
*/

#goods > ul {
    padding: 0;
	list-style: outside none none;
}
#goods li {
	float: left;
	margin-right: 72px;
	margin-left: 72px;
	width: 300px;
}
#goods li:first-child{
	margin-left: 0;
}
#goods li:last-child{
	margin-right:  0;
}
#goods  p {
	font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
    font-size: 14px;
    line-height: 1.5em;
    margin-top: 35px;
}

footer {
    width: 1200px;
    padding-top: 100px;
    padding-bottom: 250px;
	margin-left: auto;
	margin-right: auto;
}
footer ul{
    padding: 0;
	list-style: outside none none;
}
footer li{
	font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
    font-size: 14px;
    line-height: 1.5em;
}

footer li:first-child{
	margin-left: 0;
	float: left;
}
footer li:last-child{
	margin-right:  0;
	float: right;
}
section#second {
    height: 450px;
    margin: 0 auto;
    max-width: 1200px;
    overflow: inherit;
    position: fixed;
    top: 0;
}

/* スマートフォンメニューボタン非表示 */
#sm-menu {
	font-size: 24px;

}
#sm-menu > img {
    background-color: #000;
    border: 1px solid #444;
    border-radius: 5px;
    padding: 4px;
}
#menu ul li.sub {
    font-size: 16px;
    text-indent: 1em;
}
#menu ul li {
    font-size: 20px;
}

/* スマートフォンメニュー非表示 */
.sm-menu {
	font-size: 24px;
}



/* field
------------------------- */
#field1,
#field2,
#field3,
#field4,
#field5,
#field6,
#field07,
#field08,
#field09,
#field10,
#field11
 {
	padding: 20px 0;
	width: 100%;
	height: 0;
	text-align: center;
	overflow:!important;
}

.scrImg {
	top: 100px;
	margin: 0 auto;
	display: none;
	position: relative;
}
#field1 .scrImg {	margin-left: -686px;	margin-top: -15px;}
#field2 .scrImg {	margin-left:  470px;	margin-top:   0px;}
#field3 .scrImg {	margin-left: -292px;	margin-top: 100px;}
#field4 .scrImg {	margin-left:  185px;	margin-top: 300px;}
#field5 .scrImg {	margin-left: -533px;	margin-top: 400px;}
#field6 .scrImg {	margin-left:  -58px;	margin-top: 500px;}

#field07 .scrImg {	margin-left: -686px;	margin-top: -28px;}
#field08 .scrImg {	margin-left: -144px;	margin-top: -16px;}
#field09 .scrImg {	margin-left:  450px;	margin-top:  -4px;}
#field10 .scrImg {	margin-left:  122px;	margin-top: 130px;}
#field11 .scrImg {	margin-left: -450px;	margin-top: 160px;}

img.responsive{
	display: block;
	height: auto;
	max-width: 100%;
}

/* レスポンシブ */

@media (max-width: 767px) {
	section {
		min-width: inherit;
		width:inherit;
		max-width: 1200px;
	}
	footer{
		width: 100%;
	}
header{
	background-image: url("../img/header_fg_sm.gif");
	background-size: contain;
}
header nav{
	background-image: url("../img/title_logo.gif");
	background-position: center -25px;
	height: 160px;
}
	header nav{
		width: inherit;
	}

	#about,
	#movie,
	#goods{
		padding: 10px;
	}
	#about {
		margin-top: 50px;
	}
	#about .photo{
		width: 45%;
		height: auto;
	}
	.movie{
	background-size: cover;
	}
	h2{
		padding-bottom: 25px;
	}
	#visual ul li img {
		height: auto;
	}
		#about img{
		display: block;
		height: auto;
		max-width: 100%;
	}
	#goods{	padding-bottom: 60px;}
	#goods li {
		float: none;
		margin-right: 0;
		margin-left: 0;
		width: 100%;
		margin-bottom: 30px;
	}
	#goods li:first-child{	margin-left: 0;}
	#goods li:last-child{	margin-right: 0;}

/*	#goods li .photo{background-color: #fff;border: 1px solid #f8f8f8;} */

	#goods li .photo img{	width: 100%;	height: auto;}
	#goods h3 {
	    margin-bottom: 15px;
	    margin-top: 20px;
	    padding-top: 20px;
	    padding-bottom: 20px;
	}
	#goods p {margin-top: 20px;}
	.goods {
	    background-image: url(../img/goods_bg_t.jpg),url(../img/goods_bg_b.jpg),url(../img/goods_bg_m.jpg);
	    background-repeat: no-repeat, no-repeat, repeat-y;
	    background-position: center top, center bottom, center center;
	}
	footer li:first-child{
		margin-left: 0;
		float: none;
	}
	footer li:last-child{
		margin-right:  0;
		float: none;
	}
	.show-sm{
		display: inherit;
	}
	.hidden-sm{
		display: none;
	}
	footer{
		padding-bottom: 30px;
	}
	footer ul li{
		text-align: center;	
	}
	#sm-menu {
		display: inherit;
	}

}
@media (min-width: 768px) and (max-width: 1200px) {

	header nav{
		width: 100%;
	}
	section {
		min-width: inherit;
		width:inherit;
		max-width: 1200px;
	}
	#visual ul li img {
		height: auto;
	}
	#about,
	#movie{
		padding: 15px;
	}
	.movie{
	background-size: cover;
	}
	h2{
		padding-bottom: 25px;
	}
	#about img{
		display: block;
		height: auto;
		max-width: 100%;
	}
footer li:first-child{
	margin-left: 0;
	float: none;
}
footer li:last-child{
	margin-right:  0;
	float: none;
}
}

@media (max-width: 479px) {	
body {  
	background-image: url(../img/visual_bg2.jpg);
	background-position: center 105px;
	background-size: 236% auto;
}
header nav {
background-position: center -25px;
background-size: contain;
height: 95px;
}
.staff{height: 750px;}
#movie p{height: 170px;width:290px;background-size:contain;margin-left: auto;margin-right: auto;padding-top: 3px;}
#field1 .scrImg {	margin-left: -240px;	margin-top: -73px;}
#field2 .scrImg {	margin-left:   26px;	margin-top:  -4px;}
#field3 .scrImg {	margin-left: -208px;	margin-top:  22px;}
#field4 .scrImg {	margin-left: -32px;		margin-top: 156px;}
#field5 .scrImg {	margin-left: -210px;	margin-top: 176px;}
#field6 .scrImg {	margin-left: -159px;	margin-top: 265px;}

.recipe > section {	height: 775px;}
#field07 .scrImg {	margin-left: -184px;	margin-top: -44px;}
#field08 .scrImg {	margin-left:  -37px;	margin-top: 72px;}
#field09 .scrImg {	margin-left: -226px;	margin-top: 111px;}
#field10 .scrImg {	margin-left:  -27px;	margin-top: 200px;}
#field11 .scrImg {	margin-left: -165px;	margin-top: 289px;}

}

@media (min-width: 480px) and (max-width: 767px) {
body {  
	background-image: url(../img/visual_bg2.jpg);
	background-position: center 88px;
	background-size: 190% auto;

}
header nav {
background-position: center -25px;
background-size: contain;
height: 95px;
}
.staff{height: 900px;}

#movie p{height: 220px;width:450px;background-size:contain;margin-left: auto;margin-right: auto;padding-top: 38px;}
#field1 .scrImg {	margin-left: -376px;	margin-top: -80px;}
#field2 .scrImg {	margin-left:  170px;	margin-top: -10px;}
#field3 .scrImg {	margin-left: -202px;	margin-top:  55px;}
#field4 .scrImg {	margin-left:  105px;	margin-top: 193px;}
#field5 .scrImg {	margin-left: -303px;	margin-top: 248px;}
#field6 .scrImg {	margin-left:  -78px;	margin-top: 400px;}

.recipe > section {	height: 1100px;}
#field07 .scrImg {	margin-left: -300px;	margin-top: -28px;}
#field08 .scrImg {	margin-left:   46px;	margin-top:  81px;}
#field09 .scrImg {	margin-left: -230px;	margin-top: 190px;}
#field10 .scrImg {	margin-left:   11px;	margin-top: 354px;}
#field11 .scrImg {	margin-left: -168px;	margin-top: 576px;}


}
@media (min-width: 768px) and (max-width: 969px) {
body {  
	background-image: url(../img/visual_bg2.jpg);
	background-position: center 165px;
	background-size: 167% auto;
}

#about .photo{	width: 40%;	height: auto;}
#movie p{	height: 300px;	width:738px;background-size:contain;margin-left: auto;margin-right: auto;padding-top: 91px;}
#field1 .scrImg {	margin-left: -526px;	margin-top: -15px;}
#field2 .scrImg {	margin-left:  300px;	margin-top:   0px;}
#field3 .scrImg {	margin-left: -192px;	margin-top: 100px;}
#field4 .scrImg {	margin-left:  185px;	margin-top: 300px;}
#field5 .scrImg {	margin-left: -383px;	margin-top: 400px;}
#field6 .scrImg {	margin-left: - 58px;	margin-top: 500px;}

.recipe > section {	height: 850px;}
#field07 .scrImg {	margin-left: -450px;	margin-top: -28px;}
#field08 .scrImg {	margin-left: -154px;	margin-top:  32px;}
#field09 .scrImg {	margin-left:  191px;	margin-top:  70px;}
#field10 .scrImg {	margin-left:  -32px;	margin-top: 255px;}
#field11 .scrImg {	margin-left: -368px;	margin-top: 276px;}
#goods{	padding: 10px;padding-bottom: 60px;}
#goods li {	margin:0;	width: 50%; margin-bottom: 50px;}
#goods li:first-child{	margin-left: 0;}
#goods li:last-child{	margin-right: 0;}
#goods .item {	padding-left: 30px;	padding-right: 30px;}
#goods .item .photo{    width: 100%;	height: auto;}
#goods .item .photo img{    width: 100%;	height: auto;}
#goods h3 {    margin-bottom: 15px;    margin-top: 20px;    padding-top: 20px;    padding-bottom: 20px;}
#goods p {margin-top: 20px;}
.goods {
    background-image: url(../img/goods_bg_t.jpg),url(../img/goods_bg_b.jpg),url(../img/goods_bg_m.jpg);
    background-repeat: no-repeat, no-repeat, repeat-y;
    background-position: center top, center bottom, center center;
}
}
@media (min-width: 970px) and (max-width: 1200px) {
body {  
	background-image: url(../img/visual_bg2.jpg);
	background-position: center 165px;
	background-size: 155% auto;
}

#movie p{height: 350px;width:940px;background-size:contain;margin-left: auto;margin-right: auto;padding-top: 130px;}
#field1 .scrImg {	margin-left: -586px;	margin-top: -15px;}
#field2 .scrImg {	margin-left:  370px;	margin-top: 0px;}
#field3 .scrImg {	margin-left: -202px;	margin-top: 100px;}
#field4 .scrImg {	margin-left:  185px;	margin-top: 300px;}
#field5 .scrImg {	margin-left: -433px;	margin-top: 400px;}
#field6 .scrImg {	margin-left:  -58px;	margin-top: 500px;}

#field07 .scrImg {	margin-left: -523px;	margin-top: -28px;}
#field08 .scrImg {	margin-left: -179px;	margin-top: -16px;}
#field09 .scrImg {	margin-left:  258px;	margin-top: -4px;}
#field10 .scrImg {	margin-left:   -8px;	margin-top: 130px;}
#field11 .scrImg {	margin-left: -383px;	margin-top: 160px;}

#goods{	padding: 10px;}
#goods li {	margin:0;	width: 33%;}
#goods li:first-child{	margin-left: 0;}
#goods li:last-child{	margin-right: 0;}
#goods .item {	padding-left: 30px;	padding-right: 30px;}
#goods .item .photo{    width: 100%;	height: auto;}
#goods .item .photo img{    width: 100%;	height: auto;}
#goods h3 {    margin-bottom: 15px;    margin-top: 20px;    padding-top: 20px;    padding-bottom: 20px;}
#goods p {margin-top: 20px;}
.goods {
    background-image: url(../img/goods_bg_t.jpg),url(../img/goods_bg_b.jpg),url(../img/goods_bg_m.jpg);
    background-repeat: no-repeat, no-repeat, repeat-y;
    background-position: center top, center bottom, center center;
}
}

@media (max-width: 1199px) {
#visual,
#about,
#staff,
#movie,
#recipe,
#goods
{
	width: inherit;
	margin-left: auto;
	margin-right: auto;
}
#staff,
#recipe
{
	width: 1px;
	margin-left: auto;
	margin-right: auto;
}

}