@charset "UTF-8";
/* --------------------------------
 * osusume_coop
 * -------------------------------- */

/* 基本スタイル */
.fwB{
	font-weight: bold;
}
.taR{
	text-align: right;
}
@media screen and (max-width: 639px) {
	/* brを利かせるようにする!!!!! */
	br{
    		display: block !important;
	}
	/* スマホだけの余白 */
	.spmb10{
		margin-bottom: 10px !important;
	}
}

/* 印刷 */
@media print{
 .spOnly{
	 display:none !important;
 }
}
/* 基本スタイル */
.fwB{
	font-weight: bold;
}
.mt00{
        margin-top: 0 !important;
}
.mt10{
        margin-top: 10px !important;
}
.mt20{
        margin-top: 20px !important;
}
.mt30{
        margin-top: 30px !important;
}
.mt40{
        margin-top: 40px !important;
}
.ml00{
        margin-left: 0 !important;
}
.ml10{
        margin-left: 10px !important;
}
.mb00{
        margin-bottom: 0 !important;
}
.mb05{
        margin-bottom: 5px !important;
}
.mb10{
        margin-bottom: 10px !important;
}
.mb15{
        margin-bottom: 15px !important;
}
.mb20{
        margin-bottom: 20px !important;
}
.mb30{
        margin-bottom: 30px !important;
}
.mb40{
        margin-bottom: 40px !important;
}
.mr10{
        margin-right: 10px !important;
}
.em08{
	font-size: 0.8em;
}
.taC{
	text-align: center;
}
.taL{
	text-align: left;
}
.taR{
	text-align: right;
}
.fwB{
	font-weight: bold;
}
.org{
	color: #FF8000;
}

/* 余白調整 */
.commonPage__img__default{
	margin-bottom: 20px;
}
.commonPage__img__default.mb00{
        margin-bottom: 0px;
}
.commonPage__img__default.mt00{
        margin-top: 0;
}
.mod__imgblockRight,
.mod__imgblockLeft{
	margin-top: 0;
}
.mod__modulewrap_m30_40.mb15{
        margin-bottom: 15px;
}

.mod__modulewrap_m30_40.mb00{
        margin-bottom:0 !important;
}
	@media screen and (max-width: 639px) {
		.mod__modulewrap_m30_40{
			margin: 0 3.355% 20px !important;
		}
		.mod__modulewrap_m30_40 .mod__imgblock{
			margin: auto 0 !important;
		}
	}

/* テキストの余白調整 */
.commonPage__POuter.mb20{
	margin-bottom: 20px;
}
.commonPage__POuter.mb30{
	margin-bottom: 30px;
}
.mod__imgblockText{
        margin-bottom: 10px;
}
.mod__imgblockText.mb00{
        margin-bottom:0 !important;
}
.mod__imgblockText.mb10{
        margin-bottom: 10px !important;
}
.mod__imgblockText.mb20{
        margin-bottom: 20px !important;
}
.mod__imgblockText.mb30{
        margin-bottom: 30px !important;
}
.mod__imgblockText.mb40{
        margin-bottom: 40px !important;
}
	@media screen and (max-width: 639px) {
		.commonPage__P{
			margin: 0 3.125% auto;
		}
		.commonPage__P.mb10{
			margin: 0 3.125% 10px;
		}
		.commonPage__P.mb30 {
    			margin-bottom: 30px;
		}
		.mod__imgblockText{
        		margin-top: 0;
    		}
		.mod__imgblockText.mb10{
			margin-bottom: 10px;
		}
		.commonPage__P.jcpClass.mb10{
			margin: 0 3.125% 10px;
		}
		.mod__modulewrap_m30_40 mb20 p.mod__imgblockText{
			margin-bottom: 10px !important;
		}
    	}

/* 文字サイズ調整（連合会との差分調整） */
.mod__imgblockText.em14{
	font-size: 1.0em !important;
}
	.mod__imgblockText span.em14{
		font-size: 1.6em !important;
		font-weight: bold;
	}
.mod__imgblockText.em12,
.mod__imgblockText span.em12{
	font-size: 1.4em !important;
	font-weight: bold;
}
.commonPage__P.jcpClass span.em08{
	font-size: 1.0em !important;
}
	@media screen and (max-width: 639px) {
		.mod__imgblockText span.em12{
			font-size: 1.1em !important;
			font-weight: bold;
		}
	}

/* キャプション */
.magazine .img__caption{
        margin: 0;
}
.magazine .img__caption .inner_caption{
	padding-bottom: 0;
}
/* メイン画像下キャプション */
.commonPage__img__default.imgMain{
	position: relative;
	overflow: visible;
	padding-bottom: 40px;
}
	@media screen and (max-width: 639px) {
		.commonPage__img__default.imgMain{
			padding-bottom: 0;
		}
	}
/* .commonPage__img__default.imgMain .inner_caption{
	margin: 5px 0 0 38%;
	padding: 0 5px 20px;
	position: absolute;
	top: 440px;
	width: 60%;
}*/
	@media screen and (max-width: 639px) {
		.magazine .img__caption{
        		margin: 0;
    		}
		.magazine .img__caption .inner_caption.w50, .magazine .right_caption .inner_caption.w50, .magazine .commonPage__POuter .inner_caption.w50{
	    		width: 50%;
			margin: auto;
		}
		/* メイン画像下キャプション */
		.commonPage__img__default.imgMain .inner_caption{
			left: 0;
		}
		/* 画像サイズ調整下のキャプション位置 */
		.magazine .img__caption .inner_caption{
			text-align: left !important;
		}
		.magazine .img__caption .inner_caption.taC{
			text-align: center !important;
		}
	}

/* 商品名・見出し */
h1.h1_product{
    margin: 0;
    padding: 0 !important;
    border-radius: 0;
}
	h1.h1_product img{
		width: 100%;
	}
.commonPage__h2{
	margin-top: 0 !important;
}
.mod__imgblockInner h3 {
	background: none;
	padding: 0 0 0 15px;
	margin:20px 0 10px;
	clear: both;
}
	@media screen and (max-width: 639px) {
		h1.h1_product{
		    margin: auto 3.355% !important;
		}
    		.jcp.commonPage__h2Outer{
        		padding-left: 0;
        		margin:0 3.355% 0;
    		}
		.splitContent__main h2 {
			margin: 0 0 10px !important;
		}
	}

/* メイン画像 */
.commonPage__img__default.imgMain{
	width: 100%;
}
	/* メイン画像下キャプション */
	.commonPage__img__default.imgMain p.small{
		font-size: .85em;0
		margin: 5px 0;
		padding: 0 5px 20px;
	}
	@media screen and (max-width: 639px) {
		.commonPage__img__default.imgMain.mb15{
			margin-bottom: 10px;
		}
	}
/* サブタイトル像 */
.commonPage__img__default.imgSub{
	width: 80%;
}
@media screen and (max-width: 639px) {
	.commonPage__img__default.imgSub{
		width: 90%;
	}
}

/* 画像フロートサイズ */
.mod__imgblockLeft mod__imgblockLeft--70{
	width: 60%;
}
mod__imgblockRight mod__imgblockRight--30{
	width: 38%;
}

/* リード */
.mod__imgblockText.lead{
	text-align: center;
	font-size: 1.1em;
	font-weight: bold;
	margin-bottom: 20px;
}
.commonPage__img__default.imgSub{
	margin-top: 0 !important;
	margin-bottom: 30px !important;
}
	@media screen and (max-width: 639px) {
		.mod__imgblockText.lead{
			text-align: left;
			font-size: 1.2em;
			margin: auto 3.355% 30px !important;
		}
		.commonPage__img__default.imgSub{
			margin-bottom: 15px !important;
			margin-top: 20px !important;
		}
	}
	/* リード文に画像を入れたとき */
	.mod__modulewrap_m30_40.w80{
		width: 80%;
		margin: auto;
	}
	.mod__imgblockLeft--70 {
		padding-top: 15px;
		max-width: 70%;
	}
		.mod__imgblockLeft--70 p.mod__imgblockText{
			text-align: left;
			/* font-size: 1.2em;*/
			/* font-weight: bold; */
		}
	/*.mod__imgblockRight--30 {
		max-width: 30%;
	}*/
	@media screen and (max-width: 639px) {
		.mod__modulewrap_m30_40.w80{
			margin: auto 3.5% 15px !important;
			width: 93%;
		}
		/* .mod__imgblockLeft{
			float: left;
		}
		.mod__imgblockRight{
			float: right;
		}*/
	}

/* 画像サイズ */
/* 全幅画像 */
.commonPage__img__default{
	width: 100%;
	margin: auto;
}
	.commonPage__img__default img{
	        width: 100%;
	        margin: 0 auto auto;
	}
	@media screen and (max-width: 639px) {
		.commonPage__img__default img{
		        margin-top: 0;
		}
	}
/* 画像2枚並べ */
.mod__imgblockLeft--50{
	width: 49%;
}
	@media screen and (max-width: 639px) {
		.mod__imgblockLeft--50{
			width: 100%;
		}
		.mod__imgblockImg img{
			float: none;
		}
	}
	/* 画像2枚並べ 微調整 */
	.mod__imgblockLeft.mod__imgblockLeft--50.w38{
		width: 38% !important;
	}
	.mod__imgblockRight.mod__imgblockRight--50.w60{
		width: 60% !important;
		max-width: 60% !important;
	}
		@media screen and (max-width: 639px) {
			.mod__imgblockLeft.mod__imgblockLeft--50.w38{
				width: 100% !important;
			}
			.mod__imgblockRight.mod__imgblockRight--50.w60{
				max-width: 100% !important;
				width: 100% !important;
			}
		}

	/* スマホで全幅以外で表示 */
	@media screen and (max-width: 639px) {
	    	.mod__imgblockRight{
	        	width: auto;
	    	}
		.mod__imgblockLeft--60 {
		    width: 100%;
		}
	    	.mod__imgblockImg img.w50{
	        	width: 50%;
	    	}
	    	.mod__imgblockImg img.w60{
	        	width: 60%;
	    	}
	    	.mod__imgblockImg img.w70{
	        	width: 70%;
	    	}
	    	.mod__imgblockImg img.w80{
	        	width: 80%;
	    	}
    		.mod__imgblockImg img.w50{
        		width: 50%;
    		}
	}

/* ※注記 */
ul.chuuki{
	-webkit-padding-start: 0px !important;
	margin-bottom: 30px !important;
}
	 ul.chuuki li:before {
		display: inline;
		/* content: "※"; */
	}
	/* ※ナンバー付き注記 */
	ul.chuuki li.komeNo {
		text-indent: -2.0em;
		padding-left: 2.0em;
		margin-bottom: 5px;
	}
ul.chuuki li,ul.chuuki li.star {
	list-style-type: none;
	text-indent: -3em;
	padding-left: 2em;
	list-style-type: none !important;
	font-size: 0.9em;
}
	ul.chuuki li.star:before {
		display: inline;
		content: "★";
	}
	@media screen and (max-width: 639px) {
		ul.chuuki li {
			font-size: 1.0em;
			margin: 0 3.355% 20px !important;
		}
	}

/* ページ内リンク */
.mod__anchorlist {
	list-style: none;
	background: #fff;
	padding-left: 0 !important;
}
	.mod__anchorlist > li {
 	   margin: 0 1%;
  	  font-size: 14px;
  	  text-align: left;
	}
		.mod__anchorlist > li > a {
			display: block;
			padding-bottom: 2px;
			text-decoration: underline;
		}
		ul.mod__anchorlist li img{
			vertical-align: middle;
		}
	@media screen and (max-width: 639px) {
		ul.mod__anchorlist li img {
			vertical-align: -25%;
			width: 5%;
			height: auto;
		}
	}

/* インデント */
.txt_idt{
	text-indent: -1.2em;
	padding-left: 1.2em;
}

/* コラム基本スタイル */
.commonPage__POuter.clm{
	border-radius: 20px;
        margin: 0 0 40px;
        padding: 20px 20px 10px;
	background-color:#72a529;
 }
	.clm .mod__imgblockInner h3{
		padding-left: 0;
	}
	/* タイトル画像 */
	.clm .commonPage__img__default img.w80{
		width: 80%;
	}

	.magazine .img__caption .inner_caption, .magazine .right_caption .inner_caption, .magazine .commonPage__POuter .inner_caption{
		padding-bottom: 0;
	}
	/* コラム内画像フロート */
	.clm .mod__modulewrap_m30_40{
		margin: 0 !important;
	}
		.clm .mod__modulewrap_m30_40 .mod__imgblock{
			margin: 0;
		}
	/* コラム内コラム */
	.inClm {
		/* border-radius: 10px; */
		padding: 20px;
		background-color: #FFF;
		/* margin-top: 10px !important; */
	}

	@media screen and (max-width: 639px) {
	    	.commonPage__POuter.clm{
		       	margin: 0 3.355% 30px;
        		padding: 20px;
    		}
		.commonPage__POuter.clm.topics h2 {
			margin: 0 3.125% 10px;
			border-bottom: none;
			padding-bottom: 0px;
		}
		.commonPage__POuter.clm	.commonPage__img__default.img_ttl{
			margin-bottom: 10px !important;
		}
		.clm p.mod__imgblockText.mb20{
			margin-bottom: 20px !important;
		}
		.inClm {
			padding: 15px;
		}
		/* スマホだけの余白 */
		.spmb10{
			margin-bottom: 10px !important;
		}
		.spmb20{
			margin-bottom: 20px !important;
		}
		.spmb30{
			margin-bottom: 30px !important;
		}
	}

/* マーカー */
span.marker{
	background: linear-gradient(transparent 60%, #f9dc84 60%);
}

/* 広報誌レシピへのリンク */
.img_hover img{
	transition: 0.5s;
}
	.img_hover img:hover{
		opacity: 0.5;
	}

/* クオリティについて */
.commonPage__POuter.clm.quality{
	background-color: #FFF;
	border: 2px solid #C49A6A !important;
	padding: 20px 30px 30px;
}
.commonPage__POuter.clm.quality>h2{
	font-size: 2.2em;
	color: #C49A6A !important;
	text-align: center;
	margin: 0 auto 20px;
	border: none !important;
	text-decoration: none;
}
.mod__imgblockImg.w80{
	width: 70%;
	margin: auto;
}

/* 今回だけのスタイル --------------------------------------- */
/* 吹き出し */
.balloon1 {
	position: relative;
	display: inline-block;
	margin: 1.5em 0;
	padding: 1.2em 1.5em;
	min-width: 120px;
	max-width: 100%;
	color: #333;
	font-size: 16px;
	background: #f4fcff;
	border-radius: 15px;
}
.balloon1:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -15px;
	border: 15px solid transparent;
	border-top: 15px solid #f4fcff;
}
.balloon1 p {
	margin: 0;
	padding: 0;
	font-size: 0.8em;
}
.imgMain img.w50{
	width: 50%;
	margin: auto;
}
/* 矢印 */
.arrow1{
	width: 20px;
	height: 20px;
	border: 5px solid;
	border-color:  transparent transparent #c53d27 #c53d27;
	transform: rotate(-45deg);
	margin: 10px auto 30px;
}
@media screen and (max-width: 639px) {
	.arrow1{
		margin-bottom: 15px;
	}
}

.commonPage__POuter.clm.spread p{
	font-size: 1.4em;
}
.ml15{
        margin-left: 15% !important;
}

/* できるまで */
.mb50{
        margin-bottom: 50px !important;
}
.clm.topics{
	background-color: #FFF;
	border: none;
}
.h2_process {
	font-size: 1.6em;
	border-bottom: 2px solid #c53d27 !important;
	color: #c53d27 !important;
	text-align: center;
	margin: 0 auto 20px;
	line-height: 1.3em;
	padding-bottom: 10px;
}
.commonPage__POuter.clm{
	background-color: #FFF;
	border: 2px solid #c53d27 !important;
	padding: 20px 30px 30px;
}
.h3_process{
	font-size: 1.4em;
	color: #333;
	margin: 0 auto 5px;
	line-height: 1.1;
}
.mod__imgblockInner h3.h3_process{
	font-size: 1.6em;
	font-weight: bold;
	padding-left: 0;
}
span#marker{
	background:linear-gradient(transparent 60%, #ff6 80%);
	color: #6C402E;
	font-size: 1.4em;
}
.topics h2.ttl_h3{
	font-size: 1.8em !important;
}
	.topics h2.ttl_h3 span{
		font-size: 0.8em !important;
		font-weight: normal;
	}

.mod__modulewrap_m30_40.process{
	margin: auto 50px;
}
.clm.topics{
	background-color: #FFF;
	border: 1px solid #A988B0;
}

/* 見出し3　文頭 */
.h3_process i{
	font-size: 1.6em;
	font-weight: bold;
	font-family: serif;
	display: inline-block; 
	transform: scale(1.2, 1.0); 	
	padding-right: 0.4em;
	color: #c53d27;
}
.commonPage__img__default img.w40{
	width: 40%;
}

/* 今回だけ */
h2.h2_quality {
    position: relative;
    text-align: center;
    color: #714217;
    margin-top: 5px;
}
.commonPage__POuter.clm p{
	margin: 0;
}
.h3_process{
	line-height: 1.8;
}
.h3_process span{
	font-size: 1.4em;
	font-weight: bold;
	display: inline-block; 
	transform: scale(1.2, 1.0); 	
	padding-right: 0.4em;
	color: #297e49;
}
p.mod__imgblockText.qa{
	font-size: 1.5em;
}
	p.mod__imgblockText.qa span{
		font-size: 1.8em;
		font-weight: bold;
		color: #ff7d1f;
	}
.commonPage__POuter.clm.qa{
	background-color: #FFF;
	border: 2px solid #7ebb47;
	border-top: none;
	padding: 20 30px 20px;
	border-radius: 0;
}
/* メイン画像下キャプション */
.commonPage__img__default.imgMain{
	padding-bottom: 10px !important;
}
.commonPage__img__default.imgSub{
	width: 100%;
}
	img.w50{
		width: 90% !important;
		margin-left: 10% !important;
	}
@media screen and (max-width: 639px) {
	p.mod__imgblockText.qa{
		font-size: 1.25em;
	}
	p.mod__imgblockText.qa span{
		font-size: 2.0em;
	}
	.commonPage__img__default.imgSub{
		margin-top: 0 !important;
	}
	.commonPage__img__default img.w40{
		width: 60%;
	}
	.magazine .img__caption .inner_caption{
		text-align: center !important;
	}
	.imgMain img.w50{
		width: 70%;
		margin: auto;
	}
	/* できるまで */
	.commonPage__POuter.clm{
		padding: 20px;
	}
	.h2_process {
		font-size: 1.6em;
		border-bottom: 2px solid #B44D2A;
		text-align: center;
		line-height: 1.2;
	}
	h3.h3_process{
		font-size: 1.4em;
		margin-top: 0;
	}
	.splitContent__main h3{
		background: none;
		padding-left: 0;
		margin-left: 0;
	}
	.mod__imgblockLeft--70,
	.mod__imgblockLeft--80{
		float: none;
		width: 100%;
	}
	.mod__imgblockRight--30,
	.mod__imgblockRight--20{
		float: none;
		width: 100%;
	}
	.mod__imgblockRight--20 img{
		width: 50%;
		margin: auto;
	}
	.mod__modulewrap_m30_40.process p.mod__imgblockText{
		margin: auto 0;
		line-height: 1.1em;
	}
	.mod__imgblockLeft--70{
		max-width: 100%;

	}
	.mod__imgblockLeft--70,
	.mod__imgblockLeft--80{
		max-width: 100%;
		float: none;
		width: 100%;
	}
	.mod__imgblockRight--30,
	.mod__imgblockRight--20{
		float: none !important;
		width: 100% !important;
	}
	img.w50{
		width: 50% !important;
		margin: 0 auto 10px !important;
	}
}

/* --------------------------------
 * 吹き出し
 * -------------------------------- */
/*吹き出し*/
.balloon1-top {
	position: relative;
	display: inline-block;
	margin: 1.5em 0;
	padding: 15px;
	min-width: 120px;
	max-width: 100%;
	color: #333;
	font-size: 14px;
	background: #D3E9F8;
	border-radius: 15px;
}

.balloon1-top:before {
	content: "";
	position: absolute;
	top: -28px;
	left: 50%;
	margin-left: -15px;
	border: 15px solid transparent;
	border-bottom: 15px solid #D3E9F8;
}

.balloon1-top p {
	margin: 0;
	padding: 0;
}

.commonPage__img__default.imgMain.w60{
	width: 60%;
	margin: auto auto 40px !important;
}
.commonPage__img__default.imgMain.w70{
	width: 70%;
	margin: auto auto 20px !important;
}
.commonPage__img__default img.w60{
		width: 60%;
		margin: auto;
}

@media screen and (max-width: 639px) {
	/* 吹き出し */
	.commonPage__img__default.imgMain.w60{
		width: 90%;
		margin: auto auto 30px !important;
	}
	.commonPage__img__default img.w60{
			width: 60%;
			margin: auto;
	}
}

@media screen and (max-width: 639px) {
	.commonPage__img__default.imgMain.w60,
	.commonPage__img__default.imgMain.w70{
		width: 100%;
	}
	.clm.topics{
		margin: 0 3.355% 30px !important;
		padding: 15px;
		width: auto;
	}
	.clm.topics ol{
		font-size: 1.4em;
	}
	.commonPage__img__default.img_ttl.w70{
		width: 100%;
		margin-left: auto;
	}
	.commonPage__img__default.w60{
		width: 80%;
		margin: auto;
	}
	h3.ttl_h3{
		background-image: none !important;
		padding-left: 0;
		padding-left: 5px;
		}
}
