@charset "utf-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*body setting --------------------------- */
body {
	font-family: Arial, "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Osaka, Helvetica, Verdana, sans-serif;
	font-size: 16px;
	font-weight: 300;
	-webkit-text-size-adjust: 100%;
	color: #333333;
	background-color: #ffffff;
	overflow: hidden;
}

/*block setting --------------------------- */
body, div, h1, h2, h3, h4, h5, h6, p, dt, dd, li, th, td {
	text-align: left;
}

/*clearfix --------------------------- */
.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	visibility: hidden;
	clear: both;
}
.clearfix {
	zoom: 1;/*for IE 5.5-7*/
}

/*hidden text --------------------------- */
.altTxt {
	font-size: 0.1px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

/*a setting --------------------------- */
a {
	text-decoration: none;
	cursor: pointer;
	color: #034695;
	outline: none;
}
a:visited {
	color: #034695;
}
a:focus {
	outline: none;
}
a img {
	border: 0px;
}
.opac a:hover {
	-ms-filter: "alpha( opacity=70 )";
	filter: alpha( opacity=70 );
	opacity: 0.7;
}

/*img setting --------------------------- */
img {
	vertical-align: bottom;
}

/*justify setting --------------------------- */
.justify {
	text-align: justify;
	text-justify: inter-ideograph;
}

/*wrap setting --------------------------- */
#wrap {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 0;
}

/*container setting --------------------------- */
#container {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
	background-color: #ffffff;
}
#container .inner {
	width: 81.25%;
	height: 100%;
	margin: 0 auto;
	position: relative;
}
#container .arrow_top,
#container .arrow_down {
	width: 7.69%;
	margin: 0 auto;
	position: absolute;
	left: 0;
	right: 0;
	z-index: 101;
}
#container .arrow_top {
	top: 15px;
}
#container .arrow_down {
	bottom: 15px;
}
#container .arrow_top img,
#container .arrow_down img {
  width: 100%;
}

#header, #top, #recipe, #produce {
	overflow: hidden;
}
#top, #recipe, #produce {
	position: relative;
}
#header img,
#top img,
#recipe img,
#produce img,
#side_menu img {
	width: 100%;
	height: auto;
}

/*header setting --------------------------- */
#header {
	position: fixed;
	z-index: 100;
	top: -300px;
	width: 100%;
	background-color: none;
}
#header.bgcolor {
	background-color: none;/*rgba(255,255,255,0.5)*/
}
#header .inner {
	padding: 20px 0 10px;
	width: 90%;
	display: block;
}
#header .logo {
	width: 25.5%;
	float: left;
}
#header .buttons {
	width: 36.3%;
	float: right;
	text-align: right;
	font-size: 0.1px;
}
#header .sns {
	display: inline-block;
	width: 20%;
	padding-left: 6.36%;
}
#header .menu {
	display: inline-block;
	width: 24.36%;
	padding-left: 6.36%;
}
#header .contents_title {
	width: 27.7%;
	position: absolute;
	right: 0;
	top: 60%;
}
#header .contents_title p {
  width: 100%;
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}

.fader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  z-index: 1000;
}
.fader img {
  position: absolute;
  width: 57px !important;
  height: 32px !important;;
  left: 50%;
  top: 50%;
  margin-top: -16px;
  margin-left: -16px;
}


/*top setting --------------------------- */
#top {
  width: 100%;
  overflow: hidden;
}
#top .inner {
	width: 100%;
}
#mainvisual {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	background-image: url(../images/top_bg.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
#top .text {
  width: 100%;
  position: absolute;
  left: 0;
  top: 58%;
  text-align: center;
  display: none;
}
#top .text .lead {
  margin: 0 auto 20px auto;
  width: 90.21%;
}
#top .text .lead img {
	width: 100%;
}
#top .caption {
  width: 43.125%;
  height: 100%;
  position: absolute;
  right: 0;
  top: 29%;
  display: none;
}
#top .caption p {
  position: absolute;
  left: 0;
  top: 0;
}
#top .arrow_top,
#top .arrow_down {
  width: 6.25%;
}
#top .bnr_collabo {
  background: rgba(255, 255, 255, 0.5);
  position: absolute;
  right: 5%;
  bottom: 6px;
  width: 38%;
  border-radius: 5px;
}
#top .bnr_collabo img {
  width: 100%;
}
#top .bnr_collabo.bright {
  -webkit-animation: bnr-bright 4s cubic-bezier(0.215, 0.61, 0.355, 1) infinite 1s forwards;
  -moz-animation: bnr-bright 4s cubic-bezier(0.215, 0.61, 0.355, 1) infinite 1s forwards;
  -ms-animation: bnr-bright 4s cubic-bezier(0.215, 0.61, 0.355, 1) infinite 1s forwards;
  animation: bnr-bright 4s cubic-bezier(0.215, 0.61, 0.355, 1) infinite 1s forwards;
}
@-webkit-keyframes bnr-bright {
  0% { -webkit-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
  25% { -webkit-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.5); }
  50% { -webkit-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.1); }
  75% { -webkit-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.75); }
  100%{ -webkit-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
}
@-moz-keyframes bnr-bright {
  0% { -moz-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
  25% { -moz-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.5); }
  50% { -moz-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.1); }
  75% { -moz-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.75); }
  100%{ -moz-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
}
@-ms-keyframes bnr-bright {
  0% { -ms-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
  25% { -ms-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.5); }
  50% { -ms-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.1); }
  75% { -ms-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.75); }
  100%{ -ms-box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
}
@keyframes bnr-bright {
  0% { box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
  25% { box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.5); }
  50% { box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.1); }
  75% { box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0.75); }
  100%{ box-shadow:0px 0px 12px 3px rgba(230, 47, 135, 0); }
}

/*
 * Top Backgriund
 */
#top .background {
  background: url(../images/top_bg.jpg);
  position: absolute;
  top: 50%;
  left: 50%;
  width: 640px;
  height: 950px;
  
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
} 
#top .background .element {
  background: url(../images/top_elements.png) no-repeat;
  position: absolute;
  display: none;
}
#top .background .element-1_1 {
  top: 761px;
  left: 0px;
  width: 347px;
  height: 189px;
  background-position: -5px -5px;
}
#top .background .element-1_2 {
  top: 690px;
  left: 315px;
  width: 325px;
  height: 260px;
  background-position: -362px -5px;
}
#top .background .element-1_3 {
  top: 456px;
  left: 0px;
  width: 416px;
  height: 494px;
  background-position: -5px -275px;
}
#top .background .element-1_4 {
  top: 602px;
  left: 321px;
  width: 251px;
  height: 348px;
  background-position: -431px -275px;
}
#top .background .element-2_1 {
  top: 364px;
  left: 0px;
  width: 176px;
  height: 191px;
  background-position: -697px -5px;
}
#top .background .element-2_2 {
  top: 267px;
  left: 211px;
  width: 189px;
  height: 289px;
  background-position: -697px -206px;
}
#top .background .element-2_3 {
  top: 366px;
  left: 447px;
  width: 193px;
  height: 196px;
  background-position: -692px -505px;
}
#top .background .element-3_1 {
  top: 128px;
  left: 0px;
  width: 59px;
  height: 230px;
  background-position: -896px -5px;
}
#top .background .element-3_2 {
  top: 287px;
  left: 110px;
  width: 116px;
  height: 74px;
  background-position: -431px -711px;
}
#top .background .element-3_3 {
  top: 301px;
  left: 281px;
  width: 233px;
  height: 71px;
  background-position: -557px -711px;
}
#top .background .element-3_4 {
  top: 257px;
  left: 562px;
  width: 78px;
  height: 109px;
  background-position: -896px -245px;
}
#top .background .element-4_1 {
  top: 180px;
  left: 27px;
  width: 91px;
  height: 101px;
  background-position: -896px -364px;
}
#top .background .element-4_2 {
  top: 190px;
  left: 156px;
  width: 98px;
  height: 93px;
  background-position: -896px -475px;
}
#top .background .element-4_3 {
  top: 177px;
  left: 290px;
  width: 49px;
  height: 103px;
  background-position: -895px -578px;
}
#top .background .element-4_4 {
  top: 223px;
  left: 378px;
  width: 90px;
  height: 59px;
  background-position: -895px -691px;
}
#top .background .element-4_5 {
  top: 211px;
  left: 501px;
  width: 84px;
  height: 70px;
  background-position: -800px -760px;
}
#top .background .element-4_6 {
  top: 187px;
  left: 622px;
  width: 18px;
  height: 91px;
  background-position: -965px -5px;
}
#top .background .element-5_1 {
  top: 142px;
  left: 28px;
  width: 46px;
  height: 57px;
  background-position: -954px -578px;
}
#top .background .element-5_2 {
  top: 149px;
  left: 119px;
  width: 81px;
  height: 51px;
  background-position: -431px -645px;
}
#top .background .element-5_3 {
  top: 141px;
  left: 227px;
  width: 116px;
  height: 81px;
  background-position: -5px -840px;
}
#top .background .element-5_4 {
  top: 141px;
  left: 327px;
  width: 63px;
  height: 61px;
  background-position: -894px -760px;
}
#top .background .element-5_5 {
  top: 137px;
  left: 405px;
  width: 70px;
  height: 67px;
  background-position: -131px -831px;
}
#top .background .element-5_6 {
  top: 131px;
  left: 496px;
  width: 58px;
  height: 84px;
  background-position: -211px -831px;
}
#top .background .element-5_7 {
  top: 141px;
  left: 589px;
  width: 51px;
  height: 71px;
  background-position: -279px -831px;
}
#top .background .element-6_1 {
  top: 93px;
  left: 14px;
  width: 66px;
  height: 43px;
  background-position: -522px -645px;
}
#top .background .element-6_2 {
  top: 55px;
  left: 110px;
  width: 56px;
  height: 89px;
  background-position: -340px -831px;
}
#top .background .element-6_3 {
  top: 81px;
  left: 200px;
  width: 59px;
  height: 60px;
  background-position: -406px -831px;
}
#top .background .element-6_4 {
  top: 93px;
  left: 287px;
  width: 114px;
  height: 49px;
  background-position: -475px -831px;
}
#top .background .element-6_5 {
  top: 94px;
  left: 423px;
  width: 92px;
  height: 64px;
  background-position: -599px -831px;
}
#top .background .element-6_6 {
  top: 33px;
  left: 525px;
  width: 56px;
  height: 124px;
  background-position: -701px -831px;
}
#top .background .element-6_7 {
  top: 93px;
  left: 609px;
  width: 31px;
  height: 57px;
  background-position: -965px -106px;
}
#top .background .element-7_1 {
  top: 31px;
  left: 22px;
  width: 29px;
  height: 60px;
  background-position: -965px -173px;
}
#top .background .element-7_2 {
  top: 51px;
  left: 85px;
  width: 53px;
  height: 36px;
  background-position: -598px -645px;
}
#top .background .element-7_3 {
  top: 43px;
  left: 148px;
  width: 54px;
  height: 50px;
  background-position: -894px -831px;
}
#top .background .element-7_4 {
  top: 56px;
  left: 227px;
  width: 44px;
  height: 37px;
  background-position: -958px -831px;
}
#top .background .element-7_5 {
  top: 39px;
  left: 301px;
  width: 26px;
  height: 56px;
  background-position: -967px -760px;
}
#top .background .element-7_6 {
  top: 56px;
  left: 356px;
  width: 66px;
  height: 41px;
  background-position: -767px -878px;
}
#top .background .element-7_7 {
  top: 55px;
  left: 432px;
  width: 37px;
  height: 43px;
  background-position: -843px -878px;
}
#top .background .element-7_8 {
  top: 16px;
  left: 506px;
  width: 33px;
  height: 84px;
  background-position: -958px -878px;
}
#top .background .element-7_9 {
  top: 52px;
  left: 606px;
  width: 34px;
  height: 46px;
  background-position: -5px -972px;
}
#top .background .element-spoon {
  top: 51px;
  left: 371px;
  width: 269px;
  height: 216px;
  background-position: -1006px -5px;
}

#top .background .shadow {
  background: url(../images/top_shadows.png) no-repeat;
  position: absolute;
  display: none;
}
#top .background .shadow-2_1 {
  top: 459px;
  left: 0px;
  width: 250px;
  height: 172px;
  background-position: -5px -5px;
}
#top .background .shadow-2_2 {
  top: 494px;
  left: 194px;
  width: 275px;
  height: 86px;
  background-position: -265px -5px;
}
#top .background .shadow-2_3 {
  top: 472px;
  left: 403px;
  width: 237px;
  height: 128px;
  background-position: -265px -101px;
}
#top .background .shadow-3_1 {
  top: 291px;
  left: 0px;
  width: 122px;
  height: 111px;
  background-position: -5px -239px;
}
#top .background .shadow-3_2 {
  top: 311px;
  left: 98px;
  width: 156px;
  height: 76px;
  background-position: -137px -239px;
}
#top .background .shadow-3_3 {
  top: 311px;
  left: 262px;
  width: 281px;
  height: 77px;
  background-position: -137px -325px;
}
#top .background .shadow-3_4 {
  top: 288px;
  left: 520px;
  width: 120px;
  height: 154px;
  background-position: -428px -239px;
}
#top .background .shadow-4_1 {
  top: 240px;
  left: 30px;
  width: 137px;
  height: 56px;
  background-position: -428px -403px;
}
#top .background .shadow-4_2 {
  top: 240px;
  left: 144px;
  width: 129px;
  height: 45px;
  background-position: -5px -469px;
}
#top .background .shadow-4_3 {
  top: 258px;
  left: 282px;
  width: 121px;
  height: 30px;
  background-position: -5px -403px;
}
#top .background .shadow-4_4 {
  top: 235px;
  left: 361px;
  width: 136px;
  height: 76px;
  background-position: -144px -469px;
}
#top .background .shadow-4_5 {
  top: 236px;
  left: 472px;
  width: 164px;
  height: 77px;
  background-position: -290px -469px;
}
#top .background .shadow-5_1 {
  top: 179px;
  left: 24px;
  width: 63px;
  height: 34px;
  background-position: -303px -239px;
}
#top .background .shadow-5_2 {
  top: 182px;
  left: 105px;
  width: 107px;
  height: 28px;
  background-position: -464px -469px;
}
#top .background .shadow-5_3 {
  top: 188px;
  left: 231px;
  width: 87px;
  height: 21px;
  background-position: -464px -507px;
}
#top .background .shadow-5_4 {
  top: 166px;
  left: 291px;
  width: 131px;
  height: 81px;
  background-position: -550px -5px;
}
#top .background .shadow-5_5 {
  top: 181px;
  left: 400px;
  width: 93px;
  height: 46px;
  background-position: -550px -96px;
}
#top .background .shadow-5_6 {
  top: 195px;
  left: 499px;
  width: 68px;
  height: 25px;
  background-position: -512px -152px;
}
#top .background .shadow-5_7 {
  top: 190px;
  left: 581px;
  width: 59px;
  height: 32px;
  background-position: -653px -96px;
}
#top .background .shadow-6_1 {
  top: 102px;
  left: 5px;
  width: 94px;
  height: 54px;
  background-position: -590px -152px;
}
#top .background .shadow-6_2 {
  top: 108px;
  left: 119px;
  width: 79px;
  height: 51px;
  background-position: -558px -216px;
}
#top .background .shadow-6_3 {
  top: 111px;
  left: 204px;
  width: 91px;
  height: 40px;
  background-position: -558px -277px;
}
#top .background .shadow-6_4 {
  top: 103px;
  left: 301px;
  width: 137px;
  height: 52px;
  background-position: -558px -327px;
}
#top .background .shadow-6_5 {
  top: 122px;
  left: 424px;
  width: 82px;
  height: 29px;
  background-position: -575px -389px;
}
#top .background .shadow-6_6 {
  top: 135px;
  left: 537px;
  width: 56px;
  height: 28px;
  background-position: -647px -216px;
}
#top .background .shadow-6_7 {
  top: 121px;
  left: 596px;
  width: 44px;
  height: 46px;
  background-position: -659px -254px;
}
#top .background .shadow-7_2 {
  top: 73px;
  left: 78px;
  width: 66px;
  height: 20px;
  background-position: -136px -428px;
}
#top .background .shadow-7_3 {
  top: 73px;
  left: 146px;
  width: 67px;
  height: 33px;
  background-position: -581px -428px;
}
#top .background .shadow-7_4 {
  top: 60px;
  left: 226px;
  width: 50px;
  height: 46px;
  background-position: -658px -428px;
}
#top .background .shadow-7_5 {
  top: 72px;
  left: 299px;
  width: 40px;
  height: 31px;
  background-position: -581px -484px;
}
#top .background .shadow-7_6 {
  top: 72px;
  left: 368px;
  width: 50px;
  height: 30px;
  background-position: -631px -484px;
}
#top .background .shadow-7_7 {
  top: 82px;
  left: 430px;
  width: 46px;
  height: 23px;
  background-position: -212px -428px;
}
#top .background .shadow-7_8 {
  top: 41px;
  left: 498px;
  width: 55px;
  height: 91px;
  background-position: -5px -524px;
}
#top .background .shadow-7_9 {
  top: 70px;
  left: 597px;
  width: 43px;
  height: 57px;
  background-position: -70px -524px;
}

/*
 * Movie
 */
#movie {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  display: none;
}
#movie .cover {
  background: rgba(255, 255, 255, 0.8);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#movie .container {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#movie .container:before {
  content:"";
  display: block;
  padding-top: 56.25%;
}
#movie .container .player {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
#movie .share {
  background: url(../images/movie_share.png) no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 20px;
  right: 10px;
  padding: 3px 3px 3px 118px;
  width: 58px;
  height: 24px;
}
#movie .share div {
  float: left;
  margin-left: 5px;
  width: 24px;
  height: 24px;
}
#movie .share div img {
  width: 100%;
}
#movie .close {
  position: absolute;
  background: url(../images/movie_close.png);
  background-size: contain;
  top: 20px;
  right: 20px;
  width: 27px;
  height: 26px;
  text-indent: -9999px;
  cursor: pointer;
}

.modal_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  z-index: 999;
}


/*recipe setting --------------------------- */
#recipe {
	background-image: url(../images/recipe_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
}
#recipe .inner {
  width: 290px;
  height: auto;
  margin: auto;
  padding-top: 60%;
}
#recipe .text {
  margin-bottom: 40px;
  opacity: 0;
}
#recipe .bnr {
  position: relative;
  width: 290px;
  height: 46px;
  margin-top: 8px;
}
#recipe .bnr img {
  width: 100%;
}
#recipe .bnr .frame {
  position: relative;
}
#recipe .bnr .thumb {
  width: 144px;
  height: 44px;
  position: absolute;
  top: 2px;
  right: 2px;
}

/*
 * Arrange Recipe
 */
#arrange {
  background: url(../images/collabo_bg.jpg) center center;
  background-size: cover;
  min-height: 500px;
  position: relative;
}
#arrange .contents {
  position: relative;
  margin: 0;
  padding: 32% 0 35px 0;
  opacity: 0;
}
#arrange .contents h2 {
  margin: 0 15px;
}
#arrange .contents h2 img {
  width: 100%;
}
#arrange .contents .menu {
  margin-top: 15px;
}
#arrange .contents .menu .season img {
  width: 100%;
}
#arrange .contents .menu .regular_menu {
  border-top: #9e9e9e 1px solid;
  margin: 0 15px;
  padding-top: 10px;
}
#arrange .contents .menu .regular_menu:after {
  content: "";
  display: block;
  clear: both;
}
#arrange .contents .menu .regular_menu li {
  float: left;
  width: 50%;
}
#arrange .contents .menu .regular_menu li a {
  display: block;
}
#arrange .contents .menu .regular_menu li img {
  width: 100%;
}

#arrange .recipe {
  position: absolute;
  background-size: contain, contain;
  background-position: center top, center top;
  background-repeat: no-repeat, repeat-y;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 600;
  display: none;
}
#arrange .recipe .container {
  margin: 62.5% auto 0 auto;
  width: 290px;
}
#arrange .recipe .container h2 {
  margin-bottom: 15px;
}
#arrange .recipe .container img {
  width: 100%;
}
#arrange .recipe .container h3.material_ttl {
  background: url(../images/arrange_recipe_h3_1.png) no-repeat;
  background-size: contain;
  width: 20px;
  height: 8px;
  text-indent: -9999px;
  margin-bottom: 5px;
}
#arrange .recipe .container h3.recipe_ttl {
  background: url(../images/arrange_recipe_h3_2.png) no-repeat;
  background-size: contain;
  width: 30px;
  height: 8px;
  text-indent: -9999px;
  margin-bottom: 5px;
}
#arrange .recipe .container ul.material {
  margin-bottom: 5px;
}
#arrange .recipe .container h4,
#arrange .recipe .container ul.material li {
  background-repeat: no-repeat;
  background-size: cover;
  text-indent: -9999px;
  width: 290px;
  height: 16px;
}
#arrange .recipe .container .material-w50:after {
  content: "";
  display: table;
  clear: both;
}
#arrange .recipe .container .material-w50 ul.material {
  margin-bottom: 5px;
  float: left;
  width: 50%;
}
#arrange .recipe .container .material-w50 ul.material li {
  width: 145px;
}
#arrange .recipe .close {
  position: absolute;
  top: 9px;
  right: 15px;
}
#arrange .recipe .close a {
  background: url(../images/arrange_recipe_close.png) no-repeat;
  background-size: contain;
  display: block;
  width: 95px;
  height: 17px;
  text-indent: -9999px;
}

#arrange .recipe .container ul.material .l1 {
  background-position: 0 0;
}
#arrange .recipe .container ul.material .l2 {
  background-position: 0 -16px;
}
#arrange .recipe .container ul.material .l3 {
  background-position: 0 -32px;
}
#arrange .recipe .container ul.material .l4 {
  background-position: 0 -48px;
}
#arrange .recipe .container ul.material .l5 {
  background-position: 0 -64px;
}
#arrange .recipe .container ul.material .l6 {
  background-position: 0 -80px;
}
#arrange .recipe .container ul.material .l7 {
  background-position: 0 -96px;
}
#arrange .recipe .container ul.material li.link {
  background: none !important;
  text-indent: 0;
}
#arrange .recipe .container ul.material li.link a {
  background-size: cover;
  text-indent: -9999px;
  display: block;
  width: 100%;
  height: 100%;
}
#arrange .recipe .container ul.material .l2 a {
  background-position: 0 -16px;
}
#arrange .recipe .container ul.material .l5 a {
  background-position: 0 -64px;
}
#arrange .recipe .container h4.l4 {
  background-position: 0 -48px;
}

#arrange .recipe .container .col2:after {
  content: "";
  clear: both;
  display: block;
}
#arrange .recipe .container .col2 h4 {
  width: 145px;
}
#arrange .recipe .container .col2 .col {
  width: 145px;
  float: left;
}
#arrange .recipe .container .col2 .col li {
  width: 145px;
}
#arrange .recipe .container .col2 .col-r .l1 {
  background-position: -145px 0;
}
#arrange .recipe .container .col2 .col-r .l2,
#arrange .recipe .container .col2 .col-r .l2 a {
  background-position: -145px -16px;
}
#arrange .recipe .container .col2 .col-r .l3 {
  background-position: -145px -32px;
}

#arrange #arrange9.recipe .container .material-w50 ul.material li,
#arrange #arrange9.recipe .container ul.material li.link a {
  background-size: 290px 54px;
}
#arrange #arrange9.recipe .container ul.material li.l5 {
  background-position: -145px 0;
}
#arrange #arrange9.recipe .container ul.material li.l6 {
  background-position: -145px -16px;
}
#arrange #arrange9.recipe .container ul.material li.l7 {
  background-position: -145px -32px;
}

#arrange #arrange1 {
  background-image: url(../images/arrange_recipe1_bg.jpg), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange2 {
  background-image: url(../images/arrange_recipe2_bg.jpg), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange3 {
  background-image: url(../images/arrange_recipe3_bg.jpg), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange4 {
  background-image: url(../images/arrange_recipe4_bg.jpg), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange5 {
  background-image: url(../images/arrange_recipe5_bg.jpg), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange6 {
  background-image: url(../images/arrange_recipe6_bg.png), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange7 {
  background-image: url(../images/arrange_recipe7_bg.png), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange8 {
  background-image: url(../images/arrange_recipe8_bg.png), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange9 {
  background-image: url(../images/arrange_recipe9_bg.png), url(../images/arrange_recipe_bg.png);
}
#arrange #arrange10 {
  background-image: url(../images/arrange_recipe10_bg.png), url(../images/arrange_recipe_bg.png);
}

#arrange #arrange1 .container ul.material li,
#arrange #arrange1 .container ul.material li a {
  background-image: url(../images/arrange_recipe1_material.png);
}
#arrange #arrange2 .container ul.material li,
#arrange #arrange2 .container ul.material li a {
  background-image: url(../images/arrange_recipe2_material.png);
}
#arrange #arrange3 .container ul.material li,
#arrange #arrange3 .container ul.material li a {
  background-image: url(../images/arrange_recipe3_material.png);
}
#arrange #arrange4 .container ul.material li,
#arrange #arrange4 .container ul.material li a {
  background-image: url(../images/arrange_recipe4_material.png);
}
#arrange #arrange5 .container ul.material li,
#arrange #arrange5 .container ul.material li a {
  background-image: url(../images/arrange_recipe5_material.png);
}
#arrange #arrange6 .container ul.material li,
#arrange #arrange6 .container ul.material li a {
  background-image: url(../images/arrange_recipe6_material.png);
}
#arrange #arrange7 .container ul.material li,
#arrange #arrange7 .container ul.material li a {
  background-image: url(../images/arrange_recipe7_material.png);
}
#arrange #arrange8 .container ul.material li,
#arrange #arrange8 .container ul.material li a {
  background-image: url(../images/arrange_recipe8_material.png);
}
#arrange #arrange9 .container ul.material li,
#arrange #arrange9 .container ul.material li a {
  background-image: url(../images/arrange_recipe9_material.png);
}
#arrange #arrange10 .container h4,
#arrange #arrange10 .container ul.material li,
#arrange #arrange10 .container ul.material li a {
  background-image: url(../images/arrange_recipe10_material.png);
  background-size: 290px 110px;
}

#arrange #arrange4 .container ul.material li.l2 {
  background-position: 0 -16px;
  height: 32px;
}
#arrange #arrange4 .container ul.material li.l3 {
  background-position: 0 -48px;
}
#arrange #arrange4 .container ul.material li.l4 {
  background-position: 0 -64px;
}

#arrange #arrange6 .container h3.material_ttl {
  background-image: url(../images/arrange_recipe_h3_1_hw.png);
}
#arrange #arrange6 .container h3.recipe_ttl {
  background-image: url(../images/arrange_recipe_h3_2_hw.png);
}
#arrange #arrange6 .close a {
  background-image: url(../images/arrange_recipe_close_hw.png);
}
#arrange #arrange6 .container ul.material li.l2 {
  background-position: 0 -16px;
  height: 32px;
}
#arrange #arrange6 .container ul.material li.l3 {
  background-position: 0 -48px;
}
#arrange #arrange6 .container ul.material li.l4 {
  background-position: 0 -64px;
}

#arrange #arrange7 .container h3.material_ttl,
#arrange #arrange8 .container h3.material_ttl,
#arrange #arrange9 .container h3.material_ttl {
  background-image: url(../images/arrange_recipe_h3_1_xmas.png);
}
#arrange #arrange7 .container h3.recipe_ttl,
#arrange #arrange8 .container h3.recipe_ttl,
#arrange #arrange9 .container h3.recipe_ttl {
  background-image: url(../images/arrange_recipe_h3_2_xmas.png);
}
#arrange #arrange7 .close a,
#arrange #arrange8 .close a,
#arrange #arrange9 .close a {
  background-image: url(../images/arrange_recipe_close_xmas.png);
}

#arrange #arrange10 .container h3.material_ttl {
  background-image: url(../images/arrange_recipe_h3_1_vd.png);
}
#arrange #arrange10 .container h3.recipe_ttl {
  background-image: url(../images/arrange_recipe_h3_2_vd.png);
}
#arrange #arrange10 .close a {
  background-image: url(../images/arrange_recipe_close_vd.png);
}

/*produce setting --------------------------- */
#produce {
	background-image: url(../images/prd_bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
#produce .text {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  padding-top: 90%;
  opacity: 0;
}


/*footer setting --------------------------- */
#footer {
	background: #fff;
	width: 100;
	padding: 24px 0px;
	text-align: center;
}
.ft-sns {
	width: 28%;
	margin: 0 auto;
	position: relative;;
	margin-bottom: 50px;
}
.fb_icn {
	float: left;
}
.tw_icn {
	float: right;
}
#footer .inner {
	width: 90%;
	margin: 0 auto;
	height: auto;
	text-align: center;
}

#footer ul.ft-nav {
	width: 100%;
	margin: 20px 0 30px;
	display: table;
}
#footer ul.ft-nav li {
	width: 33.3%;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	line-height: 1.7;
}
#footer ul.ft-nav li a {
	color: #666;
	font-size: 87.5%;
}
#footer ul.ft-nav li a:hover {
	text-decoration: underline;
}
.ft-nav-right {
	float: right;
}
.copyright {
	font-size: 62.5%;
	line-height: 1.2;
	color: #666;
	float: left;
	width: 100%;
	padding: 48px 0px 20px;
	text-align: center;
}
.ft-nav-right li {
	padding: 0 0 0 10px;
}
.ft-l01 {
	margin-right: 15px;
}

#menu_shade {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000000;
	filter: alpha(opacity=0);
    -ms-filter: "alpha(opacity=0)";
    zoom: 1;
	opacity: 0;
	z-index: 500;
	display: none;
}
#side_menu {
	width: 48.4%;
	height: 100%;
	position: fixed;
	top: 0;
	right: -56%;
	background-color: rgba(238,238,238,0.90);
	z-index: 501;
}
#side_menu .menu_base {
	position: relative;
	margin: 0 auto;
	padding: 25% 0 0;
	width: 89%;
}
#side_menu .menu_base li {
	text-align: center;
}
#side_menu .menu_base .close {
	width: 18.6%;
	position: absolute;
	top: 20px;
	right: 5%;
}
#side_menu .menu_base .close img {
	width: 100%;
}


@media print {
	#president .shade {
		background-attachment: scroll, scroll, scroll;
		background-size: auto, auto, contain;
	}
	#message .shade {
		background-attachment: scroll, scroll, scroll;
		background-size: auto, auto, contain;
	}
}