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

/*共通・汎用*/

p,
ul li {
	letter-spacing: 0.1rem;
	}
	
.drop {
 padding-left: 1em;
 text-indent: -1em;
}

.sub{
	font-size: 1.4rem;
	vertical-align: text-bottom;
}

.red {
 color: #f01e00;
}

.w700 {
	font-weight: 700;
}
.w800 {
	font-weight: 800;
}

.pt30 {
	padding-top: 30px;
}

.pt60 {
	padding-top: 60px;
}

.pb10 {
	padding-bottom: 10px;
}

.pl18 {
	padding-left: 18px;
}


.p-border {
	padding-bottom: 20px;
	border-bottom: 1px solid #3c3232;
}

.t-border {
	padding-bottom: 30px;
	border-bottom: 1px solid #3c3232;
}

main {
	display: block;
}

a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  -webkit-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}


.movie {
	position: relative;
	padding-bottom: 56.25%;
	overflow: hidden;
	width: 580px;
	height: 0px;
}

.movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/*テーブル組用*/
table {
	border-collapse: collapse;
	line-height: 1.5;
	margin-top: 8px;	
}

table th {
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 8px;
    vertical-align: top;
    border: 2px solid #635b5b;
}

table td {
    padding-top: 12px;
    padding-right: 12px;
    padding-left: 12px;
    padding-bottom: 8px;
    vertical-align: top;
    border: 2px solid #635b5b;
				background-color: #FFFFFF;			
}
table .bd1 {
	border-bottom-style: none;
}
table .bd2 {
	border-top-style: none;
	border-right: none;
	border-bottom: none;
}
table .bd3 {
	border-left: none;
}
table .bd4 {
	border-top-style: none;
	border-right: none;
}
table .bd5 {
	border-left: none;
}


/*リスト組用*/
ul .check {
 text-indent: -1.3em;
 padding-left: 1.3em;
}

ul .check:before {
 content: "\f058";
 position: relative;
 font-family: FontAwesome;
 margin-right: 0.4em;
}

ul .no {
	text-indent: -1.3em;
	padding-left: 1.3em;
}

ul .dno {
	text-indent: -1.2em;
	padding-left: 1.2em;
}


ul .maru {
 text-indent: -1.3em;
 padding-left: 1.3em;
}

ul .maru:before {
 content: "\f111";
 position: relative;
 font-family: FontAwesome;
 margin-right: 0.4em;
}


/*ヘッダー*/
header {
	background-image: url(../img/header_bg.png);
	background-repeat: repeat-x;
	background-position: top center;
	text-align: center;
}

.top .top-title {
	width: 600px;
	height: 728px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	background-image: url(../img/top_ph1.jpg);
	background-repeat: no-repeat;
	background-size: 466px auto;
	background-position: bottom 77px left 105px;
}

.top .top-title .nisshokus img {
	width: 140px;
	position: absolute;
	top: 80px;
	left: 0px;
}

.top .top-title .age img {
	width: 139px;
	position: absolute;
	top: 102px;
	right: 0px;
}

.top .top-title .obi img {
	width: 490px;
	position: absolute;
	top: 80px;
	left: 0px;
}

.top .top-title h1 img {
	width: 517px;
	position: absolute;
	top: 211px;
	left: 42px;
}

.top .top-title .copy img {
	width: 516px;
	position: absolute;
	left: 42px;
	bottom: 30px;
}


.cont .nisshokus img {
	text-align: center;
	padding-top: 83px;
	width: 113px;
}

.cont h1 img {
	text-align: center;
	padding-top: 12px;
	width: 356px;
}


/*TOP用*/
.feature {
	background-image: url("../img/bg1.png");
	background-repeat: repeat;
	padding-top: 30px;
	padding-bottom: 30px;
}
.feature .waku-tb {
	width: 580px;
	height: 30px;
	margin-left: auto;
	margin-right: auto;
	line-height: 0;
}

.feature .waku {
	background-image: url("../img/waku2.png");
	background-repeat: repeat;
	width: 580px;
	margin-left: auto;
	margin-right: auto;
}
.feature .waku h2 {
	font-size: 3.0rem;
	color: #6c3400;
	line-height: 1.1;
	text-align: center;
	font-weight: 800;
}
.feature .waku h2 span {
	font-size: 4.5rem;
	margin-right: -7px;
	vertical-align: -5%;
}

.feature .waku ul {
	width: 540px;
	margin-left: auto;
	margin-right: auto;
}

.feature .waku ul li {
	font-size: 2.4rem;
	line-height: 1;
	font-weight: 700;
	color: #6c3400;
	border-bottom: 2px dashed #FFFFFF;
	padding-top: 15px;
	padding-bottom: 15px;
}

.feature .waku ul li:before {
	font-size: 3.1rem;
	content: "\f005";
	position: relative;
	font-family: FontAwesome;
	margin-right: 0.3em;
	color: #fa7800;
	vertical-align: middle;
}

.info {
	width: 580px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 30px;
	padding-bottom: 50px;
}

.info h2 {
	font-size: 4.2rem;
	font-weight: 800;
	text-align: center;
	line-height: 1;
	color: #6c3400;
	padding-top: 45px;
}

.info h2 span {
	font-size: 3.0rem;
	vertical-align: baseline;
}

.info .box1 {
	width: 580px;
	margin-top: 40px;
	position: relative;
	background-image: url(../img/top_ph2.jpg);
	background-repeat: no-repeat;
	background-size: 180px auto;
	background-position: right top;
	padding-bottom: 93px;
}

.info .box1 p {
	width: 387px;
	margin-bottom: 0px;
}

.info .box1 .obi img {
	width: 580px;
	position: absolute;
	right: 0px;
	bottom: 0px;
}

.info .box2 {
	width: 580px;
	padding-top: 30px;
}

.info .box3 {
	width: 580px;
	margin-top: 30px;
	position: relative;
	background-image: url(../img/top_ph3.jpg);
	background-repeat: no-repeat;
	background-size: 206px auto;
	background-position: left top;
}

.info .box4 {
	width: 580px;
	margin-top: 30px;
	position: relative;
	background-image: url(../img/top_ph4.jpg);
	background-repeat: no-repeat;
	background-size: 206px auto;
	background-position: left top;
}

.info .box3 h3, 
.info .box4 h3 {
	width: 380px;
	color: #f6aa00;
	font-size: 2.6rem;
	font-weight: 700;
	margin-left: auto;
}

.info .box3 p, 
.info .box4 p {
	width: 380px;
	margin-bottom: 0px;
	margin-left: auto;
}

.info .product_btn img {
	width: 580px;
	padding-top: 20px;
}


/*レシピ用*/
.colorkihona {
	background-color: #eb6d4e;
}
.colorkihonb {
	background-color: #fce9e4;
}
.color56a {
	background-color: #fa9b1e;
}
.color56b {
	background-color: #fef0dd;
}
.color78a {
	background-color: #f06e8c;
}
.color78b {
	background-color: #fde9ee;
}
.color911a {
	background-color: #5aaae6;
}
.color911b {
	background-color: #e6f2fb;
}
.color12a {
	background-color: #905ca2;
}
.color12b {
	background-color: #eee7f1;
}

.recipe-intro {
	margin-top: 30px;
	background-image: url(../img/recipe_bg.gif);
	background-repeat: repeat;
}

.recipe-intro .recipe-title {
	text-align: center;
	padding-top: 30px;
	padding-bottom: 30px;
	line-height: 1;
}

.recipe-intro .recipe01 img {
	width:281px;
}

.recipe-intro .recipe02 img {
	width:250px;
}

.recipe-intro .recipe03 img {
	width:251px;
}

.recipe-intro .recipe04 img {
	width:299px;
}

.recipe-intro .recipe05 img {
	width:293px;
}

.recipe-intro .catch {
	font-size: 2.8rem;
	color: #FFFFFF;
	font-weight: 700;
	padding-top: 25px;
}

.recipe-intro .age {
	position: relative;
	font-size: 2.7rem;
	font-weight: 700;
	padding-top: 17px;
	width: 580px;
	height: 57px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	margin-top: 27px;
	border-radius: 10px;
}

.recipe-intro .age img {
	position: absolute;
	width: 58px;
	top: -7px;
	left: 5px;
}

.recipe-intro .intro {
	width: 580px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
}

.recipe-intro .intro-mov {
	width: 580px;
	padding-bottom: 30px;
	margin-left: auto;
	margin-right: auto;
}


.recipe {
	background-image: url(../img/recipe_bg.gif);
	background-repeat: repeat;
	padding-bottom: 50px;
}

.recipe h2 {
	font-size: 3.6rem;
	font-weight: 800;
	color: #FFFFFF;
	text-align: center;
	padding-top: 11px;
	padding-bottom: 11px;
}

.recipe .mainimg {
	width: 640px;
	margin-left: auto;
	margin-right: auto;
}

.recipe .mainimg img {
	width: 100%;
}

.recipe .meyasu table {
	width:100%;
}

.recipe .meyasu table td {
	text-align: center;
	vertical-align: middle;
}

.recipe .meyasu table .tya {
	background-color: #98714c;
	color: #FFFFFF;
}

.recipe .meyasu table .pink {
	background-color: #fbe2dc;
}


.cooking {
	width: 580px;
	margin-left: auto;
	margin-right: auto;
}

.cooking h3 {
	font-size: 2.6rem;
	padding-top: 20px;
}

.cooking .making img {
	width: 100%;
	padding-top: 10px;
	padding-bottom: 12px;
}

.cooking .cooking-note {
	color: #f01e00;
	padding-top: 20px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 20px;
	border: 2px solid #f01e00;
	border-radius: 10px;
	margin-top: 30px;
	background-color: #FFFFFF;
}

.cooking .handling-note {
	padding-top: 20px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 20px;
	border: 2px solid #323c32;
	border-radius: 10px;
	margin-top: 30px;
	background-color: #FFFFFF;
}

.cooking .cooking-note h3,
.cooking .handling-note h3 {
	padding-top: 0px;
}


/*製品詳細用*/
.product {
	background-image: url(../img/recipe_bg.gif);
	background-repeat: repeat;
	padding-bottom: 50px;
	margin-top: 30px;
}

.product .package {
	padding-top: 30px;
	text-align: center;
	width: 590px;
	margin-left: auto;
	margin-right: auto;
}

.product .package img {
		width: 100%;
}

.product .txt {
	padding-top: 30px;
	width: 580px;
	margin-left: auto;
	margin-right: auto;
}

.product .txt .example {
	padding-top: 5px;
	width: 540px;
	margin-left: auto;
	margin-right: auto;
}

.product .txt .example img {
	width: 540px;
}

.product .txt table {
	width: 100%;
}

.product .txt h3 {
	font-size: 2.6rem;
	margin-top: -15px;
}


/*フッター*/
footer {
	padding-bottom: 20px;
}

footer .menu-title {
	background-color: #82c878;
	width: 100%;
	height: 80px;
}

footer .menu-title h2 {
	width: 580px;
	height: 80px;
	position: relative;
	font-size: 4.0rem;
	font-weight: 800;
	color: #FFFFFF;
	text-align: center;
	padding-top: 4px;
	background-color: #82c878;
	margin-left: auto;
	margin-right: auto;
}

footer .menu-title h2 img {
	position: absolute;
	width: 110px;
	top: -20px;
	left: 0px;
}

footer .recipe-menu {
	background-color: #fff5e6;
	text-align: center;
	padding-bottom: 30px;
}

footer .recipe-menu .arrange img {
	width: 518px;
	position: relative;
	padding-top: 25px;
}

footer .recipe-menu .recipe-link {
	width: 580px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
}

footer .recipe-menu .recipe-link h3 a img {
	width: 275px;
}

footer .recipe-menu .recipe-link .link1 {
	position: relative;
	margin-top: 15px;
}

footer .recipe-menu .recipe-link .link1 p img {
	width: 159px;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
}

footer .recipe-menu .recipe-link .sbt img {
	width: 580px;
}

footer .recipe-menu .recipe-link .link2 {
	position: relative;
	margin-top: 75px;
	width: 275px;
	float: left;
}

footer .recipe-menu .recipe-link .link3 {
	position: relative;
	margin-top: 75px;
	width: 275px;
	float: right;
}

footer .recipe-menu .recipe-link .link4 {
	position: relative;
	margin-top: 85px;
	width: 275px;
	float: left;
}

footer .recipe-menu .recipe-link .link5 {
	position: relative;
	margin-top: 85px;
	width: 275px;
	float: right;
}

footer .recipe-menu .recipe-link .link2 p img,
footer .recipe-menu .recipe-link .link3 p img,
footer .recipe-menu .recipe-link .link4 p img,
footer .recipe-menu .recipe-link .link5 p img {
	width: 275px;
	position: absolute;
	top: -55px;
	left: 0px;
	z-index: 1;
}


footer .recipe-menu .recipe-link .link2top,
footer .recipe-menu .recipe-link .link3top, 
footer .recipe-menu .recipe-link .link4top {
	width: 580px;
	padding-left: 20px;
	padding-top: 10px;
}

footer .recipe-menu .recipe-link .link2top img,
footer .recipe-menu .recipe-link .link3top img,
footer .recipe-menu .recipe-link .link4top img {
	width: 560px;
}

footer .recipe-menu .recipe-link .link5top {
	width: 420px;
	padding-left: 20px;
	padding-top: 10px;
	margin-left: auto;
	margin-right: auto;
}

footer .recipe-menu .recipe-link .link5top img {
	width: 400px;
}

footer .link {
	width: 593px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 30px;
	text-align: center;
}

footer .link li {
	margin-bottom: 20px;
}

footer .link li a {
	color: #f573b4;
	font-size: 3.0rem;
	text-decoration: none;
	display: block;
	width: 593px;
	height: 80px;
	padding-top: 13px;
}


footer .copy {
	text-align: center;
	font-size: 1.8rem;
	vertical-align: bottom;
	color: #808071;
	padding-top: 20px;
}

footer .copy img {
	width: 53px;
	height: auto;
	margin-right: 10px;
	padding-bottom: 30px;
}

/*上へ戻るボタン調整用*/

#topcontrol {
	z-index: 9999;
}


@media only screen and (max-width:640px) {
body {
	width: 640px;
}
.pc { display:none; }
.sp { display: block; }
}
