@charset "Shift_JIS";

* {
	margin: 0;
	padding: 0;
}

/* ヘッダフッタ切り替え */

div.pcHead,
div.pcFoot,
div.pcGnav {
	display: block;
}

div.spHead,
div.spFoot,
div.spGnav {
	display: none;
}


#wrap {
	width:950px;
	padding: 0 0 10px;
}

#wrap .linkTop{
	display: none;
}

.center { text-align: center; }

span.txtDeco01{
	font-weight:bold;
	color: #cc0000;
}


#column {
	width: 950px;
	margin: 0 auto;
	text-align: left;
}

#column .contents {
	margin-bottom: 20px;
	padding: 0 0;
	padding-bottom: 5px;
/*	background: url(../img/bg_contents.gif) repeat-y;*/
}

#column img { border:none; }
/*
#column h3,
#column h2 {
	text-align: center;
	line-height: 0;
}
#column h3 { margin: 0 0 5px; }
*/
#column .columnArea02 {
	width: 920px;
	margin: 0 auto 20px;
	padding: 8px 0 0;
/*	background: url(../img/bg_column_top.gif) no-repeat center top;*/
}

#column .title_saketomo > h1 {
	font-size: 20px;
	font-weight: bold;
	padding: 15px 0 0;
	margin: 0 auto;
}

#column .title_saketomo{
	margin-bottom: 20px!important;
}

@-moz-document url-prefix() {
/*
#column .columnArea {
	width: 920px;
	margin: 0 auto 20px;
	padding: 35px 0 0;
	background: url(../img/bg_column_top.gif) no-repeat center top;
}
*/
	#column .columnArea02 {
		width: 920px;
		margin: 0 auto 20px;
		padding: 8px 0 0;
		background: none;
	}
}
/*
.bnr_sp201607 {
	margin: 0 15px 20px;
}
@media screen and (max-width: 640px) {
	.bnr_sp201607 {
		margin: 0;
	}
}
*/
/*バックナンバー start*/

#column .columnArea02 .columnAreaBgBottom{
	background:none;
	padding-bottom:18px;
}

#column .columnArea02 .columnAreaBgBottom .bknumber{
/*	padding: 10px 13px 0 18px;*/
	padding: 10px 0 0 0;
	background: none;
	position:relative;
}

#column .columnArea02 .columnAreaBgBottom .bknumber h2 {
	margin: 0;
	padding:0 0 6px 8px;
	text-align: left;
}

#column .columnArea02 .columnAreaBgBottom .bknumber h2 img{
	width:170px;
}

#column .columnArea02 .columnAreaBgBottom .bknumber p.btn{
	position:absolute;
	right:24px;
	top:27px;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul{
	list-style-type:none;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li{
	margin-right:5px;
	margin-bottom:5px;
	float:left;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li.last{
	margin-right:0;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li p{
	width:190px;
	margin:0 auto;
	-ms-interpolation-mode:bicubic;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li p.pic{
	padding-top:15px;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li{
	background:none;
	width:217px;
	height:205px;
}
#column .columnArea02 .columnAreaBgBottom .bknumber ul li.special {
    background: none;
}

/*バックナンバー end*/
/*
#column .columnArea .inner {
	padding: 0 0 75px;
	font-size: 16px;
	background: url(../img/bg_column_bottom.gif) no-repeat center bottom;
}

#column .columnArea02 .inner02 {
	padding: 0 0 64px;
	font-size: 16px;
	background: url(../img/bg_column_bottom02.gif) no-repeat center bottom;
}

#column .columnArea .inner .columnTxt01,
#column .columnArea02 .inner02 .columnTxt01 {
	padding: 0 65px 0 41px;
	background: url(../img/bg_column.gif) repeat-y;
}

#column .columnArea .inner .columnTxt01 .leftArea,
#column .columnArea02 .inner02 .columnTxt01 .leftArea{
	float: left;
}

#column .columnArea .inner .columnTxt01 .rightArea,
#column .columnArea02 .inner02 .columnTxt01 .rightArea{
	float: left;
	padding: 19px 0 0 14px;
	width: 350px;
}

#column .columnArea .inner .columnTxt01 .rightArea p,
#column .columnArea02 .inner02 .columnTxt01 .rightArea p{
	padding: 5px 0 0;
	line-height: 2.5;
	background: url(../img/border_01.gif) repeat-y;
}

#column .columnArea .inner .columnTxt02 {
	width: 788px;
	margin:10px 0 0 26px;
	padding: 1px 0 0;
	background: url(../img/border_02.gif) no-repeat center top;
}

#column .columnArea .inner .columnTxt02 p,
#column .columnArea02 .inner02 .vol2columnTxt02 p {
	padding: 2px 0 0;
	line-height: 2.5;
	background: url(../img/border_03.gif) repeat-y;
}

#column .columnArea02 .inner02 .vol2columnTxt02 {
	width: 788px;
	margin: 18px 0 0 26px;
	padding: 1px 0 0;
	background: url(../img/border_02.gif) no-repeat center top;
}
*/
#column .recipeArea {
	margin: 0 0 30px;
	padding: 6px 0 0;
	background: url(../img/bg_recipe_top.gif) no-repeat center top;
}

#column .recipeArea .inner {
	padding: 0 0 6px;
	background: url(../img/bg_recipe_bottom.gif) no-repeat center bottom;
}
/*
#column .recipe_list {
	width:910px;
	margin: 0 auto;
	padding: 0 15px 10px;
	border-left: 1px solid #ded8c9;
	border-right: 1px solid #ded8c9;
	background: #f8f5ea;
}
#column .recipe_list table {
	border-collapse:collapse;
	border-spacing:0;
}

#column .recipe_list td {
	width:202px;
	padding: 7px 0 0 10px;
	font-size:12px;
	background:url(../img/bg_img.gif) no-repeat;
	vertical-align:top;
}
#column .recipe_list td.empty {
	background:none;
	padding:0;
}

#column .recipe_list td a {
	display: block;
	border:none;
	text-decoration:none;
}

#column .recipe_list td a img {
	display:block;
	margin: 0 0 5px;
}
#column .recipe_list td a:hover img {
	filter: alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.7;
}
#column .recipe_list td p {
	width: 202px;
	margin: 0 0 5px;
	line-height: 1.4;
	font-size: 14px;
}
#column .recipe_list td a span {
	background: url(../img/btm_line.gif) repeat-x bottom left;
	display:inline;
	line-height:1.8em;
	text-decoration:none;
	padding-bottom:5px;
	border:none;
}

#column .recipe_list td p a {
	background: url(../img/btm_line.gif) repeat-x bottom left;
	display:inline;
	line-height:1.8em;
	padding-bottom:5px;
}
*/

/* 仕様変更 */
.columnTxtArea .recipeImg {
	padding: 0 14px 0 0;
	width:450px;
	height:316px;
}
.columnTxtArea .recipeTitle{
	width:350px;
	height:70px;
}
.columnTxtArea h3 { padding: 19px 0 0 14px; }
.columnTxtArea p {
	line-height: 2.5;
	margin: 0 0 0 26px;
	padding:4px 0 0 0;
	background: url(../img/border_03.gif) repeat-y;
}


/* mouseover */
#column a:hover img {
	-moz-opacity:0.8;
	opacity:0.8;
	filter: alpha(opacity=80);
}

/* new clearfix */
.clearFix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearFix             { zoom: 1; } /* IE6 */
*:first-child+html .clearFix { zoom: 1; } /* IE7 */




/*バックナンバーページ PC*/
#column.column_bn{
	font-size:14px;
	line-height:1.4;
}

#column.column_bn .column_bn_title{
	width:462px;
	margin:0 0 20px 20px;
	padding-top:20px;
	text-align:left;
	overflow:hidden;
	_zoom:1;
	float: left;
}
#column.column_bn .ttl {
	float:none;
}
#column.column_bn .column_bn_ttl2 {
	width:310px;
	float:left;
	margin:20px 0 0 20px;
	padding-top:20px;
}
#column.column_bn .column_bn_ttl2 .ttl2{
	width: 100%;
}
#column.column_bn .bknumber{
	font-family: Helvetica,Arial,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	width:890px;
	margin:auto;
	padding: 0;
	background: none;
	overflow:hidden;
	_zoom:1;
}
#column.column_bn .bknumber ul li{
	display: none;
	margin-bottom:10px;
}

#column.column_bn h3.category{
	font-size: 16px!important;
	font-weight: bold!important;
	color: #FFF!important;
	line-height: 1!important;
	background-color: #bb936c!important;
	margin:0 0 10px!important;
	padding: 0.5em 1em!important;
	clear: both!important;
	text-align: left!important;
}

/*リスト*/
#column.column_bn .bknumber ul{
	clear:both;
	list-style-type:none;
	margin-right:-26px;
}

#column.column_bn .bknumber ul li{
	width:202px;
	margin-right:26px;
	float:left;
}
#column.column_bn.bknumber ul li.last{
	margin-right:0;
}
#column.column_bn .bknumber ul li a{
	color:#000;
	text-decoration: none;
}
#column.column_bn .bknumber ul li .pic{
	display:block;
	margin-bottom:5px;
	padding:0;
	background:#000;
	border:1px solid #000;
}



/*バックナンバーページ検索*/
#column.column_bn .searchBox{
	margin:0 0 10px 30px;
	padding: 0;
	line-height: 1;
}
#column.column_bn .searchBox .icon{
	height: 30px;
	float: left;
}
#column.column_bn .searchBox form .btn{
	height: 30px;
	display: inline;
	float: none;
	margin: 0;
}
#column.column_bn .searchBox form .txtBox{
	width: 310px;
	border: 1px solid #CCC;
	height: 28px;
	padding:0 10px;
}
#column.column_bn .searchBox form input{
	top:0;
}
#column.column_bn .searchBox form input:focus::placeholder {
	color: transparent;
}

/*スライドボタン*/
.open_slide_btn{
	width: 150px;
	height: 30px;
	background: url(../img/bn_btn_open.png) no-repeat left top;
	cursor: pointer;
	float: right;
	margin-bottom: 20px;
}

/*SD缶体注釈*/
.comment_sd {
	margin-left: 25px;
	margin-bottom: 10px;
	margin-top: -15px;
}

/*バックナンバーページ PC*/

















/* SP---------------------------------------------------------- */
@media screen and (max-width: 640px) {

/* ヘッダフッタ切り替え */

div.spHead,
div.spFoot,
div.spGnav {
	display: block;
}

div.pcHead,
div.pcFoot,
div.pcGnav {
	display: none;
}

div.spGnav p {
	border-bottom: 1px solid #ffffff;
}

div.spGnav ul {
	margin: 0 0 15px;
	overflow: hidden;
}

div.spGnav li {
	float: left;
	list-style: none;
	width: 50%;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #ffffff;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

div.spGnav li a {
	display: block;
	padding: 10px 0;
	background: -webkit-gradient(linear,
			center top,
			center bottom,
			from(#484445),
			color-stop(0.4, #908c8b),
			color-stop(0.5, #8e8d8b),
			color-stop(0.51, #241c1a),
			color-stop(1, #2e2a29));
	font-size: 70%;
	color: #ffffff;
	text-decoration: none;
}

div.spGnav li:nth-child(odd) {
	border-right: 1px solid #ffffff;
}

/*Responsive*/

#wrap{
	width:auto;
	padding:0;
}

#wrap .linkTop{
	display: block;
	position:absolute;
	top:0;
	width:100%;
	z-index:100;
}

#wrap .linkTop a{
	display: block;
	width:100%;
	margin-top:8%;
}

/*Header*/
#headerCoverUp #header h1,
#headerCoverUp #header .myrecipe,
#headerCoverUp #header .my_txt,
#headerCoverUp #header .ps_txt{
	display:none;
}

#headerCover{
	background:url(../img/bg_sp.jpg) repeat;
	padding:8% 0 0 0;
	margin:0;
	width:100%;
}

#headerCover #header{
    height: 0;
    width:100%;
    padding-top: 16%;
	background:url(../img/main_img_header.png) 0 0 no-repeat;
    background-size: contain;
}

#headerCover #searchAreaCover{
	width:100%;
	margin:0;
	background: url(../img/bg_sp.jpg) repeat;
}

/*navi UL*/
#searchAreaCover #pageNavi{
	margin:0;
}

#searchAreaCover #pageNavi ul{
	padding:0 0 5px 5%;
}

#searchAreaCover #pageNavi ul li{
	float:none;
}

#searchAreaCover #pageNavi ul li:first-child,
#searchAreaCover #pageNavi ul li:nth-child(2),
#searchAreaCover #pageNavi ul li:nth-child(3){
	display:none;
}

#searchAreaCover #pageNavi ul li div ul li:first-child,
#searchAreaCover #pageNavi ul li div ul li:nth-child(2),
#searchAreaCover #pageNavi ul li div ul li:nth-child(3){
	display:block;
}

#searchAreaCover #pageNavi ul li:nth-child(4){
	float: left !important;
}

/*column*/
#column{
	width:auto;
	margin:auto;
}
/*
#column .columnTxtArea .recipeImg{
	padding:0;
}
*/
#column .contents{
	background: none;
	padding:0;
}

#column .columnArea02{
	width:auto;
	margin:0;
	padding:0;
	background:none;
}

#column .columnArea02 .inner02,
#column .columnArea02 .inner02 .columnTxt01,
#column .columnArea02 .columnAreaBgBottom{
	background:none;
	padding:0;
}

#column .title_saketomo {
	margin-bottom:10px !important;
}
#column .title_saketomo > h1 {
		width: 100%;
		/* width: 60%; */
		margin: 0;
		padding: 1.5% 0 0;
		font-size: .75em;
		line-height: 1.2;
		text-align: center;
		clear: both;
}

/*
#column h2 img{
	display:none;
}
*/

#column h2{
/*
	background:url(../img/header_bnr_sp.gif) 0 0 no-repeat;
	padding-top: 19%;
*/
	padding-bottom: 0;
	background-size: contain;
}
/*
#column .columnTxtArea h3 img{
	padding:0 0 3% 5%;
	width:95%;
}

#column .columnTxtArea p{
	margin:0 5%;
}

.columnTxtArea .recipeImg,
.columnTxtArea .recipeTitle{
	width:100%;
	height:auto;
}
*/

/*recipe*/
#searchArea,
#column h3:nth-child(3),
#column h3:nth-child(5),
#column .recipeArea{
	display:none;
}

/*back number*/
#column .columnArea02 .columnAreaBgBottom .bknumber{
	background: url(../img/bk_bg_sp.gif);
	position:static;
	margin: 0 0 5%;
	padding:5% 5% 10%;
}

#column .columnArea02 .columnAreaBgBottom .bknumber h2 {
	padding:0 0 1% 0;
	margin-bottom: -4%;
}

#column .columnArea02 .columnAreaBgBottom .bknumber h2 img{
	width:58%;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li{
	width:100%;
	background: url(../img/bk_border_sp.png);
	background-size:100%;
	height:auto;
	margin:6% 0;
	float:none;
}
#column .columnArea02 .columnAreaBgBottom .bknumber ul li.special {
	background-size: 100% 100%;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li p{
	width:85%;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li p.pic{
	padding-top:5%;
}

#column .columnArea02 .columnAreaBgBottom .bknumber ul li p.txt{
	padding:2% 0 4% 0;
}

#cfBanner {
	display:none;
}



/*詳細バックナンバー */



/*詳細バックナンバー */

/*バックナンバーページ SP*/
#column.column_bn .bknumber{
	width:90%;
	margin:0 auto 10px;
	padding: 0;
}
#column.column_bn .bknumber .column_bn_ttl2 {
	width: 100%;
}
#column.column_bn .bknumber .column_bn_ttl2 > img.ttl2 {
	width: 100%;
}
#column.column_bn .bknumber h4{
	float:none;
	width:100%;
	margin-bottom:0.5em;
	text-align:center;
}
#column.column_bn .bknumber h4 img.ttl2{
	width:80%
}
#column.column_bn .bknumber p.btn{
	width:100%;
	float:none;
	text-align:right;
	margin-bottom:10px;
}
#column.column_bn .bknumber p.btn img{
	width:200px;
}

#column.column_bn .column_bn_title{
	width:100%;
	margin:0 0 10px;
	padding-top:10px;
	text-align:center;
	overflow:hidden;
	_zoom:1;
	float: none;
}
#column.column_bn .ttl {
	float:none;
	margin: 0 5% 0;
	width: 90%;
}
#column.column_bn .column_bn_ttl2 {
	width: 100%;
	float:none;
	margin:0 0 10px;
	padding-top:0;
}
#column.column_bn .column_bn_ttl2 .ttl2{
	width: 90%;
}

/*リスト*/
#column.column_bn .bknumber ul{
	margin-right:auto;
	width: 100%;
}

#column.column_bn .bknumber ul li{
	width: 49%;
	min-height: 150px;
	margin: 0 2% 4% 0;
}
#column.column_bn .bknumber ul li:nth-of-type(even){
	margin: 0 0 3% 0;
}
#column.column_bn .bknumber ul li .pic{
	margin-bottom:0.2em;
}


/*バックナンバーページ検索*/
#column.column_bn .searchBox{
	margin:0 auto 10px;
	width: 90%;
}
#column.column_bn .searchBox .icon{
	height: 30px;
	float: none;
}
#column.column_bn .searchBox form input{
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;}
#column.column_bn .searchBox form .btn{
	height: 30px;
}
#column.column_bn .searchBox form .txtBox{
	width: 59%;
	width: calc(98% - 112px);
	height: 28px;
	padding:0 1%;
}

/*スライドボタン*/
.open_slide_btn{
	background: url(../img/bn_btn_open_sp.png) no-repeat left top;
	background-size: contain;
}
/*バックナンバーページ SP*/

/*SD缶体注釈*/
.comment_sd {
	margin-left: 10px;
	font-size: 3.6vw;
}

}