@charset "UTF-8";
/*
@media screen and (max-width: 768px) {
*/
@media screen and (max-width: 860px) {

.pc {display:none;}
.mb {display:block;}
.pc_inline {display:none;}
.mb_inline {display:inline;}
.pc_inline_block {display:none;}
.mb_inline_block {display:inline-block;}

.pc_ip {display:none !important;}
.mb_ip {display:block !important;}
.pc_inline_ip {display:none !important;}
.mb_inline_ip {display:inline !important;}
.pc_inline_block_ip {display:none !important;}
.mb_inline_block_ip {display:inline-block !important;}


/*----------------------------------------
 * フォント
 *----------------------------------------*/
body {
	line-height:2em;
	font-size:0.9rem;
}

}/* @media screen and (max-width: 860px)  */



/* ========================================
 * 標準ブレークポイント 860px
 * ======================================== */

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

/*----------------------------------------
 * ヘッダー
 *----------------------------------------*/
header {
	height:60px;
	min-height:60px;
	padding-top:0;
	z-index:15;
}

header .std_width {
	width:100%;
	text-align:left;
}

/* ロゴ部分 */
header h1,
header .ja_logo {
	margin:0;
	padding:0;
}

header h1 {
	width:calc((100% - 60px) * 356 / (356 + 183)); 
	max-width:304px;
}

header .ja_logo {
	width:calc((100% - 60px) * 183 / (356 + 183)); 
	max-width:155px;
}

header h1 a,
header .ja_logo a {
	display:flex;
	align-items:center;
	height:60px;
}

header h1 a img,
header .ja_logo a img {
	width:100%;
	height:auto;
}

/* メニューボタン */
.mobile_button {
	position:absolute;
	top:0;
	right:0;
	width:60px;
	height:60px;
	box-sizing:border-box;
	z-index:17;
	font-size:30px;
	text-align:center;
	padding-top:13px;
	transition:background-color;
}

/* ナビゲーション（モーダルの中に表示）もともとのnavは非表示 */
header nav { display:none;}

.modal_bg nav {
	display:block;
	position:relative;
	width:80%;
	margin-left:auto;
	margin-right:auto;
	z-index:12;
}

.modal_bg nav ul {
	padding:1em 0;
}

.modal_bg nav ul li {
	text-align:center;
	padding:1em 0;
}

header nav.main_nav ul li a.sub_menu_button {
	display:block;
	position:absolute;
	width:60px;
	height:60px;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	top:11px;
	font-size:0.8em;
	right:-5%;
	top:6px;
/*
	padding:8px 15px;
*/
	color:#b10c1a;
}

header nav.main_nav ul li a.sub_menu_button:focus {
	outline:none;
}

/* サブナビゲーション */
header nav ul li .sub_nav {
	position:relative;
	display:block;
	/*
	background-color:rgba(250,250,250,1);
	*/
	width:100%;
	padding:0;
	padding-bottom:3px;
	top:0;
	z-index:10;
}

header nav ul li .sub_nav ul li a {
	font-size:1rem;
	font-weight:400;
	text-align:left;
}

header nav ul li .sub_nav ul li a,
header nav ul li .sub_nav ul li a:visited {
	color:black;
}

/*----------------------------------------
 * ページテンプレート
 *----------------------------------------*/
article {
/*
	padding-top:52px;
*/
}

/* 記事エリア */
section.article_area {
	padding-top:62px;
}

/* 冒頭の背景部分 */
section.article_area .heading_bg {
	height:250px;
}

/* パンクズナビゲーション */
.pan_nav_area {
	display:none;
}

/* 見出し */
section.article_area article .std_h1 {
	font-size:1.2rem;
	font-weight:400;
	margin:2em 0;
}

section.article_area article .std_h2 {
	font-size:1.2rem;
	margin:0.5em 0;
}

section.article_area article .std_h2:before {
	top:-8px;
}

section.article_area article .std_h2:after {
	top:-8px;
}

section.article_area article .std_h2.after {
	font-size:1.2rem;
	padding-bottom:1em;
}

section.article_area article .std_h2.after:before {
	bottom:0;
}


/*----------------------------------------
 * 基本書式
 *----------------------------------------*/

/*【かきがら】pタグマージンをリセット */

/*【かきがら】セカンドページ */
body.second_page {
	padding-top:60px;
}

/*【かきがら】標準背景1*/

/*【かきがら】記事エリア */

/*【かきがら】文字色 */


/*【かきがら】----- 見出し ----- */

/*【かきがら】h1エリア */

/* 【かきがら】見出しの下の波線 */
.heading_wave_1 {
	font-size:1.2rem;
	margin-bottom:0;
}

.heading_wave_1:after{
	height:10px;
	bottom:8px;
}

/* 【かきがら】h2見出しの上にアイコン、下に二本の波線 */
.heading_icon_wave {
	font-size:1.2rem;
	padding-bottom:25px;
}

.heading_icon_wave:after {
	height:20px;
	bottom:0px;
}


/* 【かきがら】セカンドページ共通のh2 */
.sec_h2_area .number{
	font-size:1.2rem;
}

.sec_h2_area .number span {
	font-size:0.7rem;
}

.sec_h2_area h2 {
	font-size:1.2rem;
	letter-spacing:0;
}

.sec_h2_area h2:after {
	height:15px;
	bottom:-25px;
}

/* 【かきがら】セカンドページ共通のh3 */
.std_h3 {
	font-size:1.1rem;
}

/* 【かきがら】セカンドページ共通のh4 */
.std_h4 {
	font-size:1.1rem;
}

/* 【かきがら】セカンドページ共通のh5 */
.std_h5 {
	font-size:1.05rem;
}

/* 【かきがら】リード文部分 */
.std_lead {
	font-size:1rem;
}

/* 【かきがら】ページ内ナビゲーション */
.std_nav {
	padding:0px 10px 20px 10px;
}

.std_nav.no-heading {
	padding-top:20px;
}


/* ページ内ナビ（共通） */
.sec_nav .std_flex,
.std_nav ul.std_flex {
	flex-wrap: wrap;
	gap: 0px;
	justify-content: space-between;
}
.sec_nav .std_flex li,
.std_nav ul.std_flex li {
	flex: 0 0 48%;
	width: 48%;
	padding-bottom:2em;
}

.sec_nav .std_flex li a.button,
.std_nav ul.std_flex li a.button{
	display:none;
}


/* 【かきがら】ページ内ナビゲーションのflex */

/* 【かきがら】囲み枠 */
.std_kakomi.kakomi1 {
	padding:10px;
}

/* 【かきがら】前後に波線を入れる装飾 */
.bf_af_wave:before,
.bf_af_wave:after {
	position:relative;
	display:block;
}

.bf_af_wave:before,
.bf_af_wave:after {
	display:block;
	position:relative;
	margin-left:auto;
	margin-right:auto;
}

.bf_af_wave:before { margin-bottom:10px;}
.bf_af_wave:after { margin-top:10px;}


/* 背景色 */

/* 背景 */

/* レイアウト */

/* std_column2用 */
.col2_40_40 .left {width:100%;}
.col2_40_40 .right {width:100%;}

.col2_48_48 .left {width:100%;}
.col2_48_48 .right {width:100%;}


/* BOX書式 */

/* flex */
.std_flex2 {
	display:block;
}

.std_flex2 .column{
	width:100%;
}

/* std_flex2用 */
.std_flex2.col2_40_40 > .column,
.std_flex2.col2_45_45 > .column,
.std_flex2.col2_49_49 > .column,
.std_flex2.col2_48_48 > .column,
.std_flex2.col2_47_47 > .column,
.std_flex2.col2_46_46 > .column,
.std_flex2.col2_80_20 > .column:nth-child(1) ,
.std_flex2.col2_80_20 > .column:nth-child(2) ,

.std_flex2.col2_76_20 > .column:nth-child(1) ,
.std_flex2.col2_76_20 > .column:nth-child(2) ,

.std_flex2.col2_70_30 > .column:nth-child(1) ,
.std_flex2.col2_70_30 > .column:nth-child(2) ,

.std_flex2.col2_66_30 > .column:nth-child(1) ,
.std_flex2.col2_66_30 > .column:nth-child(2) ,

.std_flex2.col2_60_40 > .column:nth-child(1) ,
.std_flex2.col2_60_40 > .column:nth-child(2) ,

.std_flex2.col2_56_40 > .column:nth-child(1) ,
.std_flex2.col2_56_40 > .column:nth-child(2) ,

.std_flex2.col2_40_56 > .column:nth-child(1) ,
.std_flex2.col2_40_56 > .column:nth-child(2) ,

.std_flex2.col2_30_66 > .column:nth-child(1) ,
.std_flex2.col2_30_66 > .column:nth-child(2) ,

.std_flex2.col2_30_68 > .column:nth-child(1) ,
.std_flex2.col2_30_68 > .column:nth-child(2) {
	width:100%;
	margin-bottom:1em;
}

.std_flex3 {
	display:block;
}

.std_flex3 .column{
	width:100%;
	margin-bottom:2em;
}

.std_flex3 .column .inner {
	width:70%;
	margin-left:auto;
	margin-right:auto;
}

/* 4カラム flex → 2カラム */
.std_flex4 {
	flex-wrap: wrap;
	gap: 16px;
	justify-content: space-between;
}
.std_flex4 .column {
	flex: 0 0 48%;
	width: 48%;
	margin-bottom: 0;
}




/* std_flex2用 */

/* grid */
.std_grid {
	grid-template-columns: 1fr;
	gap: 16px;
}


/* ドロップシャドウ */

/* 【かきがら】ボタン */
.std_button.bt1 a{
	font-size:0.9rem;
	padding:5px 2em;
}

.std_button.bt2 a{
	font-size:0.9rem;
	padding:10px 2em;
	line-height:1.5em;
}

.std_button.bt2 a:after {
	font-size:0.6rem;
	right:1em;
	top: 50%;
	transform: translateY(-50%) rotate(90deg);
}


/* リンクボタン */

/* リンクボタン（白） */


/* 2カラム（レイアウトパターン） */
.std_column2.lay_col2_1 {
}

.std_column2.lay_col2_1 .left {width:100%;}
.std_column2.lay_col2_1 .right {width:100%;}
.std_column2.lay_col2_1 .image {
	height:auto;
}


/* 3カラム（flex） */
.std_column3_flex {
	display:flex;
	flex-wrap:wrap;
}

.std_column3_flex .column {
	width:100%;
}




/* 定義 */
dl.std_dl {
	display:block;
}

dl.std_dl dt{
	width:calc(100% - 1em);
	padding:0.5em 0;
	text-align:left;
	padding-left:1em;
}
dl.std_dl dd {
	width:calc(100% - 1em);
	border-bottom:none;
	padding:0.5em 0 1em 0.5em;
}



/* 表 */
table.std_table,
table.std_table tbody,
table.std_table tr,
table.std_table th,
table.std_table td {
	display:block;
	text-align:left;
	background:none;
}

table.std_table th {
	border:none;
	padding:0.3em;
	padding-bottom:0;
}

table.std_table td {
	padding:0.3em;
}

table.std_table tr {
	margin-bottom:1em;
}

/* 写真の画面端まで拡大するレイアウト */
/* 共通設定 */
.photo_spread {
	display:block;
	flex-direction: row;
}

.photo_spread .ps_text_area { width:100%;}
.photo_spread .ps_photo_area { width:100%;}

.photo_spread .ps_photo {
	margin-left:unset;
	margin-right:unset;
	width:100%;
	border-radius:0px;
}

.photo_spread .ps_text_area .ps_text {
	float:none;
	width:100%;
	margin-right:unset;
	text-align:justify;
}

/* 文章右、写真左 */
.photo_spread.rev .ps_photo_area {}
.photo_spread.rev .ps_photo {
	margin-left:unset;
	width:100px;
	border-radius:0;
}

.photo_spread.rev .ps_text_area {}
.photo_spread.rev .ps_text_area .ps_text {
	float:none;
	width:100%;
	margin-left:unset;
	margin-right:unset;
}

/* お知らせ */
section.article_area .oshirase .post_line time {
	float:none;
}

section.article_area .oshirase .post_line div { 
	margin-left:0;
}


/* フォーム */
.std_form dl {
	display:flex;
	flex-wrap:wrap;
	margin-top:0;
	padding-top:1em;
}

.std_form dl dt {
	width:100%;
}

.std_form dl dd {
	width:100%;
	margin-left:0;
	margin-top:20px;
}

.std_form.confirm dl dt {width:100%;}
.std_form.confirm dl dd {width:100%;}

.std_form input[type=text],
.std_form textarea {
	padding:0.5em;
}

.std_form input[type=submit],
.std_form input[type=button]{
	padding:1em 2em;
	max-width:100%;
}

.std_form select {
	padding:0.5em 2.5em 0.5em 1em;
	font-size:1rem;
}

.std_form .select_wrapper{

}


/*----------------------------------------
 * ページトップへ
 *----------------------------------------*/
.totop {
	width:70px;
	height:70px;
	right:5px;
	font-size:12px;
	line-height:1.6em;
}

.totop a {
	padding-top:8px;
}

.totop a:before {
	top:15px;
}

.totop a:after {
	top:11px;
}



/*----------------------------------------
 * フッター
 *----------------------------------------*/
footer.std_padding_bottom {
	padding-bottom:100px;
}

footer .two_banner {
	font-size:1rem;
}

footer .two_banner .left a,
footer .two_banner .right a {
	padding:30px 0;
}



footer .std_column2 .left,
footer .std_column2 .right {
	margin-bottom:0;
	width:100%;
}

footer .std_column2 .left a {
	display:block;
}

footer .std_column2 .left a img {
	width:90%;
	height:auto;
	vertical-align:top;
}

footer .std_column2 .left .logo { width:90% !important; height:auto;}
footer .std_column2 .left .marubeni { width:60%; height:auto;}

footer .std_column2 .left div a img {
	width:50%;
	height:auto;
}

footer .std_column2 .right .column {
	float:none;
	width:90%;
	margin-left:auto;
	margin-right:auto;
	padding-top:10px;
}

footer .std_column2 .right .column:nth-child(3) {
	margin-right:auto;
}

footer .std_column2 .right .column div {
	position:relative;
	padding-bottom:10px;
	border-bottom:1px solid #ccc;
}

footer .std_column2 .right .column div.sub_nav {
	display:none;
	border-bottom:none;
}

footer .std_column2 .right .column div.sub_nav ul li {
	margin-right:0;
	width:calc(100% - 1em);
}

footer .std_column2 .right .column div a:after {
	background:#db0113 url(../images/share/corp_mb_sub_menu_link.png) no-repeat center center;
	background-size:cover;
	content: "";
	position:absolute;
    font-weight: 300;
	font-size:0.8rem;
	right:0;
	background-color:#db0113;

	color:white;
	border-radius:100px;
	width:1em;
	height:1em;
	line-height:1em;
	text-align:center;
	padding:0.2em;
	top:0.5em;
}




footer .std_column2 .right .column a.footer_sub_menu_button {
	position:absolute;
	display:block;
	font-weight:300;
	font-size:0.8rem;
	right:0;
	background-color: #db0113;
	color: white;
	border-radius: 100px;
	width: 1em;
	height: 1em;
	line-height: 1em;
	text-align: center;
	padding: 0.2em;
	top: 2.7em;
}

footer .std_column2 .right .column a.sub_nav_a:after,
footer .std_column2 .right .column a.footer_sub_menu_button:after {
	display:none;
}

footer .std_column2 .right .column ul {
	margin-top:15px;
}

footer .std_column2 .right .column ul li {
	padding-bottom:10px;
}

footer .std_column2 .right .column ul li a:after {
	content:none;
}

footer .std_column2 .right ul.other {
	margin-top:40px;
}
footer .std_column2 .right ul.other li{
	font-size:0.75rem;
}

}

/* ----------------------------------------
 * STEP3: スマホレイアウト追加
 * ---------------------------------------- */
@media screen and (max-width: 860px) {

	/* 2カラム grid → 1カラム */
	.std_grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	/* 4カラム flex → 2カラム（必要なら後で調整） */
	.std_flex4 {
		flex-wrap: wrap;
		gap: 16px;
		justify-content: space-between;
	}
	.std_flex4 .column {
		flex: 0 0 48%;
		width: 48%;
		margin-bottom: 0;
	}
}

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

	/* ナビ：1列表示 */
/*
	.sec_nav .std_flex li,
	.std_nav ul.std_flex li {
		flex: 0 0 100%;
		width: 100%;
	}
*/
	.products .sec_nav .std_flex {
		flex-wrap:wrap;
		gap:2%;
		justify-content:center;
	}
	
	.products .sec_nav .std_flex .column {
/*
		flex: 0 0 48%;
*/
		flex: 0 0 31%;
        box-sizing: border-box;
        margin-bottom: 20px;
        padding: 5px;
	}

	/* 4カラム flex：1列へ */
	.std_flex4 .column {
		flex: 0 0 100%;
		width: 100%;
	}

	/* satoumi_nougyou：SDGs 2アイコンは狭い画面では縦に */
	.satoumi_nougyou .sec_intro .std_flex2 {
		display: block;
	}
	.satoumi_nougyou .sec_intro .std_flex2 .column {
		width: 100%;
		margin-bottom: 10px;
	}
	.satoumi_nougyou .sec_3 .sec_3_images img {
		width: 100%;
	}
}


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

/*----------------------------------------
 * 【かきがら】トップページ
 *----------------------------------------*/
 
 /* トップスライドはkakigara_anime.cssで設定 */


.toppage .main .std_width {
	position:absolute;
	width:100%;
	height:auto;
	bottom:-20px;
}

.toppage .main .std_width .main_left,
.toppage .main .std_width .main_right {
	position:relative;
	width:80%;
	margin:0 auto;
	margin-top:10px;
}

/* お知らせ部分 */
.toppage .info h2 {
	font-size:1.2rem;
}

.toppage .info .std_column2 .left {
	margin-bottom:60px;
}

/* 近況報告部分 */
.toppage .info .std_column2 .right .std_flex3 {
	display:block;
}

.toppage .info .std_flex3 .column {
	width:100%;
	display:flex;
	justify-content:space-between;
}

.toppage .info .std_flex3 .column { margin-bottom:1em;}
.toppage .info .std_flex3 .column a { width:30%;}
.toppage .info .std_flex3 .column > div { width:65%;}

/* 里海と農業の関係 */
.toppage .satoumi_nougyou:before {
	-webkit-mask-image: linear-gradient(to right, #999 0%, transparent 110%, transparent);
	mask-image: linear-gradient(to right, #999 0%, transparent 110%, transparent);
}

/* かきがらを使った農畜産物 */
/*
.toppage .kakigara_products .std_flex {
	flex-wrap:wrap;
	gap:2%;
}

.toppage .kakigara_products .std_flex .column {
	flex:0 0 48%;
	box-sizing:border-box;
	margin-bottom:20px;
	padding:5px;
}
*/

/* 取り組み・活動 */
.toppage .sec_nav .std_nav {
	padding-left:0;
	padding-right:0;
}

.toppage .sec_nav .std_nav .std_nav {
}

.toppage .sec_nav .std_nav .std_flex li {
	flex:0 0 47%;
	padding-bottom:1em;
}

.toppage .sec_nav .std_nav .std_flex li a.button {
	display:none;
}

/* 最近の取り組み・活動 */
.toppage .activities_instagram .std_flex2.col2_47_47 .column {
	display:flex;
	justify-content:space-between;
	margin-bottom:1em;
}

.toppage .activities_instagram .std_flex2.col2_47_47 .column a {
	width:30%;
}

.toppage .activities_instagram .std_flex2.col2_47_47 .column > div {
	margin-top:0 !important;
	width:67%;
}

/*----------------------------------------
 * 【かきがら】里海と農業の関係
 *----------------------------------------*/

/* satoumi_nougyou：intro 両サイド画像はスマホでは非表示 */
.satoumi_nougyou .sec_intro .std_flex3 .column.lf,
.satoumi_nougyou .sec_intro .std_flex3 .column.rg {
	display: none;
}
.satoumi_nougyou .sec_intro .std_flex3 .column.md {
	width: 100%;
}

/* satoumi_nougyou：intro の SDGs 2アイコンだけ横並び維持 */

.satoumi_nougyou .sec_intro .std_flex2 {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	width:75%;
}
.satoumi_nougyou .sec_intro .std_flex2 .column {
	width: 36%;
}

.satoumi_nougyou .sec_intro .std_flex3 .column {
	margin-bottom:0;
}

.satoumi_nougyou .std_nav li:nth-child(3),
.satoumi_nougyou .std_nav li:nth-child(4) {
	padding-bottom:0;
}

/* sec_1 */
.satoumi_nougyou .sec_1 .waku {
	padding:20px 15px 15px 15px;
}

.satoumi_nougyou .sec_1 .waku.std_margin_top2 {
	margin-top:2em;
}

.satoumi_nougyou .sec_1 .waku h4 span{
	font-size:1rem;
}

.satoumi_nougyou .sec_1 .waku .std_flex2 {
	display:flex;
}

.satoumi_nougyou .sec_1 .waku .std_flex2.col2_47_47 > .column {
	width:46%;
	line-height:1.5em;
	font-size:0.85rem;
}

.satoumi_nougyou .sec_1 .sec_1_2 ul {
	padding-left:0;
}

.satoumi_nougyou .sec_1 .sec_1_2 ul li .std_flex2 {
	display:flex;
}

.satoumi_nougyou .sec_1 .sec_1_2 ul li .column:nth-child(1) {width:5rem;}
.satoumi_nougyou .sec_1 .sec_1_2 ul li .column:nth-child(2) {width:calc(100% - 5rem); margin-bottom:2em;}

.satoumi_nougyou .sec_1 .sec_1_2 ul li .column .point {
	font-size:0.5rem;
}

.satoumi_nougyou .sec_1 .sec_1_2 ul li .column .point span {
	font-size:0.7rem;
}

.satoumi_nougyou .sec_1 .sec_1_2 ul li .column .point strong {
	font-size:1.5rem;
}

.satoumi_nougyou .sec_1 .sec_1_2 .tayousei .std_flex2 {
	display:flex;
}

.satoumi_nougyou .sec_1 .sec_1_2 .tayousei .std_flex2.col2_48_48 > .column {
	width:48%;
}

.satoumi_nougyou .sec_1 .sec_1_3 .std_flex2 {
	display:flex;
}

.satoumi_nougyou .sec_1 .sec_1_3 .std_h3 {
	margin-bottom:1em;
}

.satoumi_nougyou .sec_1 .sec_1_3 .std_flex2 .std_flex2.col2_48_48 > .column {
	width:48%;
	line-height:1.5em;
	font-size:0.85rem;
	margin-bottom:2em;
}

.satoumi_nougyou .sec_1 .sec_1_4 .w80p {
	width:100%;
}

.satoumi_nougyou .sec_1 .sec_1_4 .column {
	width:80%;
	margin:1em auto;
}

	/* satoumi_nougyou：sec_3 の空カラムはスマホでは消す */
	.satoumi_nougyou .sec_3_1 > .column:last-child {
		display: none;
	}

	/* satoumi_nougyou：sec_3 の画像コラージュを簡易グリッドに */
	.satoumi_nougyou .sec_3 .sec_3_images {
/*
		height: auto;
		z-index: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		margin-top: 20px;
*/
	}
	.satoumi_nougyou .sec_3 .sec_3_images img {
/*
		position: static;
		width: calc(50% - 5px);
		height: auto;
		margin: 0;
*/
	}

.satoumi_nougyou .sec_3 .sec_3_images { position:relative;height:45vh;z-index:-1;}
.satoumi_nougyou .sec_3 .sec_3_images img { position:absolute; border-radius:10px;}
.satoumi_nougyou .sec_3 .sec_3_images .img01 { right:10%;	bottom:-2%;				width:auto; height:13vh; aspect-ratio:286 /  160;}	/* satoumi */
.satoumi_nougyou .sec_3 .sec_3_images .img02 { right:12%;	bottom:15vh;			width:auto; height:9vh; aspect-ratio: 211 / 167;}	/* キュウリ */
.satoumi_nougyou .sec_3 .sec_3_images .img03 { right:40%;	bottom:13vh;			width:auto; height:9vh; aspect-ratio: 200 / 167;}	/* ナス */
.satoumi_nougyou .sec_3 .sec_3_images .img04 { left:14%;	bottom:12vh;			width:auto; height:12vh; aspect-ratio: 176 / 200;}	/* 豚 */
.satoumi_nougyou .sec_3 .sec_3_images .img05 { right:6%;	bottom:25vh;			width:auto; height:10vh; aspect-ratio: 220 / 168;}	/* 里海 */
.satoumi_nougyou .sec_3 .sec_3_images .img06 { left:6%;		bottom:25vh;			width:auto; height:9vh; aspect-ratio: 244 / 178;}	/* アマモ */
.satoumi_nougyou .sec_3 .sec_3_images .img07 { right:40%;	bottom:23vh;top:unset;	width:auto; height:12vh; aspect-ratio: 196 / 224;}	/* 稲の花 */
.satoumi_nougyou .sec_3 .sec_3_images .img08 { right:0%;	bottom:36vh;top:unset;	width:auto; height:9vh; aspect-ratio: 220 / 160;}	/* 田んぼ */
.satoumi_nougyou .sec_3 .sec_3_images .img09 { right:38%;	bottom:36vh;top:unset;	width:auto; height:9vh; aspect-ratio: 260 / 188;}	/* 牡蠣  */
.satoumi_nougyou .sec_3 .sec_3_images .img10 { left:-3%;	bottom:50vh;top:unset;	width:auto; height:9vh; aspect-ratio: 224 / 162;}
.satoumi_nougyou .sec_3 .sec_3_images .img11 { left:-2%;	bottom:35vh;top:unset;	width:auto; height:9vh; aspect-ratio: 240 / 176;}	/* 稲刈り  */
.satoumi_nougyou .sec_3 .sec_3_images .img12 { right:-4%;	bottom:63vh;top:unset;	width:auto; height:15vh; aspect-ratio: 308 / 222;display:block;}
.satoumi_nougyou .sec_3 .sec_3_images .img13 { right:36%;	bottom:63vh;top:unset;	width:auto; height:15vh; aspect-ratio: 321 / 226;}	/* かきがら */
.satoumi_nougyou .sec_3 .sec_3_images .img14 { left:-4%;	bottom:63vh;top:unset;	width:auto; height:15vh; aspect-ratio: 278 / 220;}	/* イカダ */

.satoumi_nougyou .sec_3 .sec_3_2 .mondai_waku {
	padding:10px 8px;
}

.satoumi_nougyou .sec_3 .sec_3_2 .mondai_waku h3,
.satoumi_nougyou .sec_3 .sec_3_2 .taisaku_waku h3 {
	margin-top:-2em;
	font-size:1rem;
}

.satoumi_nougyou .sec_3 .sec_3_2 .mondai_waku .lead {
	font-size:1.1rem;
	text-align:left;
}

.satoumi_nougyou .sec_3 .sec_3_2 .mondai_waku .lead.line2 {
	padding:0.5em 0;
}

.satoumi_nougyou .sec_3 .sec_3_2 .column .w20p {
	width:15%;
	padding-top:1em;
	padding-bottom:1em;
}

.satoumi_nougyou .sec_3 .sec_3_2 .taisaku_waku {
	padding:10px 8px;
	margin-bottom:4rem;
}

.satoumi_nougyou .sec_3 .sec_3_2 .column:last-child .taisaku_waku {
	margin-bottom:0rem;
}

.satoumi_nougyou .sec_3 .sec_3_2 .taisaku_waku .std_button.bt2 a:after {
	top: 0;
	line-height:1em;
	transform: translateY(1.2rem) rotate(90deg);
}


/* satoumi_nougyou：SDGs アイコンは折り返し */
.satoumi_nougyou .sec_4 .sdgs_icon {
	flex-wrap: wrap;
	justify-content: center;
}
.satoumi_nougyou .sec_4 .sdgs_icon img {
	width: 30%;
	max-width: 130px;
}

.satoumi_nougyou .sec_4 .std_flex3 .column {
	width:100%;
	box-sizing:border-box;
}



/*----------------------------------------
 * 【かきがら】かきがらを使った農畜産物
 *----------------------------------------*/

.products .sec_nav > div.std_padding_top {
	padding-top:0px;
}

.products .sec_nav .std_flex .column a.button {
    font-size: 0.6rem;
    padding-top: 0.5em;
    width: 2em;
    height: 2em;
    margin: 5px auto 10px auto;
}

.products .sec_nav .std_flex .column .blur {
    backdrop-filter: blur(2px);
  border-radius:10px;
}

.products .sec_1 h2 img {
	width:100%;
	height:auto;
}

.products .sec_1 .std_lead {
	text-align:left;
}

.products .sec_1 .std_grid {
	grid-template-columns: 1fr;
	gap:2em;
}

.products .sec_1 .std_flex3 .column {
	position:relative;
	width:100%;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}

.products .sec_1 .std_flex3 img.photo {
	width:50%;
	/*
	margin-right:0;
	*/
	margin:0;
	order:2;
}

.products .sec_1 .std_flex3 h3 {
/*
	position:absolute;
*/
	margin:0;
	left:0;
	width:50%;
	order:1;
}

.products .sec_1 .std_flex3 .column > div {
	order:3;
}

.products .sec_1 .std_grid > div {
	width:100%;
	padding:0 0 2em 0;
	border-right:none;
}

.products .sec_1 .std_grid > div:nth-last-child(-n+2){
	border-bottom:2px dashed var(--col_dark);
}

.products .sec_1 .std_grid > div:last-child {
	border-bottom:none;
	padding-bottom:0;
}

.products .sec_1 .std_flex3 h3 img {
	width:80%;
	height:auto;
	display:block;
	margin:0 auto;
}

.products .sec_1 .std_kakomi h4 {
	font-size:1em;
	line-height:1.5em;
}

.products .sec_1 .std_kakomi h4:before,
.products .sec_1 .std_kakomi h4:after {
	display:block;
	margin:10px auto;
}

.products .sec_1 .std_kakomi h5 {
	margin-bottom:0.5em;
}

.products .sec_2 {
	padding-top:0;
	overflow:hidden;
}

.products .sec_2 > img.bg_satoumisyu {
	position:absolute;
	width:50%;
	height:auto;
	aspect-ratio:188 / 158;
	margin-bottom:20px;
}

.products .sec_2 h2 {
	width:85%;
	height:auto;
	aspect-ratio:188 / 100;
	margin:0 0 0 32%;
	margin-bottom:1em;
	display:table-cell;
	display:flex;
	align-items:center;
}

.products .sec_2 h2 img {
	width:100%;
	height:auto;
}

.products .sec_2 .sec_2_1 > .column:first-child {
	display: none;
}
.products .sec_2 .sec_2_1 > .column:last-child {
	width: 100%;
}

.products .sec_2 .bf_af_wave:before,
.products .sec_2 .bf_af_wave:after {
	display:block;
	position:relative;
	margin-left:auto;
	margin-right:auto;
}

.products .sec_2 .bf_af_wave:before { margin-bottom:10px;}
.products .sec_2 .bf_af_wave:after { margin-top:10px;}

.products .sec_2 .sec_2_2 .std_flex3 {
	display:flex;
}

.products .sec_2 .sec_2_2 .std_flex3 .column {
	width:30%;
}

.products .sec_2 .sec_2_2 .std_flex2 {
	display:flex;
}

.products .sec_2 .sec_2_2 .std_flex2 .under_the_sea .left img{
	width:100%;
	height:auto;
}

.products .sec_2 .sec_2_2 .std_flex2 .under_the_sea .right {
	padding-top:0;
	width:60%;
	margin:0 auto;
}

.products .sec_2 .sec_2_2 .std_flex2 .under_the_sea .right img{
	width:100%;
	height:auto;
	display:block;
}

.products .sec_3 {
	padding-top:0;
	overflow:hidden;
}

.products .sec_3 > img.bg_tamago {
	position:absolute;
	right:0;
	width:60%;
	height:auto;
	aspect-ratio:320 / 207;
	margin-bottom:20px;
}

.products .sec_3 h2 {
	width:68%;
	height:auto;
	aspect-ratio:320 / 207;
	margin:0;
	margin-bottom:1em;
	display:table-cell;
	display:flex;
	align-items:center;
}

.products .sec_3 h2 img {
	width:100%;
	height:auto;
	margin:0 0 0 -17%;
}

.products .sec_3 .sec_3_1 {
	display:flex;
}
.products .sec_3 .sec_3_1 .left,
.products .sec_3 .sec_3_1 .right {
	width:50%;
}

.products .sec_3 .sec_3_1 .left img {
	width:160%;
}
.products .sec_3 .sec_3_1 .right img {
	width:140%;
}

.products .sec_3 .sec_3_1 .right img {
	margin-top:90%;
	margin-left:-40%;
}

.products .sec_3 .sec_3_2.std_flex2 {
	display:flex;
}

.products .sec_3 .sec_3_2 .column {
	width:48%;
	margin-bottom:0;
}

.products .sec_3 .sec_3_2 .column img {
	display:block;
}

.products .sec_4 h2 {
	padding:40px 0;
}

.products .sec_4 h2 img {
	width:40%;
}



.products .sec_4 .std_grid {
	grid-template-columns: 1fr 1fr 1fr;
	gap:0;

}

.products .sec_4 .std_grid img.icon {
	width:100%;
	height:auto;
}

.products .sec_4 .std_grid img.photo {
	width:100%;
	height:auto;
}

.products .sec_4 .std_grid > div:nth-child(4n){
	border-right:none;
}

.products .sec_4 .std_grid > div:nth-child(n+5){
	border-bottom:none;
}

.products .sec_4 .std_grid .column {
	padding:0 15px 15px 10px;
	font-size:0.7rem;
	line-height:1.5em;
}

.products .sec_4 .std_grid > div {
	border-right:2px dashed var(--col_dark);
	border-bottom:2px dashed var(--col_dark);
}

.products .sec_4 .std_grid > div:nth-child(3n){
	border-right:none;
}

.products .sec_4 .std_grid > div:nth-child(4n){
	border-right:2px dashed var(--col_dark);
}

.products .sec_4 .std_grid > div:nth-child(n+5){
	border-bottom:2px dashed var(--col_dark);

}
.products .sec_4 .std_grid > div:nth-child(7){
	border-bottom:none;
}

.products .sec_4 .std_grid img.icon {
	width:60%;
	margin:10px auto;
}

/* products：出荷カレンダーは横スクロール */
.products .sec_4 .syukka_table {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.products .sec_4 .syukka_table table {
	min-width: 860px;
}

.products .sec_5 .bg_kurobuta {
	width:100%;
	height:auto;
	position:relative;
	display:block;
}

.products .sec_5 .h2_area h2 {
	margin:0 auto 40px auto;
}

.products .sec_5 .h2_area h2 img {
	width:50%;
}

.products .sec_5 .std_flex2 {
	display:flex;
}

.products .sec_5 .std_flex2 .left,
.products .sec_5 .std_flex2 .right {
	width:49%;
	line-height:1.5em;
	
}

/*----------------------------------------
 * 【かきがら】瀬戸内海クライシス
 *----------------------------------------*/
.setonaikai_crisis .sec_intro .std_flex2 .right .bg{ 
	height:200px;
	width:100%;
	border-radius:10px;
}

.setonaikai_crisis .crisis_div {
    font-size: 0.8rem;
	letter-spacing: 0em;
}

.setonaikai_crisis .crisis_div span{
	padding:5px;
}

.setonaikai_crisis h2 {
	font-size:1.2rem;
	margin-top:0.5em;
	margin-bottom:0.5em;
}

.setonaikai_crisis .sec_1 .fig_1_wrap,
.setonaikai_crisis .sec_1 .fig_2_wrap {
	display:flex;
	margin-bottom:2em;
}

.setonaikai_crisis .sec_1 .fig_1_wrap .std_flex.fig_1,
.setonaikai_crisis .sec_1 .fig_2_wrap .fig_2_wrap2 {
	width:90%;
	order:2;
}

.setonaikai_crisis .sec_1 .fig_1_wrap > .std_margin_bottom3 {
	content:"";
	display:block;
	width:10%;
	order:1;
	background:url(../images/setonaikai_crisis/mb_arrow_3.svg) no-repeat center center;
	background-size:100% auto;;
}

.setonaikai_crisis .sec_1 .fig_1_wrap > .std_margin_bottom3 img {display:none;}

.setonaikai_crisis .sec_1 .std_flex.fig_1,
.setonaikai_crisis .sec_1 .std_flex.fig_2 {
	display:flex;
	flex-wrap:wrap;
	font-size:0.7rem;
	margin-bottom:0;
}

.setonaikai_crisis .sec_1 .std_flex.fig_1 .column,
.setonaikai_crisis .sec_1 .std_flex.fig_2 .column,
.setonaikai_crisis .sec_1 .std_flex.fig_3 .column {
	width:47%;
	margin-bottom:1em;
}

.setonaikai_crisis .sec_1 .std_flex.fig_1 .column:nth-child(2n+1):after,
.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(2n+1):after {
	background:url(../images/setonaikai_crisis/mb_arrow_1.svg) no-repeat center center;
	content:'';
	position:absolute;
	display:block;
	right:-12%;
	top:30%;
	width:10%;
	height:9%;
	background-size:cover;
}

.setonaikai_crisis .sec_1 .std_flex.fig_1 .column:nth-child(2n+2):after,
.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(2n+2):after {
	background:url(../images/setonaikai_crisis/mb_arrow_2.svg) no-repeat center center;
	content:'';
	position:relative;;
	display:block;
	width:70vw;
	height:auto;
	aspect-ratio:320 / 40;
	left:-100%;
	top:0;
	background-size:cover;
	margin-top:1em;
}

.setonaikai_crisis .sec_1 .std_flex.fig_1 .column:nth-child(5):after,
.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(2):after {
	display:none;
}

.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(3) {
	margin-left:21.5vw;
	margin-right:20vw;
}

.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(3):before {
	background:url(../images/setonaikai_crisis/mb_arrow_5.svg) no-repeat center center;
	content:'';
	position:relative;
	display:block;
	right:unset;
	top:unset;
	width:70vw;
	aspect-ratio:320 / 40;
	height:unset;
	background-size:cover;
	margin:0 0 1em -40%;
}

.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(3):after {
	background:url(../images/setonaikai_crisis/mb_arrow_6.svg) no-repeat center center;
	content:'';
	position:relative;
	display:block;
	right:unset;
	top:unset;
	width:70vw;
	aspect-ratio:320 / 40;
	height:unset;
	background-size:cover;
	margin:0 0 0 -40%;
}

.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(3) div {
	margin-bottom:1em;
}

.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(4):after,
.setonaikai_crisis .sec_1 .std_flex.fig_2 .column:nth-child(5):after {
	background:url(../images/setonaikai_crisis/mb_arrow_4.svg) no-repeat center center;
	content:'';
	position:relative;;
	display:block;
	right:0;
	top:0;
	left:unset;
	aspect-ratio:1 / 1;
	width:10%;
	height:10%;
	background-size:cover;
	margin:1em auto;
}

.setonaikai_crisis .sec_1 .col2_fig_3:before {
	display:none;
}

.setonaikai_crisis .sec_1 .std_column2.col2_fig_3,
.setonaikai_crisis .sec_1 .std_column2.col2_fig_3 .left,
.setonaikai_crisis .sec_1 .std_column2.col2_fig_3 .right {
	display:block;
	width:100%;
}

.setonaikai_crisis .sec_1 .std_column2.col2_fig_3 .right .column:before,
.setonaikai_crisis .sec_1 .std_column2.col2_fig_3 .right .column:after {
	display:none;
}

.setonaikai_crisis .sec_1 .col2_fig_3 > .left .w70p {
	margin-left:0;
	width:100%;
}

.setonaikai_crisis .sec_1 .col2_fig_3 > .left img {
	width:25%;
	height:auto;
	margin-bottom:2%;
}

.setonaikai_crisis .sec_1 .col2_fig_3 > .left {
	font-size:0.85rem;
	line-height:1.6em;
	text-align:justify;
}

.setonaikai_crisis .sec_1 .fig_2_wrap:after {
	content:'';
	display:block;
	width:10%;
	order:1;
	background:url(../images/setonaikai_crisis/mb_arrow_7.svg) no-repeat center top;
	background-size:cover;
}

.setonaikai_crisis .sec_2 .sec_2_1 > div:nth-child(1) > div:nth-child(1) {
	margin-bottom:20px;
}

.setonaikai_crisis .sec_2 .sec_2_1 > div:nth-child(1) > div:nth-child(2) {
	float:left;
	width:48%;
}

.setonaikai_crisis .sec_2 .sec_2_1 > div:nth-child(1) > div:nth-child(3) {
	float:right;
	width:48%;
	font-size:0.7rem;
	line-height:1.5em;
}

.setonaikai_crisis .sec_2 .sec_2_1 > div:nth-child(2) {
	text-align:center;
}

.setonaikai_crisis .sec_2 .sec_2_1 > .column:before  {
	content:'';
	display:block;
	clear:both;
}

.setonaikai_crisis .sec_2 .photo_chinu {
	margin-top:1em;;
	
}

.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	margin-top:2em;
}

.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 .column:nth-child(1),
.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 .column:nth-child(2) {
	width:50%;
	margin-bottom:1em;
}
.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 .column:nth-child(3) {
	width:100%;
}

.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 .column:nth-child(1) img,
.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 .column:nth-child(2) img {
	display:block;
	position:relative;
	width:140%;
	height:auto;
}

.setonaikai_crisis .sec_2 .sec_2_1 .std_flex3 .column:nth-child(2) img {
	left:-40%;
	margin-top:80%;
}

.setonaikai_crisis .sec_2_2 h4 {
	float:none;
	width:100%;
	margin-bottom:1em;
}

.setonaikai_crisis .sec_2_2 img {
	width:100%;
	margin-bottom:1em;
}

.setonaikai_crisis .sec_2_3.std_flex2.w90p {
	width:100%;
}

.setonaikai_crisis .sec_2_3.std_flex2 > .column {
	width:100%;
}

.setonaikai_crisis .sec_2_3.std_flex2 > .column .std_flex2 {
	display:flex;
}

.setonaikai_crisis .sec_2_3.std_flex2 > .column .std_flex2 .column {
	width:48%;
}


.setonaikai_crisis .sec_3 {
	padding-bottom:0px;
}

.setonaikai_crisis .sec_3_2_1 .column {
	width:100%;
}

.setonaikai_crisis .sec_3_2_1 .flex_image {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin-top:2em;
}

.setonaikai_crisis .sec_3_2_1 .flex_image div {
	position:relative;
	width:48%;
}

.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(1) ,
.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(2) ,
.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(3) ,
.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(4) {
	left:0;top:0;
}

.setonaikai_crisis .sec_3_2_1 .flex_image div img {
	position:relative;
	border-radius:10px;
}

.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(1) img { width:140%; height:auto;}
.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(2) img { width:140%; height:auto; right:0;margin-top:90%;margin-left:-40%;}
.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(3) img { width:160%; height:auto;margin-top:-20%;}
.setonaikai_crisis .sec_3_2_1 .flex_image div:nth-child(4) img { width:160%; height:auto; right:0;margin-top:65%;margin-left:-60%;}


.setonaikai_crisis .sec_3_2_2.std_padding_top {
	padding-top:0;
}


/*----------------------------------------
 * 【かきがら】取り組み・活動
 *----------------------------------------*/
.activity .sec_h2_area .number {
	width:3em;
	height:3em;
	font-size:1.5em;
	line-height:1.2em;
	padding:0.4em;
}

.activity .sec_h2_area .number span {
	font-size:0.7rem;
}

.activity .sec_2 .w30p {
	width:80%;
}

.activity .sec_2 .sairiyou_ryou {
	font-size:2rem;
}

.activity .sec_2 .sairiyou_ryou strong {
	font-size:4rem;
}

.activity .sec_5 .col2_56_40 .image_area {
	height:auto;
}

.activity .sec_5 .col2_56_40 .image_area img:nth-child(1) {
	position:relative;
	margin-bottom:70px;
}

.activity .sec_5 .col2_56_40 .image_area img:nth-child(2) {
	top:70px;
	bottom:unset;
}

.activity .sec_5 .sec_5_fl3_1{
	display:flex;
	justify-content:space-between;
}

.activity .sec_5 .sec_5_fl3_1 .column {
	width:31%;
}

.activity .sec_5 .std_flex2.sec_5_4 {
	border-radius:10px;
	display:flex;
}

.activity .sec_5 .std_flex2.sec_5_4 > .column:nth-child(1) {
	width:100%;
	height:200px;
}

.activity .sec_5 .std_flex2.sec_5_4 > .column:nth-child(2) {
	width:100%;
	padding:10px;
}

.activity .sec_5 .std_flex2.sec_5_4 .std_flex2.sec_5_4_1 .column:nth-child(1) {
	padding:0;
}

.activity .sec_5 .std_flex2.sec_5_4 .std_flex2.sec_5_4_1 .column:nth-child(2) {
	width:60%;
	margin:0 auto;
}

.activity .sec_6 .tsumitate {
	font-size:3rem;
	line-height:1em;
}

.activity .sec_6 .tsumitate span {
	font-size:1.5rem;
}

.activity .sec_7 .std_flex3 img {
	display:block;
	height:200px;
	width:auto;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:1em;
}


/*----------------------------------------
 * 【かきがら】事業概要
 *----------------------------------------*/
.jigyou .sec_1 .std_flex2.sec_1_1 .rad20,
.jigyou .sec_1 .std_flex2.sec_1_2 .rad20 {
	height:200px;
}

/*----------------------------------------
 * 【かきがら】お知らせ・最近の活動
 *----------------------------------------*/
.info .std_width_info {
	width:90%;
}

.info .std_width_info.article h2 {
	font-size:1.2rem;
	letter-spacing:0;
}


.info .std_width_info.article h2 {
	font-size:1.2rem;
	letter-spacing:0;
}

.info .std_width_info.article .page_link {}

.info .std_width_info.article .page_link > div {
	width:48%;
}

.info .std_width_info.article .std_flex3 .column > a {
	float:left;
	display:block;
	width:30%;
}

.info .std_width_info.article .std_flex3 .column > time,
.info .std_width_info.article .std_flex3 .column > div {
	margin-left:35%;
	display:block;
	text-align:left;
}

.info .std_width_info.article .std_flex3 .column > div .f18 {
	font-size:0.875rem;
}

.info .std_width_info.article .std_flex3 .column div.tag_area,
.info .std_width_info.article .std_flex3 .column div.f14 {
	clear:left;
	margin-left:0;
	width:100%
}

.info .std_width_info.article .tag_area a {
	font-size:0.8rem;
	display:inline-block;
}


} /* @media screen and (max-width: 860px) */