@charset "UTF-8";

.b_main-contents p { letter-spacing: 0.08em }

.gnav { padding: 10px 0; text-align: left }
.gnav li { display: inline-block; border-right: solid 1px #dccc8f; padding: 0 8px }
.gnav li a { display: block; padding: 6px 24px }
.gnav li a:hover { background: #d8c57c }

.btit { margin: 0 0 40px }
.btit p { margin-top: 1em }

/* ccrecipe */
.c_recipe {
    width: 960px;
    margin: 0 auto;
    padding: 80px 0;
    position: relative;
}
.c_recipe-idx { margin: 0 -10px 40px }
.c_recipe-idx li.b_kurashiru__item { float: left; width: 50%; margin: 0 !important }
.c_recipe-idx li.b_kurashiru__item .c_recipe-inner { padding: 10px }
.c_recipe-idx li.b_kurashiru__item .c_recipe-inner .rpc { padding: 20px; background: #fff; box-shadow: 2px 2px 6px 0 #dea245; display: block }
.c_recipe-idx li.b_kurashiru__item .c_recipe-inner .rpc h3 { margin: 20px 0 0; text-align: left; }
.bnr-yamitsuki { margin: 0 0 20px; display: block }
.bnr-yamitsuki img.is-pc { display: block }
.bnr-yamitsuki img.is-sp { display: none }

/* tvcm */
.c_tvcm {
    width: 960px;
    margin: 0 auto;
    padding: 0 0 20px;
    position: relative;
}
.c_tvcm-idx { margin: 0 -10px }
.c_tvcm-idx li { float: left; width: 50% }
.c_tvcm-idx li .c_tvcm-inner { padding: 10px }
.c_tvcm-idx li .c_tvcm-inner h3 { margin: 20px 0 0 }
.secret-story { margin: 40px 0 0; padding: 0 0 20px; text-align: left; position: relative }
.secret-story h3 { padding: 0 0 10px; border-bottom: solid 1px #000000 }
.secret-story p { padding: 25px 25px 0; line-height: 2em }
.secret-story p.ex { display: none }
.btn-tvcm { width: 240px; position: absolute; right: 0; bottom: 0 }
.btn-tvcm a { display: block; padding: 10px 0; border: solid 2px #000; position: relative; text-align: center }
.btn-tvcm a .arw { position: absolute; right: 10px; top: 50%; margin-top: -5px }
.btn-tvcm a:hover { background: #fff }
.btn-tvcm a:hover .arw { margin-top: -4px; }

/* seimenhimitus */
.c_himitsu {
    width: 960px;
    margin: 0 auto;
    padding: 0 0 80px;
    position: relative;
}
.himitsu-cont { text-align: left }
.himitsu-column1 { width: 100% }
.himitsu-column2 { width: 50%; float: left; margin: 0 0 40px }
.himitsu-inner-l { padding: 0 20px 0 0 }
.himitsu-inner-r { padding: 0 0 0 20px }
.himitsu-cont h3 { margin: 0 0 20px -40px }
.himitsu-cont img.is-pc { display: block }
.himitsu-cont img.is-sp { display: none }
.himitsu-cont p { line-height: 2em; }
.himitsu-cont p.read { margin: 0 0 30px }
.ml-60 img { margin-left: -5%; width: 105% }

/*product*/
.b_lineup .btit { margin: 0 0 20px!important }
.btn-products { width: 80%; margin: 20px auto 0 }
.btn-products a { display: block; padding: 10px 0; border: solid 2px #000; position: relative }
.btn-products a .arw { position: absolute; right: 10px; top: 50%; margin-top: -7px }
.btn-products a:hover { background: #fff }
.btn-products a:hover .arw { right: 9px; }


.foot-bnrs { background: #fff; padding: 60px; border-bottom: 40px solid #be9c3e; }
.foot-bnrs a { display: inline-block; width: 45%; padding: 0 2.5% }


#lay-movie { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: url(../img/blk75.png); display: none; z-index: 1000 }
#lay-movie .close { position: absolute; right: 60px; top: 60px; cursor: pointer; z-index: 10 }
#lay-movie .mov { position: absolute; left: 50%; top: 50%; padding: 20px; background-color: #b8963b; margin: -270px 0 0 -480px; }

@media (max-width: 960px) {
	
	.btit { margin: 0 0 20px }
	
	/* ccrecipe */
	.c_recipe {
		width: 100%;
		padding: 80px 0;
	}
	
	/* tvcm */
	.c_tvcm {
		width: 100%;
		margin: 0 auto;
		padding: 0 10px 20px;
		position: relative;
	}
	
	/* seimenhimitus */
	.c_himitsu {
		width: 100%;
		margin: 0 auto;
		padding: 0 0 80px;
	}
	.himitsu-column1 { width: 100% }
	.himitsu-column2 { width: 100%; float: none; margin: 0 0 40px }
	.himitsu-inner-l { padding: 0 20px }
	.himitsu-inner-r { padding: 0 20px }
	.himitsu-column2 .vis { width: 80%; margin: 0 10% }
	.ml-60 img { margin-left: 0 }
	
	.foot-bnrs { padding: 30px 40px; border-bottom: 40px solid #be9c3e; }
	.foot-bnrs a { display: inline-block; width: 100%; padding: 10px 0 }
	
	#lay-movie .mov { padding: 15px; width: 768px; height: 432px; margin: -216px 0 0 -384px; }
	#lay-movie .mov iframe { width: 768px; height: 432px; }
    
}

@media (max-width: 768px) {
	
	.b_main-contents p { font-size: 14px !important }
	
	/* ccrecipe */
	.c_recipe {
		width: auto;
		padding: 40px 20px;
	}
	.c_recipe .btit img { height: 66px }
	.c_recipe .btit p img { height: 16px }
	.c_recipe-idx { margin: 0 0 20px }
	.c_recipe-idx li.b_kurashiru__item { float: none; width: 100%; margin: 0 !important }
	.c_recipe-idx li.b_kurashiru__item .c_recipe-inner { padding: 5px 0 }
	.c_recipe-idx li.b_kurashiru__item .c_recipe-inner .rpc { padding: 15px; }
	.c_recipe-idx li.b_kurashiru__item .c_recipe-inner .rpc h3 { margin: 15px 0 0; }
	.c_recipe-idx li.b_kurashiru__item .c_recipe-inner .rpc h3 img { height: 40px }
	.bnr-yamitsuki { margin: 0 0 10px; }
	.bnr-yamitsuki img.is-pc { display: none }
	.bnr-yamitsuki img.is-sp { display: block }
	
	/* tvcm */
	.c_tvcm {
		width: auto;
		padding: 0 10px 10px;
		position: relative;
	}
	.c_tvcm .btit img { height: 24px }
	.c_tvcm-idx { margin: 0 }
	.c_tvcm-idx li { float: left; width: 100% }
	.c_tvcm-idx li .c_tvcm-inner { padding: 10px 0 }
	.c_tvcm-idx li .c_tvcm-inner h3 { margin: 10px 0 0 }
	.c_tvcm-idx li .c_tvcm-inner h3 img { height: 15px }
	.secret-story { padding: 0 0 30px }
	.secret-story p { padding: 10px 10px 0; line-height: 2em }
	.btn-tvcm { width: 180px; right: 50%; margin-right: -90px  }
	.btn-tvcm a { padding: 8px 0; }
	.btn-tvcm a .arw { absolute; right: 5px; }
	
	/* seimenhimitus */
	.c_himitsu {
		width: auto;
		padding: 0 20px 40px;
	}
	.c_himitsu .btit img { height: 56px }
	.himitsu-column1 { width: 100% }
	.himitsu-column2 { width: 100%; margin: 0 0 20px }
	.himitsu-inner-l { padding: 0 }
	.himitsu-inner-r { padding: 0 }
	.himitsu-column2 .vis { width: 90%; margin: 0 5% }
	.himitsu-cont h3 { margin: 0 0 12px -20px }
	.himitsu-cont h3 img { height: 75px }
	.himitsu-cont img.is-pc { display: none }
	.himitsu-cont img.is-sp { display: block }
	.himitsu-cont p { line-height: 1.8em; }
	.himitsu-cont p.read { margin: 0 0 20px }
	.himitsu-cont p.read img { width: 100%; height: auto }
	.ml-60 img.vis { width: 100%; margin: 0 auto }
	
	/* products */
	.b_lineup .btit img { height: 46px }
	.btn-products { width: 140%; margin: 10px -20% 0 }
	.btn-products a { padding: 8px 0; border: solid 2px #000; }
	.btn-products a .arw { position: absolute; right: 5px; top: 50%; margin-top: -7px }
	
	.foot-bnrs { padding: 20px 30px; border-bottom: 20px solid #be9c3e; }
	
	#lay-movie .close { right: 10px; top: 10px; width: 40px; }
	#lay-movie .mov { padding: 0; width: 320px; height: 180px; margin: -90px 0 0 -160px; }
	#lay-movie .mov iframe { width: 320px; height: 180px; }
   
}