@charset "utf-8";


/*背景カラー============================================*/
.behind_color {
	text-align: center;
	/*background-color: #fef5ae;*/
	background-image: linear-gradient(0deg, #ffffff 0%, #fdfbfb 100%);
	width: 100%;
	padding:25px;
	margin: 0 auto;
}
.menu img{
    width: 30%;
}

@media screen and (max-width: 768px) {
.behind_color {
    width: auto;
    padding: 20px 20px;
    background-image: linear-gradient(0deg, #ffffff 0%, #fdfbfb 100%);
}
}

.behind_color2 {
	text-align: center;
	background-color: #e2ddd9;
	/*background-image: linear-gradient(0deg, #ffffff 0%, #fdfbfb 100%);*/
	width: 100%;
	padding:25px;
	margin: 0 auto;
}



/* 説明txt部分 ============================================*/

.setsumei{
	text-align:justify;
	}


.setsumei h1{
	text-align: center;
	font-size:24px;
    padding-top: 10px;
    color: #F60;
    font-weight: 600;
    margin-bottom: 10px;
	}

.setsumei h3{
	text-align: center;
	font-size:24px;
    padding-top: 10px;
    color: #F60;
    font-weight: 600;
    margin-bottom: 10px;
	}	

.setsumei p{
	font-size:1.0em;	
		}

@media screen and (max-width: 768px) {
.setsumei{
}


.setsumei h1{
	font-size:20px;
    color: #F60;
    font-weight: 600;
    margin-bottom: 10px;
	}
	

.setsumei h3{
	font-size:18px;
    color: #F60;
    font-weight: 600;
    margin-bottom: 10px;
	}
	

.setsumei p{
	font-size:1.0em;
	text-align:left ;
	letter-spacing:0.01em;
	line-height:1.7em;
	
	}

}


/* リード部分 ============================================*/
.lead-sentence {
  width: 100%;
  margin: 0 auto 20px;
  padding: 20px 0;
}



.lead-sentence_h2 {
  color: #341705;
  text-align:center ;
  font-size: 2.0rem;
  font-weight:800;
  margin-bottom:20px;

}


.lead-sentence_h2 span {
  color: #005633;
  text-align:center;
    font-size: 1.0rem;
  font-weight:800;
  margin-top:-20px;
}

.lead-sentence_middtxt {
  color: #005633;
  text-align:center ;
    font-size: 2.0rem;
  font-weight:800;
}



.lead-sentence h3 {
  color: #333333;
  text-align:center;
   font-family: serif;
   font-weight:600;
   font-size: 1.0rem;
   padding-bottom: 30px;

}



.lead-sentence p {
  color: #575555;
  font-size: 1.4rem;
  line-height:1.8em;
  letter-spacing:0.02em;
    text-align: center ;
}


/*-------スマホの時-------------*/
@media screen and (max-width: 768px) {
	
.lead-sentence_h2 {
  color: #341705;
  text-align:center;
  font-size: 1.5rem;
  font-weight:800;
  margin-bottom:30px;
}

.lead-sentence p {
  color: #341705;
  font-size: 1.0rem;
  line-height: 1.8rem;
  text-align:left;
  margin:8px;
}	

.lead-sentence_middtxt {
  color: #005633;
  text-align:center ;
    font-size: 1.2rem;
  font-weight:800;
}
	
	}


/* タイトル左右に二重線 */

.title_h1 {
  position: relative;
  display: inline-block;
  padding: 0 400px;
  margin-bottom:40px;
  font-size:1.5em;
  font-weight:bold;
  color:#ff9528;

}
.title_h1:before, .title_h1:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 360px;
  height: 6px;
  border-top: solid 1px #ff9528;
  border-bottom: solid 1px #ff9528;
  }
  
  
.title_h1:before {
  left:0;
}
.title_h1:after {
  right: 0;
}

@media screen and (max-width: 768px) {
.title_h1 {
  position: relative;
  display: inline-block;
  padding: 0 80px;
  font-size:1.5em;
  font-weight:bold;
  color:#ff9528;

}
.title_h1:before, .title_h1:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 100px;
  height: 2px;
  }

}

/* タイトル直下、小文字の英語表記 */
.under_eng_small
 {
  font-size: 1.2rem;
  color: #8ba55e;
  font-family: serif;
  margin-bottom: 10px;
  text-align:center;
}



/* 余白つけ　*/
.padding20{
	padding:20px;
	
	}


/* 太字に　*/
.bold_2{
	font-weight:bold;	
	}



/* 単品色指定 */
.red{
	color:#97192A;
}

.orange{
	color:#ff6428;
	}

.white{
	color:#FFF;
	
}

.graybk{
	color:#575555;
	
}



/*　区切りタイトル用設定 ＜大＞　*/
.section-title {
  width: 80%;
  margin: 50px auto 0px;
}

.section-title-inner {
  font-size: 1.6em;
  text-align: center;
  position: relative;
  padding-top: 1rem;
  padding-bottom: 0.2em;
  /*---border-bottom: 3px solid #fc792d;---*/
}

/*--.section-title-inner:before {
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 20%;
  height: 3px;
  content: '';
  background: #bdd321;
}---*/

.explanation {
  font-size: 1.2em;
/*  padding-top: 20px; */
  text-align: center;
}

/*　区切りタイトル用設定 ＜小＞　*/
.section-sub-ttl {
  margin-top: 80px;
  margin-bottom: 50px;
  text-align: center;
}

.section-sub-ttl__eng {
  font-size: 1.5rem;
  font-family: serif;
  color: #ff8956;
}

.section-sub-ttl__jpn {
  font-weight: bold;
  font-size: 1.6rem;
}

.section-sub-ttl_border {
  width: 100px;
  height: 2px;
  background-color: #fc792d;
  margin: 7px auto 15px;
  border-radius: 2px;
  box-shadow: 1px 1px 1px #e8e6a0;
}


/*ナビ*/
.nav2 {
	margin:auto;	
	margin-bottom: 0px;
    margin-top: 30px;
}
.nav2 li {
    display: inline-block;
	background-color: #fece00;
	margin-bottom: 5px;	
	border-radius: 0.2em;
	padding: 8px 0px 8px 0px;
}
.nav2 li:hover {
}

.nav2 li a { 	
	color:#5c5a5a;
	font-size: 18px;
    padding: 15px 15px 15px 15px; 
}
.nav2 li a:hover { 	
	color:#fff;
	text-decoration: none;
}

.nav_cate {
    margin-left: auto;
/*	margin:auto;    */
	margin-bottom: 0px;
    margin-top: 30px;
}
.nav_cate li {
    display: inline-block;
	background-color: #71492c;
	margin-bottom: 5px;	
	border-radius: 0.2em;
	padding: 8px 0px 8px 0px;
}
.nav_cate li:hover {
}

.nav_cate li a { 	
	color:#fff;
	font-size:25px;
    padding: 15px 50px 15px 50px;
}
.nav_cate li a:hover { 	
	color:#fea;
	text-decoration: none;
}

.nav_g {
	margin:auto;	
	margin-bottom: 0px;
    margin-top: 30px;
    text-align: center;
}
.nav_g li {
    display: inline-block;
	background-color: #c49768;
	margin-bottom: 5px;	
	border-radius: 0.6em;
	padding: 8px 0px 8px 0px;
	box-shadow: 2px 2px 2px #ccc;
}
.nav_g li:hover {
}

.nav_g li a { 	
	color:#fff;
	font-size: 16px;
    padding: 15px 15px 15px 15px; 
}
.nav_g li a:hover { 	
	color:#552c28;
	text-decoration: none;
}

@media screen and (max-width: 640px) {
.nav2 li {
	width: 100%;
	margin:auto;
	margin-bottom: 5px;
}
.nav2 li a {
	font-size:16px;
    padding: 15px 50px 15px 50px; 
}
.nav_cate li {
	width: 100%;
	margin:auto;
	margin-bottom: 5px;
}
.nav_cate li a {
	font-size:18px;
    padding: 15px 50px 15px 50px; 
}
}

@media screen and (max-width: 425px) {
.nav2 {
	width:90%;
    /*background-color: #ccccff;*/
}
.nav2 li {
	box-shadow: none;
	margin-bottom: 5px;
}
.nav2 li a {
	font-size:16px;
    padding: 15px 15px 15px 15px;
}
.nav_cate {
	width:90%;
    margin: auto;
    /*background-color: #ccccff;*/
}
.nav_cate li {
	box-shadow: none;
	margin-bottom: 5px;
    text-align: center;
}
.nav_cate li a {
	font-size:17px;
    padding: 15px 15px 15px 15px;
}
.nav_g li a { 	
	color:#fff;
	font-size: 15px;
    padding: 8px 8px 8px 8px; 
}
}

@media screen and (max-width: 320px) {
.nav2 li a {
    padding: 15px 40px 15px 40px;
  }
.nav_cate li a {
    padding: 15px 40px 15px 40px;
  }
}



/*recipe*/
.recipe h3{
	font-size:18px;
	margin-top:10px;
	font-weight:400;
	letter-spacing:normal;
	color:#5c5a5a;
}

@media (max-width: 767px){

.recipe h3{
	font-size:14px;
	font-weight:900;
	margin-top:10px;
	font-weight:400;
}	
}



/*スマホ表示非表示*/

@media only screen and (max-width : 320px) {
	.pc_h{
		display:none;
	}
	.smp_h{
		display:inline;
	}

}
@media only screen and (min-width : 320px) {
	.pc_h{
		display:none;
	}
	.smp_h{
		display:inline;
	}
}
@media only screen and (min-width : 992px) {
	.pc_h{
		display:inline;
	}
	.smp_h{
		display:none;
	}
}
@media only screen and (min-width : 1200px) {
	.pc_h{
		display:inline;
	}
	.smp_h{
		display:none;
	}
}
.smp_h1 {		display:inline;
}
.smp_h1 {		display:none;
}
.smp_h1 {		display:none;
}



/*写真を丸に*/
.img-circle {
    border-radius: 50%;
	 margin: auto;
	display: block;
	-webkit-filter: drop-shadow(3px 3px 2px #aaaaaa);
	        filter: drop-shadow(3px 3px 2px #aaaaaa);

}

/*写真を角丸に*/
.kadomaru {
    border-radius: 10px;
}


/*======================背景色=========================*/
.lead-bg01 {
  background-color: #fbf5e2;
}



.insta_p{
	font-size:18px;
	letter-spacing:normal;
	line-height:170%;
	text-align:justify;
	padding:0 30px;
	}
	
@media (max-width: 767px){
	
.insta_p{
	font-size:16px;
	letter-spacing:normal;
	line-height:155%;
	text-align:justify;
	padding:0 25px;
	}	
	
	
	}


/*============================================
 画像装飾 
============================================*/
/*======================斜め線=========================*/
.image_diagonal {
	position: relative;
}

.image_diagonal::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 10px);
	height: calc(100% - -10px);
	border-image-source: repeating-linear-gradient(45deg, #fff, #fff 3px, rgba(0 0 0 / 0) 0, rgba(0 0 0 / 0) 6px);
	border-image-slice: 10;
	border-image-repeat: round;
	border-style: solid;
	border-width: 10px;
}



/*-------旧--------------*/


/*���C���ݒ�*/

.line-p {
    overflow: hidden;
    text-align: center;
	padding:30px 0 30px 0;
}

.line-p span {
	display: inline-block;
	padding: 0 0.5em;
	position: relative;
	text-align: center;
}

.line-p span:before,
.line-p span:after {
    border-top: 1px solid;
    content: "";
    position: absolute;
    top: 50%;
    width: 99em;
}

.line-p span:before {
    right: 100%;
}

.line-p span:after {
    left: 100%;
}


.lineunder_textp{
font-size:18px;
/*text-align:center;*/
line-height:160%;
}
	
.lineunder_temp{
font-size:18px;
text-align:left;
line-height:150%;
}	
	
.pc_margin{
margin-left:14px;	
}

.top_textp{
font-size:22px;
text-align:center;
padding:0px;
}	


.p-line-height
 {
	line-height: 1.7em;
	font-size: 1.2em;
    color: #fff;
    letter-spacing: normal;
}

@media screen and (max-width: 425px) {
.p-line-height
 {
	line-height: 1.7em;
	font-size: 1em;
    color: #fff;
    letter-spacing: normal;
    text-align: left;
}
}



/*�����ɒ���CSS�L�q*/
body{
	font-size: 16px;
	line-height:25px;
	letter-spacing:0.5px;
	background:#ffffff;
}

	.box_topdown{
    margin-bottom: 120px;
	}
	

@media (max-width: 767px){
	body{
	font-size: 14px;
	}
	
	.box_topdown{
	margin-top:30px;
    margin-bottom: 30px;
	}
	
	.box_topdown_contents{
	margin-top:10px;
	}
	


.lineunder_textp{
font-size:16px;
text-align:left;
padding:10px;
}

.lineunder_temp{
font-size:15px;
text-align:left;
padding:10px;
}
	
.pc_margin{
	margin:0px;	
}

}


a{
	color:#333333;
}




/*******************************************************/





/*テーブル表設定*/
table.table01 {
	width:100%;
	border-right:#7ac2e3 solid 1px;
	border-collapse: collapse;
}
table.table01 thead th {
	background:#7ac2e3;
	color:#333333;
	padding:10px 15px;
	border-right:#ffffff solid 1px;
	border-bottom:#ffffff solid 1px;
}
table.table01 thead th:last-child {
	border-right:#7ac2e3 solid 1px;
}
table.table01 tbody th {
	background:#7ac2e3;
	color:#ffffff;
	padding:10px 15px;
	border-bottom:#ffffff solid 1px;
	vertical-align:top;
}
table.table01 tbody tr:last-child th {
	border-bottom:#7ac2e3 solid 1px;
}
table.table01 tbody td {
	background:#FFF;
	padding:10px 15px;
	border-left:#7ac2e3 solid 1px;
	border-bottom:#7ac2e3 solid 1px;
    border-top: none;
	vertical-align:top;
}

table.table01 thead th:last-child {
	border-right: none;
	border-bottom: none;
}

@media screen and (max-width: 640px) {
table.table01 thead {
	display:none;
}
table.table01 tbody th {
	display:block;
}
table.table01 tbody td {
	display:block;
}
table.table01 tbody td::before {
	content: attr(label);
	float: left;
	clear:both;
	font-weight:bold;
}
table.table01 tbody td p {
	padding-left:10em;
}
}


table.table02 {
	width:100%;
	border-right:#ffffff solid 1px;
	border-collapse: collapse;
}
table.table02 thead th {
	background:#ffffff;
	color:#333333;
	padding:10px 15px;
	border-right:#ffffff solid 1px;
	border-bottom:#ffffff solid 1px;
}
table.table02 thead th:last-child {
	border-right:#ffffff solid 1px;
}
table.table02 tbody th {
	background:#ffffff;
	color:#ffffff;
	padding:10px 15px;
	border-bottom:#ffffff solid 1px;
	vertical-align:top;
}
table.table02 tbody tr:last-child th {
	border-bottom:#ffffff solid 1px;
}
table.table02 tbody td {
	background:#FFF;
	padding:10px 15px;
	border-left:#ffffff solid 1px;
	border-bottom:#ffffff solid 1px;
	vertical-align:top;
}

@media screen and (max-width: 640px) {
table.table02 thead {
	display:none;
}
table.table02 tbody th {
	display:block;
}
table.table02 tbody td {
	display:block;
}
table.table02 tbody td::before {
	content: attr(label);
	float: left;
	clear:both;
	font-weight:bold;
}
table.table02 tbody td p {
	padding-left: 6em;
}
}

table.table03 {
	width:100%;
	border-right:#7ac2e3 solid 1px;
	border-collapse: collapse;
}
table.table03 thead th {
	background:#7ac2e3;
	color:#333333;
	padding:10px 15px;
	border-right:#ffffff solid 1px;
	border-bottom:#ffffff solid 1px;
}
table.table03 thead th:last-child {
	border-right:#7ac2e3 solid 1px;
}
table.table03 tbody th {
	background:#7ac2e3;
	color:#ffffff;
	padding:10px 15px;
	border-bottom:#ffffff solid 1px;
	vertical-align:top;
}
table.table03 tbody tr:last-child th {
	border-bottom:#7ac2e3 solid 1px;
}
table.table03 tbody td {
	background:#FFF;
	padding:10px 15px;
	border-left:#7ac2e3 solid 1px;
	border-bottom:#7ac2e3 solid 1px;
	vertical-align:top;
}






/*============================================*/
/* レスポンシブ設定（ブレークポイント：768px） */
/*============================================*/
@media screen and (max-width: 768px) {
  .section-title {
    width: 100%;
  }
}

/*============================================*/
/* レスポンシブ設定（ブレークポイント：640px） */
/*============================================*/
@media screen and (max-width: 640px) {
  .sp-width img {
    width: 100%;
  }

  .ttl_img {
    width: 100%;
  }

}

/*============================================*/
/* レスポンシブ設定（ブレークポイント：425px） */
/*============================================*/
@media screen and (max-width: 425px) {
  .section-title-inner {
    font-size: 1.6em;
  }

  .section-sub-title-inner {
    font-size: 1.6em;
  }

.section-sub-ttl__eng {
  font-size: 1.5rem;
}
  .explanation {
    font-size: 1.2em;
    text-align: left;
  }

  .line-p {
    padding: 0 0 10px 0;
  }

  .line-p span {
    font-size: 0.7em;
  }

  .icon_item {
    width: 30px;
  }
}

/*============================================*/
/* レスポンシブ設定（ブレークポイント：375px） */
/*============================================*/
@media screen and (max-width: 375px) {
  .section-title-inner {
    font-size: 1.8em;
  }

  .section-sub-title-inner {
    font-size: 1.2em;
  }
}





/*============================================*/
/*モーダル用 */
/*============================================*/

/*全て共通：hideエリアをはじめは非表示*/
.hide-area{
	display: none;
}

/*全て共通：モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#ccc;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

/*確認を促すモーダル：タイトルの色を変更したい場合*/
#modaal-title{
	font-size:1.2rem;
	text-align: center;
	margin: 0 0 20px 0;
}


/*============================================*/
/*下に空白 */
/*============================================*/
/* 80px */
.bottom_blank80 {
	margin-bottom: 80px;
}
/* 50px */
.bottom_blank50 {
	margin-bottom: 50px;
}
/* 30px */
.bottom_blank30{
	margin-bottom:30px;
}
/* 20px */
.bottom_blank20{
    margin-bottom: 20px;
}
/* 10px */
.bottom_blank10{
    margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
/* スマホだけ30px */
.bottom_blank30{
	margin-bottom:30px;
}
/* 20px */
.bottom_blank20{
    margin-bottom: 10px;
}
}


/*============================================*/
/*上に空白 */
/*============================================*/
/* 100px */
.top_blank100 {
	margin-top: 100px;
}
/* 80px */
.top_blank80 {
	margin-top: 80px;
}
/* 50px */
.top_blank50 {
	margin-top: 50px;
}
/* 30px */
.top_blank30{
	margin-top:30px;
}
/* 20px */
.top_blank20{
    margin-top: 20px;
}
/* 10px */
.top_blank10{
    margin-top: 10px;
}



/*============================================*/
/*見出し */
/*============================================*/

h2 {
    padding: 3px ;
    margin-bottom: 3px ;
    font-weight: bold;
    font-size: 26px;
    text-align: center;
}

h2 span {
    background: linear-gradient(transparent 60%, #fdd86e 60%);
    border-radius: 80% 50% 60% 5%/80% 75% 15% 75%;
}

@media screen and (max-width: 768px) {

h2 {
    padding: 3px ;
    margin-bottom: 3px ;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
}

h2 span {
    background: linear-gradient(transparent 60%, #fdd86e 60%);
    border-radius: 80% 50% 60% 5%/80% 75% 15% 75%;
}
}

/*============================================*/
/*見出し 左右斜め線 */
/*============================================*/

.heading {
  align-items: center; /* 線を上下中央 */
  display: flex; /* 文字と横線を横並び */
  justify-content: center; /* 文字を中央寄せ */
}
.heading::before,
.heading::after {
  background-color: #333; /* 線の色 */
  border-radius: 5px; /* 線の両端を丸く */
  content: "";
  height: 5px; /* 線の高さ */
  width: 40px; /* 線の長さ */
}
.heading::before {
  margin-right: 10px; /* 文字との余白 */
  transform: rotate(60deg); /* 傾ける */
}
.heading::after {
  margin-left: 10px; /* 文字との余白 */
  transform: rotate(-60deg); /* 傾ける */
}

@media screen and (max-width: 768px) {


.heading {
  align-items: center; /* 線を上下中央 */
  display: flex; /* 文字と横線を横並び */
  justify-content: center; /* 文字を中央寄せ */
}
.heading::before,
.heading::after {
  background-color: #333; /* 線の色 */
  border-radius: 5px; /* 線の両端を丸く */
  content: "";
  height: 3px; /* 線の高さ */
  width: 22px; /* 線の長さ */
}
.heading::before {
  margin-right: 10px; /* 文字との余白 */
  transform: rotate(60deg); /* 傾ける */
}
.heading::after {
  margin-left: 10px; /* 文字との余白 */
  transform: rotate(-60deg); /* 傾ける */
}
}


/*============================================*/
/*見出し 左右ライン */
/*============================================*/

.heading01 {
	position: relative;
	font-size: 36px;
	text-align: center;
	border-bottom: 5px solid #f2e6d8;
}

.heading01::after {
	content: '';
	position: absolute;
	bottom: -5px;
	left: 50%;
	transform: translateX(-50%);
	width: 100px;
	height: 5px;
	background-color: #50304f;
}
@media screen and (max-width: 768px) {
.heading01 {
    font-size: 20px;
}

.heading01::before {
    font-size: 14px;
}
}


/*============================================*/
/*見出し 下ラインあしらい */
/*============================================*/


.heading02 {
	padding-bottom: 10px;
	/*font-size: 26px;*/
	background-image: repeating-linear-gradient(90deg, #25360c 0, #25360c 2px, rgba(0,0,0,0) 2px, rgba(0,0,0,0) 4px);
	background-size: 4px 4px;
	background-repeat: repeat-x;
	background-position: center bottom;
}


/*============================================*/
/*見出し 英字 */
/*============================================*/

.heading03 {
	position: relative;
	padding-top: 50px;
	padding-left: 30px;
	font-size: 26px;
	z-index: 10;
}

.heading03 span {
	position: relative;
}

.heading03::before {
	content: attr(data-en);
	position: absolute;
	transform: rotate(-5deg);
	top: -20px;
	left: 0;
	color: #e0989c;
	font-size: 70px;
	font-weight: 400;
	font-family: serif;
	/*font-style: italic;*/
	opacity: 0.2;
	line-height: 1.0;
}
@media screen and (max-width: 768px) {
	
.heading03 {
	font-size: 18px;
}
.heading03::before {
	font-size: 40px;
}
}


/*============================================*/
/*見出し 横縦棒背景あり */
/*============================================*/

.heading04 {
	padding: 0.5em;
	font-size:20px;
	font-weight: bold;
	color: #494949;
	background: #f6f6f6;
	border-left: solid 5px #50304f;
	margin-bottom: 30px;
}
	

/*============================================*/
/*見出し 横縦棒背景なし */
/*============================================*/

/*.heading05 {
	padding: 0.5em;
	font-size:18px;
	border-left: solid 5px #f2e6d8;
	margin-top: 30px;
	margin-bottom: 30px;
}*/
.heading05 {
	position: relative;
	padding: 0.5em;
	font-size:22px;
	margin-top: 30px;
	margin-bottom: 30px;
}
	
.heading05:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background-image: linear-gradient(90deg, #50304f, #ffffff);
}

/*============================================*/
/*見出し 横縦棒背景なし */
/*============================================*/

/*.heading08 {
	padding: 0.5em;
	font-size:18px;
	border-left: solid 5px #f2e6d8;
	margin-top: 30px;
	margin-bottom: 30px;
}*/
.heading08 {
	position: relative;
	padding: 0.5em;
	font-size:22px;
	margin-top: 30px;
	margin-bottom: 30px;
}
	
.heading08:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background-image: linear-gradient(90deg, #50304f, #ffffff);
}
@media screen and (max-width: 768px) {
/*.heading08 {
	padding: 0.5em;
	font-size:18px;
	border-left: solid 5px #f2e6d8;
	margin-top: 30px;
	margin-bottom: 30px;
}*/
.heading08 {
	margin-bottom: 90px;
}
}
/*============================================*/
/*見出し 文字斜め*/
/*============================================*/

.heading06{
	width: 100%;
	margin-bottom: 30px;
	padding: 10px;
	position:relative;
	z-index: 10;
}

.heading06 p{
	position: absolute;
	top: 0;
	left: 0;
	/*color: #e0989c;*/
	color: #aaaaaa;
	font-weight: 400;
	font-size: 60px;
	transform: rotate(-5deg);
	opacity: 0.5;
}


.heading07{
	width: 100%;
	margin-top: 50px;
	margin-bottom: 110px;
	padding: 10px;
	position:relative;
	z-index: 10;
}

.heading07 p{
	position: absolute;
	top: 0;
	left: 0;
	/*color: #e0989c;*/
	color: #aaaaaa;
	font-weight: 400;
	font-size: 60px;
	transform: rotate(-5deg);
	opacity: 0.5;
}
@media screen and (max-width: 768px) {
.heading06{
	margin-bottom: 80px;
}

.heading06 p{
	font-size: 35px;
}
.heading07{
	margin-bottom: 60px;
}

.heading07 p{
	font-size: 35px;
}
}


/*=============
ボタン　レシピ
=============*/
a.btn_recipe {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  position: relative;
  background: #ffffff ;
  border: 1px solid #231112 ;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #231112;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
  margin-bottom:20px;
  border-radius:5px;
}
a.btn_recipe:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 25px;
  margin-top: -6px;
}
a.btn_recipe:hover {
  background: #fff;
  color: #231112 ;
}
a.btn_recipe:hover:before {
  border-top: 2px solid #231112 ;
  border-right: 2px solid #231112 ;
}


@media screen and (max-width: 768px) {
a.btn_recipe {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  position: relative;
  background: #ffffff ;
  border: 1px solid #231112 ;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #231112;
  font-size: 14px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
  margin-bottom:20px;
  border-radius:5px;
}	
}

/*=============
画像丸く

.circle-image img {
    border-radius: 50%;
}
=============*/


/*=============
ナビメニュー
=============*/


.top-btn{
	display: flex;
	flex-wrap:wrap;
}
.top-btn li {
	width: calc(100%/4);/*並べる数*/
	padding:0 2px;/*左右に余白を入れる場合*/
	box-sizing:border-box;
}
.top-btn li img {
	max-width:100%; /*はみだしを防ぐ*/
	height: auto; /*縦横比を維持 */
}
/*リンクボタンデザイン設定*/
.link-btn {
    text-decoration: none!important;
    justify-content: center; /*左右間で中央*/
    align-items: center;/*上下間で中央*/
    color: #fff!important;
    display: flex!important;/*画面に合わせてサイズが変わる*/
 　 flex-wrap:wrap!important;flex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrapflex-wrap/*要素の折り返し設定*/
    font-weight: bold;font-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weightfont-weight
    padding: 10px 15px;paddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpaddingpadding
    border-radius: 10px;border-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radiusborder-radius
    box-shadow: none;box-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadowbox-shadow
    transition: .2s;transitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransitiontransition
    
}
.link-btn:hover {
    box-shadow: none;
    transform: translateY(2px);
    opacity: .8;
}
/*ボタン色設定*/
.colorname1 {
    background: #f5b2b2;
}
.colorname2 {
    background: #ade0ea;
}
.colorname3 {
    background: #c7a5cc;
}
.colorname4 {
    background: #417038;
}

@media screen and (max-width: 768px) {
.top-btn li {
	width: calc(100%/2);/*並べる数*/
	padding:2px 2px 2px 2px;/*左右に余白を入れる場合*/

}
}



/*=============
メニュー
=============*/

.fixedWidget {
    position: fixed;
    top: 0px;
}



#c-navi {
	position: relative;
    background-color: #6e8638;
    width: 100%;
    z-index: 10000;
}

.c-navi-list {
    display: flex;
    justify-content: space-between;
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 10px;
}

.c-navi-list:nth-of-type(2) a,
.c-navi-list:nth-of-type(4) a{
	background-color:#09F

}

.c-navi-item {
    padding: 14px 16px;
	color:#ffffff;
	border-left: 1px solid #ffffff;
	/*border-right: 1px solid #ffffff;*/
}

.c-navi-item0 {
    padding: 14px 16px;
	color:#ffffff;
	border-left: 1px solid #ffffff;
	/*border-right: 1px solid #ffffff;*/
}

.c-navi-item p{
	color:#ffffff;
}

.c-navi-item0 p{
	color:#ffffff;
}

.c-navi-item a {
    font-weight: bold;
    font-size: 1.2rem;
}

.c-navi-item0 a {
    font-weight: bold;
    font-size: 1.2rem;
}

.c-navi-item a:hover {
    -webkit-text-decoration-color: #490907;
            text-decoration-color: #490907;
}


.c-navi-item0 a:hover {
    -webkit-text-decoration-color: #490907;
            text-decoration-color: #490907;
}

.c-pointMain {
    position: relative;
}

.c-point {
    font-weight: bold;
    color: slateblue;
    text-decoration: underline;
    cursor: pointer;
}


@media screen and (max-width: 768px) {
	.fixedWidget {
    position: fixed;
    top: 73px;
}
	
    .c-navi-item0 {
        border-left: 0px solid #ffffff;
    }

    .c-navi-item a {
        font-size: 12px;
		text-align:center;
    }

    .c-navi-item0 a {
        font-size: 12px;
		text-align:center;
    }
}




/*=============
レシピ名文字
=============*/

.recipe_name{
/*    font-family: '游ゴシック', 'Meiryo, Osaka', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic', 'sans-serif';
*/
    font-size: 17px;
    font-weight: bold;
    color: #222;
    text-align: left;
    margin: 0px 0px 10px 0px;
    line-height: 1.3em;
}

.recipe_name::before{
    content: '▲';
    font-size: 13px;
    margin-right: 5px;
}
.recipe_name span{
	font-size: 16px;
	display: block;
}

.pink {
    color: #FB807A;
    font-weight: bold;
}


/*=============
レシピ配置
=============*/

.recipe_layout {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.recipe_layout:not(:last-child) {
  margin-bottom: 80px;
}

.recipe_layout:nth-child(even) {
  flex-direction: row-reverse;
}

.recipe_layout-img {
  display: block;
  width: 48%;
  height: auto;
}

.recipe_layout_box {
  width: 48%;
  text-align: left;
}

@media screen and (max-width: 768px) {
	
.recipe_layout {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.recipe_layout:not(:last-child) {
  margin-bottom: 80px;
}

.recipe_layout:nth-child(even) {
  flex-direction: row-reverse;
}

.recipe_layout-img {
  display: block;
  width: 100%;
  height: auto;
}

.recipe_layout_box {
  width: 100%;
}

}


/*=============
レシピ名テキスト
=============*/

.recipe_text h2{
    font-family: '游ゴシック', 'Meiryo, Osaka', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic', 'sans-serif';
    font-size: 25px;
    font-weight: bold;
    margin-top: 30px;
    margin-bottom: 10px;
}

.recipe_text h4{
    font-family: '游ゴシック', 'Meiryo, Osaka', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic', 'sans-serif';
    font-size: 15px;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
}

.recipe_text h5{
    font-family: '游ゴシック', 'Meiryo, Osaka', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic', 'sans-serif';
    font-size: 16px;
    font-weight: bold;
}

.recipe_text h6{
    font-family: '游ゴシック', 'Meiryo, Osaka', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック','MS PGothic', 'sans-serif';
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 10px;
}


@media screen and (max-width: 768px) {
.recipe_text h2{
    font-size: 15px;
    margin-top: 20px;
    margin-bottom: 20px;
}
}

/*=============
テキストボタン
=============*/

.i-anc_inner {
    width: 90%;
    margin: 0 auto 30px;
}
@media screen and (max-width: 768px){
.i-anc {
    padding: 10px 0;
}
}
@media screen and (max-width: 480px)  {
.i-anc_inner {
    width: 94%;
    margin: 0 auto 30px;
}
}
.i-anc-items {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    margin-top: 45px;
    padding: 0px;
}
.i-anc-item {
    width: calc(94% / 3);
    position: relative;
    border: 2px solid #231112;
    margin-bottom: 2%;
    background-color: #fff;
}

.i-anc-item:not(:nth-child(4n))::after {
    display: block;
    content: '';
    position: absolute;
    height: 100%;
    width: 2px;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
}
 .i-anc-item a {
    display: block;
    font-weight: bold;
    position: relative;
    padding: 0.4em 0 1.5em;
    height: 60px;
    box-sizing: border-box;
}
i-anc-item .i-anc-name {
    line-height: 3;
}
.i-anc-item .i-anc-name__2 {
    line-height: 1.4;
    font-size: 16px;
    color: #231112;
    text-align: center;
}

.i-anc-item a::after {
    display: block;
    content: '';
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    bottom: 10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 3.5px 0 3.5px;
    border-color: #231112 transparent transparent transparent;
}
.i-anc .l-btn2 {
    margin-top: 70px;
}
li {
  list-style: none;
}
ul {
  list-style: none;
}

@media screen and (max-width: 480px)  {
.i-anc-item {
    width: calc(96%);
    position: relative;
    border: 2px solid #231112;
    margin-bottom: 2%;
}
}

/*=============
画像テキスト互
=============*/

.raisins_wrapper {
  width: 100%;
  display: flex;
  margin-top: 30px;
}
/*:nth-of-type(even) {
flex-direction: row-reverse;
}
*/.raisins_1, .raisins_2 {
  width: 50%;
  display: flex;
  align-items: center;
}
.raisins_1 {
  box-sizing: border-box;
}
.raisins_wrapper:nth-of-type(2n) .raisins_1:nth-of-type(1){
	padding: 10px;
}
.raisins_1title {
  font-size: 25px;
}
.raisins_2title {
  font-size: 20px;
}
.raisins_1txt {
  font-size: 15px;
  margin: 0 10px 0 10px;
}
.raisins_2 img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.sayaki_title{
    font-size:18px;
    font-weight: bold;
}
@media screen and ( max-width:768px ){
  .raisins_wrapper {
    flex-direction: column-reverse;
  margin-top: 10px;
  }
  .raisins_1, .raisins_2 {
  width: 100%;
}
  .raisins_1 {
  padding: 25px;
}
.raisins_wrapper:nth-of-type(2n) .raisins_1:nth-of-type(1){
  padding: 25px;
}
.raisins_1title {
  font-size: 18px;
  text-align: left;
}
.raisins_2title {
  font-size: 16px;
}
.sayaki_title{
    font-size:16px;
}
}

/*=============
国旗配置 産地

.raisin_area_flag_usa{
    background: url(img/area_flag_usa.png) no-repeat 10px center / 150px auto;
    padding: 50px 10px 50px 180px;
}

.raisin_area_flag_chn{
    background: url(img/area_flag_chn.png) no-repeat 10px center / 150px auto;
    padding: 50px 10px 50px 180px;
}

.raisin_area_flag_uzb{
    background: url(img/area_flag_uzb.png) no-repeat 10px center / 150px auto;
    padding: 50px 10px 50px 180px;
}

.raisin_area_flag_tur{
    background: url(img/area_flag_tur.png) no-repeat 10px center / 150px auto;
    padding: 50px 10px 50px 180px;
}

.raisins_area_title {
  font-weight: bold;
  font-size: 70px;
  color: rgba(0, 0, 0, 0);
  text-shadow: 3px 3px 0 #32192c;
  -webkit-text-stroke: 1px #888;
  text-stroke: 1px #888;
}
@media screen and ( max-width:768px ){
.raisin_area_flag_usa{
    background: url(img/area_flag_usa.png) no-repeat 10px center / 90px auto;
    padding: 50px 10px 50px 100px;
}

.raisin_area_flag_chn{
    background: url(img/area_flag_chn.png) no-repeat 10px center / 90px auto;
    padding: 50px 10px 50px 100px;
}

.raisin_area_flag_uzb{
    background: url(img/area_flag_uzb.png) no-repeat 10px center / 90px auto;
    padding: 50px 10px 50px 100px;
}

.raisin_area_flag_tur{
    background: url(img/area_flag_tur.png) no-repeat 10px center / 90px auto;
    padding: 50px 10px 50px 100px;
}

.raisins_area_title {
  font-size: 40px;
  color: rgba(0, 0, 0, 0);
  text-shadow: 2px 2px 0 #32192c;
}
	
}
=============*/

/*=============
国旗配置
=============*/
.raisin_flag_usa{
    background: url(img/flag_usa.png) no-repeat 10px center / 50px auto;
    padding: 10px 10px 10px 70px;
	margin-top:50px;
}

.raisin_flag_chn{
    background: url(img/flag_chn.png) no-repeat 10px center / 50px auto;
    padding: 10px 10px 10px 70px;
}

.raisin_flag_uzb{
    background: url(img/flag_uzb.png) no-repeat 10px center / 50px auto;
    padding: 10px 10px 10px 70px;
	margin-top:50px;
	margin-bottom:50px;
}

.raisin_flag_tur{
    background: url(img/flag_tur.png) no-repeat 10px center / 50px auto;
    padding: 10px 10px 10px 70px;
	margin-top:50px;
	margin-bottom:50px;

}


/*=============
国旗配置chart用
=============*/

.raisin_flag_usa01{
    background: url(img/flag_usa.png) no-repeat 31px center / 36px auto;
    background-position: top 12px right 0px;
    padding: 10px 45px 10px 50px;
}

.raisin_flag_chn01{
    background: url(img/flag_chn.png) no-repeat 10px center / 36px auto;
    background-position: top 12px right 0px;
    padding: 10px 45px 10px 50px;
}

.raisin_flag_uzb01{
    background: url(img/flag_uzb.png) no-repeat 10px center / 36px auto;
    background-position: top 12px right 0px;
    padding: 10px 45px 10px 50px;
}

.raisin_flag_tur01{
    background: url(img/flag_tur.png) no-repeat 10px center / 36px auto;
    background-position: top 12px right 0px;
    padding: 10px 45px 10px 50px;
}

@media screen and (max-width: 768px) {

.raisin_flag_usa01{
    background: url(img/flag_usa.png) no-repeat 31px center / 28px auto;
    background-position: top 8px right 0px;
    padding: 5px 30px 10px 10px;
}

.raisin_flag_chn01{
    background: url(img/flag_chn.png) no-repeat 10px center / 28px auto;
    background-position: top 8px right 0px;
    padding: 5px 30px 10px 10px;
}


.raisin_flag_uzb01{
    background: url(img/flag_uzb.png) no-repeat 10px center / 28px auto;
    background-position: top 8px right 0px;
    padding: 5px 30px 10px 10px;
}

.raisin_flag_tur01{
    background: url(img/flag_tur.png) no-repeat 10px center / 28px auto;
    background-position: top 8px right 0px;
    padding: 5px 30px 10px 10px;
}
}


/*=============
有機配置
=============*/
.raisin_jas{
    background: url(img/jas_logo.png) no-repeat 10px center / 50px auto;
    padding: 10px 10px 10px 70px;
	margin-top:50px;
	text-align: left;
}

/*=============
栄養素テキスト
=============*/
.back{
    padding: 10px 10px 10px 10px;
    border: 1px solid #333;
	display: inline-block;
	text-align: center;
	margin-top: 20px;

}


/*=============
見出し帯
=============*/

/*アイテム*/

.block_ttldenmark01 {
    display: table;
    height: 400px;
    width: 100%;
    position: relative;
    background: url(img/raisin_obi01.jpg) no-repeat;
    text-align: center;
    background-size: cover;
    text-align: center;
    margin-top: 50px;
}

@media screen and (max-width: 768px) {

.block_ttldenmark01 {
    height: 150px;
}
}

/*レシピ*/

.block_ttldenmark02 {
    display: table;
    height: 400px;
    width: 100%;
    position: relative;
    background: url(img/raisin_obi02.jpg) no-repeat;
    text-align: center;
    background-size: cover;
    text-align: center;
    margin-top: 50px;
}

@media screen and (max-width: 768px) {

.block_ttldenmark02 {
    height: 150px;
}
}


/*知ろう*/

.block_ttldenmark03 {
    display: table;
    height: 400px;
    width: 100%;
    position: relative;
    background: url(img/raisin_obi03.jpg) no-repeat;
    text-align: center;
    background-size: cover;
    text-align: center;
    margin-top: 50px;
}

@media screen and (max-width: 768px) {

.block_ttldenmark03 {
    height: 150px;
}
}

/*=============
食べ方画像
=============*/

.recipe_image {
  height: 800px;
  background-image: url(img/chart_1200.jpg),url(img/organic_raisin700.jpg);
  background-repeat: no-repeat,no-repeat;
}


/*=============
画像と画像重ねる
=============*/

/*右が上*/
.recipe_image01{
    position: relative;
    display: inline-block;
    margin-top: 250px;

}
.recipe_image01 img{
    display: block;
    max-width: 100%;
    height: auto;
}
.recipe_image01 img:nth-of-type(2){
    position: absolute;
    left: 80%;
    bottom: 30%;
    width: 100%;
    height: auto;
}

@media (max-width: 768px) {
.recipe_image01{
    margin-top: 30px;

}
.recipe_image01 img{
    display: block;
    max-width: 50%;
    height: auto;
}
.recipe_image01 img:nth-of-type(2){
    position: absolute;
    left: 45%;
    bottom: 30%;
    width: 50%;
    height: auto;
}
}

/*左が上*/
.recipe_image02{
    position: relative;
    display: inline-block;
    margin-top: 250px;

}
.recipe_image02 img{
    position: relative;
    display: block;
    max-width: 100%;
    height: auto;
	z-index: 3;
}
.recipe_image02 img:nth-of-type(2){
    position: absolute;
    left: 80%;
    bottom: 30%;
    width: 100%;
    height: auto;
	z-index: 2;
}

@media (max-width: 768px) {
.recipe_image02{
    margin-top: 30px;

}
.recipe_image02 img{
    display: block;
    max-width: 50%;
    height: auto;

}
.recipe_image02 img:nth-of-type(2){
    position: absolute;
    left: 45%;
    bottom: 30%;
    width: 50%;
    height: auto;
}
}

/*=============
画像と画像重ねるフォント
=============*/

.recipe_font01 {
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
          text-orientation: upright;
  position: absolute;
  color: #1b061f;
  font-weight: bold; 
  font-size: 20px;
  font-family :Quicksand, sans-serif;/*Google Font*/
  top: 7%;
  left: 7%;
  background: rgba(255,255,255,0.5);
  line-height: 2;
  padding: 30px 10px;
  z-index: 110;
  } 

.recipe_font02 {
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
          text-orientation: upright;
  position: absolute;
  color: #1b061f;
  font-weight: bold; 
  font-size: 20px;
  font-family :Quicksand, sans-serif;/*Google Font*/
  top: 27%;
  left: 163%;
  background: rgba(255,255,255,0.5);
  line-height: 2;
  padding: 30px 10px;
  z-index: 100;
  } 

.recipe_font03 {
  -ms-writing-mode: tb-rl;
  -webkit-text-orientation: upright;
          text-orientation: upright;
  position: absolute;
  color: #1b061f;
  font-weight: bold; 
  font-size: 20px;
  font-family :Quicksand, sans-serif;/*Google Font*/
  top: 83%;
  left: 80%;
  background: rgba(255,255,255,0.5);
  line-height: 2;
  padding: 10px 30px;
  } 

.recipe_font04 {
  -ms-writing-mode: tb-rl;
  -webkit-text-orientation: upright;
          text-orientation: upright;
  position: absolute;
  color: #1b061f;
  font-weight: bold; 
  font-size: 20px;
  font-family :Quicksand, sans-serif;/*Google Font*/
  top: 83%;
  left: 76%;
  background: rgba(255,255,255,0.5);
  line-height: 2;
  padding: 10px 30px;
  } 

@media (max-width: 768px) {
	
	
.recipe_font01 {
  font-size: 12px;
  top: 3%;
  left: 3%;
  padding: 3px 1px;
  }  
	
.recipe_font02 {
  font-size: 12px;
  top: 7%;
  left: 85%;
  padding: 3px 1px;
  } 
	
.recipe_font03 {
  font-size: 12px;
  top: 80%;
  left: 75%;
  padding: 3px 1px;
  }
	
.recipe_font04 {
  font-size: 12px;
  top: 80%;
  left: 70%;
  padding: 3px 1px;
  }  
}


/*=============
粒の大きさ画像
=============*/

.grain_raisin {
  float: center;
  width: 30%;
  margin-right: 10px;
  }  
  

@media (max-width: 768px) {
	
	
.grain_raisin {
  margin-top: 30px;
  margin-right: 0px;
  width: 100%;
  }  
}

/*=============
ボタン　商品リンク
=============*/
a.btn_04 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  position: relative;
  background: #50304f;
  border: 1px solid #50304f;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
  margin: 30px 10px 50px 10px;
}
a.btn_04:before {
  content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 25px;
  margin-top: -6px;
  color: #50304f;
}
a.btn_04:hover {
  background: #fff;
  color: #50304f;
}
a.btn_04:hover:before {
  border-top: 2px solid #50304f;
  border-right: 2px solid #50304f;
}


@media screen and (max-width: 768px) {
a.btn_04 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40px;
  position: relative;
  background: #50304f;
  border: 1px solid #50304f;
  box-sizing: border-box;
  padding: 0 25px 0 40px;
  color: #fff;
  font-size: 14px;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-align: left;
  text-decoration: none;
  transition-duration: 0.3s;
  margin-bottom:20px;
}	
}
	

/*=============
画像右＋テキスト国別
=============*/

.wdh50{
  width:50%;
}

.wdh100{
  width:100%;
}

.box_country01 {
}
.box_country01 img {
  width:100%;
  margin:0 10px 0 0;
}
.right_raisincountry01 {
  width: 47%;
  display: inline-block;
  vertical-align: middle;
} 
.float_nonecountry01 {
  margin:0 10px;
}

@media screen and (max-width: 768px) {
.box_country01 img {
  width:100%;
  margin:10px 0px 15px 0px;
}
.right_raisincountry01 {
  width: 100%;
} 
/*周り込みの解除*/
.float_nonecountry01 {
  clear: both;
} 

.wdh50{
  width:100%;
}
.raisins_wrapper a{
  display:inline;
  text-align: center;
}

}


/*=============
画像左＋テキスト国別
=============*/

.box_country02 {
}

.box_country02 img {
  width:100%;
  margin:0 10px 0 0;
}

.left_raisincountry02 {
  width: 47%;
  display: inline-block;
  vertical-align: middle;
} 

@media screen and (max-width: 768px) {
.box_country02 {
	text-align:center;
}
.box_country02 img {
  width:100%;
  margin:auto;
  margin-top: 10px;
  margin-bottom: 15px;
}
.left_raisincountry02 {
  width: 100%;
} 
/*周り込みの解除*/
.float_nonecountry02 {
  clear: both;
  text-align:left;
  
} 
}



/*=============
画像右＋テキスト
=============*/

.box_raisin01 {
}
.box_raisin01 img {
  width:30%;
  margin:0 10px 0 0;
}
.right_raisin {
  width: 62%;
  display: inline-block;
  vertical-align: middle;
} 

@media screen and (max-width: 768px) {
.box_raisin01 img {
  width:100%;
  margin-top: 10px;
  margin-bottom: 15px;
}
.right_raisin {
  width: 100%;
} 
/*周り込みの解除*/
.float_none {
  clear: both;
} 
}


/*=============
画像左＋テキスト
=============*/

.box_raisin02 {
}
.box_raisin02 img {
  width:20%;
  margin:0 10px 0 0;
}
.left_raisin {
  width: 72%;
  display: inline-block;
  vertical-align: middle;
} 

@media screen and (max-width: 768px) {
.box_raisin02 {
	text-align:center;
}
.box_raisin02 img {
  width:50%;
  margin:auto;
  margin-top: 10px;
  margin-bottom: 15px;
}
.left_raisin {
  width: 100%;
} 
/*周り込みの解除*/
.float_none {
  clear: both;
  text-align:left;
  
} 
}


/*=============
画像左＋テキスト チャート用
=============*/

.box_raisin03 {
}
.box_raisin03 img {
  width:60%;
  margin:0 10px 0 0;
}
.right_raisin03 {
  width: 35%;
  display: inline-block;
  vertical-align: middle;
} 

@media screen and (max-width: 768px) {
.box_raisin03 img {
  width:100%;
  margin-top: 10px;
  margin-bottom: 15px;
}
.right_raisin03 {
  width: 100%;
} 
/*周り込みの解除*/
.float_none03 {
  clear: both;
  text-align:left;
  margin-top:40px;
  z-index: auto;
} 
}


/*=============
画像左＋テキスト 粒用
=============*/

.box_raisin04 {
}
.box_raisin04 img {
  width:25%;
  margin:0 10px 0 0;
}
.right_raisin04 {
  width: 65%;
  display: inline-block;
  vertical-align: middle;
} 

@media screen and (max-width: 768px) {
.box_raisin04 img {
  width:30%;
  margin-top: 10px;
  margin-bottom: 15px;
}
.right_raisin04 {
  width: 55%;
} 
/*周り込みの解除
.float_none04 {
  clear: both;
  text-align:left;
  margin-top:40px;
  z-index: auto;
} */
}


/*=============
画像左＋テキスト右
=============*/

.box_raisin05 {
  text-align:right;
}
.box_raisin05 img {
  width:45%;
  margin:0 10px 0 0;
  }
.left_raisin05 {
  width: 60%;
  display: inline-block;
  vertical-align: middle;
  align-items: flex-end;
  } 

.back05{
    padding: 10px 10px 10px 10px;
    border: 1px solid #333;
	display: inline-block;
	text-align: right;
	margin: 20px;

}

@media screen and (max-width: 768px) {
.box_raisin05 {
	text-align:left;
}
.box_raisin05 img {
  width:50%;
  margin:auto;
  margin-top: 10px;
  margin-bottom: 15px;
}
.left_raisin05 {
  width: 100%;
} 
/*周り込みの解除*/
.float_none05 {
  clear: both;
  text-align:left;
} 
.back05{
    padding: 10px 35px 10px 35px;
	text-align: center;
}

}


/*=============
背景画像に文字重ねる
=============*/

/* 大枠ボックス */
.layer{
  position: relative;
  margin: 0 auto;
  text-align: center;
}

/* アメリカ */
.layer-bg01{
  background: url(img/raisin_obiusa.jpg) no-repeat 0 0;
  background-size: 100%;
  height: 300px;
  margin-top: 50px;
  margin-bottom: 30px;
}
/* トルコ */
.layer-bg02{
  background: url(img/raisin_obitur.jpg) no-repeat 0 0;
  background-size: 100%;
  height: 300px;
  margin-bottom: 30px;
}
/* ウズベキスタン */
.layer-bg03{
  background: url(img/raisin_obiuzb.jpg) no-repeat 0 0;
  background-size: 100%;
  height: 300px;
  margin-bottom: 30px;
}
/* 中国 */
.layer-bg04{
  background: url(img/raisin_obichn.jpg) no-repeat 0 0;
  background-size: 100%;
  height: 300px;
  margin-bottom: 30px;
}

/* 重ねるボックスの設定 */
.layer-in_catch{
  position: absolute;
  top: 35%;
  right: 20px;
  bottom: 0;
  left: 0;
  margin: auto;
}

/* 重ねる文字の基本設定 */
.layer-txt_catch{
   font-size: 70px;
  text-shadow: 1px 1px 4px rgba(0,0,0,0.4);
  color: #fff;
  display:inline-block;
  vertical-align: middle;
  line-height:normal;
}


@media screen and (max-width: 768px) {
/* アメリカ */
.layer-bg01{
    height: 120px;
    margin-top: 50px;
    margin-bottom:0px;
   text-align:center;
}
/* トルコ */
.layer-bg02{
    height: 120px;
    margin-bottom:0px;
}
/* ウズベキスタン */
.layer-bg03{
    height: 120px;
    margin-top: 50px;
    margin-bottom:0px;
}
/* 中国 */
.layer-bg04{
    height: 120px;
    margin-top: 50px;
    margin-bottom:0px;
}
.layer-in{
    width: 100px;
    height: 70px;
  }
.layer-txt_catch{
   font-size: 40px;
   font-weight: bold;
}
}


/*=============
リード文
=============*/

.lead-txt{
   font-size: 20px;
   font-weight: bold;
}

@media screen and (max-width: 768px) {
.lead-txt{
   font-size: 14px;
   font-weight: bold;
}
}



/*=============
粒の部分
=============*/
.flex {
  display: flex; /*横並び*/
  align-items: flex-end; 
  justify-content: space-between;
}
.flex .image {
  width: 30%; /*画像サイズ指定*/
  margin: 0;
  padding: 0;
}
.flex .image img {
  width: 100%;
  height: auto;
}
.flex .text {
  margin: 0 0 0 5px;
  padding: 0;
}
.right_text{
  text-align: right;
}
.meyasu{
    font-size: 12px;
    letter-spacing: -0.1px;
}
@media screen and (max-width: 768px) {
.flex {
  display: inline-block;
  align-items: flex-end; 
  justify-content: space-between;
}
.flex .image {
  width: 100%; /*画像サイズ指定*/
}
.flex .image img {
  width: 100%;
  height: auto;
}
.flex .text {
   font-size: 14px;
}
.right_text{
  text-align: center;
}
}



/*=============
拡大用
=============*/
@media screen and (max-width: 768px) {
.lb {
    display: flex;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,.7);
    opacity: 0;
    transition: .3s opacity ease;
    pointer-events: none;
    z-index: 100;
}

.lb img {
    width: auto !important;
    max-height: 100%!important;
    cursor: pointer;
}

.lb img,
.lb iframe {
    transform: scale(.85);
    transition: .3s all ease;
}

.lb:target {
    opacity: 1;
    pointer-events: auto;
    z-index: 101;
}

.lb:target img,
.lb:target iframe {
    transform: scale(1);
}

/* 閉じるボタン*/
.lb::before,.lb::after {
    display: block;
    position: fixed;
    content: "";
    width: 24px;
    height:3px;
    top: 24px;
    right: 12px;
    background: #fff;
    border-radius: 4px;
}
.lb::before {
    transform: rotate(-315deg);
}
.lb::after {
    transform: rotate(315deg);
}
}
/*=============
横揺れ防止
=============*/
.mamapan {
  overflow:hidden;
  }  


/*余白調整*/
.row {
  margin-right: 0;
  margin-left: 0;
}


/*******/