﻿@charset "UTF-8";

/* 基本設定
----------------------------------------------- */
body {
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "游ゴシック体 Medium", "Yu Gothic Medium", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	font-size:15px;
	line-height:1.8em;
	font-weight:400;
}

/* マージン設定用
----------------------------------------------- */
.m20	{ margin-top:20px; margin-bottom:20px; }
.m40	{ margin-top:40px; margin-bottom:40px; }
.m60	{ margin-top:60px; margin-bottom:60px; }
.m80	{ margin-top:80px; margin-bottom:80px; }

.mt0	{ margin-top:0px !important; }
.mt5	{ margin-top:5px !important; }
.mt_5	{ margin-top:-5px !important; }
.mt10	{ margin-top:10px !important; }
.mt20	{ margin-top:20px !important; }
.mt30	{ margin-top:30px !important; }
.mt35	{ margin-top:35px !important; }
.mt40	{ margin-top:40px !important; }
.mt50	{ margin-top:50px !important; }
.mt60	{ margin-top:60px !important; }
.mt70	{ margin-top:70px !important; }
.mt80	{ margin-top:80px !important; }
.mt90	{ margin-top:90px !important; }
.mt110	{ margin-top:110px !important; }

.mb0	{ margin-bottom:0px; }
.mb15	{ margin-bottom:15px; }
.mb20	{ margin-bottom:20px; }
.mb40	{ margin-bottom:40px; }
.mb60	{ margin-bottom:60px; }

/* 余白設定用
----------------------------------------------- */
.np		{ padding: 0; }
.npr	{ padding-right: 0; }
.pr15	{ padding-right:15px !important; }
.pr30	{ padding-right:30px !important; }
.pr50	{ padding-right:50px !important; }
.pl50	{ padding-left:50px !important; }
.pl80	{ padding-left:80px !important; }
.position_center { display:table-cell;position: absolute;float:none;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}

/* 768px以下の画面サイズの場合【マージン・余白】
----------------------------------------------- */
@media (max-width: 768px) {
	.mt0, .mt5, .mt_5, .mt20, .mt30, .mt35, .mt40, .mt50, .mt60, .mt70, .mt80, .mt90, .mt110 { margin-top:20px !important; }
	.m20, .m40, .m60, .m80	{ margin-top:0px; margin-bottom:0px; }
	.mb0	{ margin-bottom:20px; }
	.pl50, .pl80	{ padding-left:15px !important; }
	.pr30, .pr50	{ padding-right:15px !important; }
}

/* 見出しのフォント
----------------------------------------------- */
copy {
	font-size:13px;
}

/* 768px以下の画面サイズの場合【見出し】
----------------------------------------------- */
@media (max-width: 768px) {
}

/* 基本設定にプラス
----------------------------------------------- */
.container { position: relative;max-width:1230px; }
div.input-group { margin-bottom:5px; }
.input-group-addon { color:#fff; }
span.after_delete { display:inline-block;margin-left:20px; }

/* フレックス
----------------------------------------------- */
.flexbox {
	display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
	flex-wrap:wrap;
	justify-content:space-around;
}
.flex1 {
	flex:auto;
}
a.flex_line {
	flex:auto;
	line-height:1.5em;
	text-align:center;
	color:#fff !important;
	padding:5px 0;
	position:relative;
}
a.flex_line.border:after {
	content:"|";
	color:#eee;
	font-size:11px;
	position:absolute;
	right:0;
}
a.flex_line {
	padding:0 10px;
	display:inline-block;
}
a.flex_line:last-child {
	border-right: none;
}

a.flex_line { text-decoration: none; }

a.flex_line:hover {
	text-decoration:underline;
}
/* 769px以上の画面サイズの場合【ナビ】
----------------------------------------------- */
@media (min-width: 769px) {
	.navbar-default, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
		background:none;
		border:none;
	}
	.navbar-collapse { padding:0; }
	.navbar-nav {
		margin:35px 0px 20px 0px;
		display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
		flex-wrap:wrap;
		justify-content:space-between;
		width:100%;
	}
	.navbar-nav > li {
		flex:auto;
		text-align: center;
		font-size:18px;
	}
	.navbar-nav > li > a {
		padding:0px;
		line-height:1em;
		color:#000 !important;
	}
	.navbar-nav > li > a:hover {
		color:#958771 !important;
	}
	.navbar { margin:0; height:auto;}
	header i { color:#1f862b; }
}

/* 768px以下の画面サイズの場合【フッターナビ】
----------------------------------------------- */
@media (max-width: 768px) {
	footer .navbar-nav {
		width:100%;
	}
}

/* フッター
----------------------------------------------- */
footer {
	background-color:#20862c;
	color:#fff;
}

/* トップページパネル
----------------------------------------------- */
.top.panel>.panel-heading {
	color:#fff;
	font-weight:800;
	font-size:1.5em;
}
.top.panel.panel-success>.panel-heading {
	background-color: #1f862b;
	border-color: #1f862b;
	padding: 10px 20px;
	border-radius: 20px;
}

.top.panel.panel-success {
	border-color: #1f862b;
	border-width:3px;
	border-radius: 8px;
}
.top.panel.panel-warning {
	border-color: #e5c00f;
	border-width:3px;
	border-radius: 8px;
}
.top.panel.panel-warning>.panel-heading {
	background-color: #e5c00f;
    border-color: #e5c00f;
}



/* トップお知らせ
----------------------------------------------- */
div.rss-box { line-height: 200% !important;}


/* トップページカテゴリー
----------------------------------------------- */
.top_cat p.lead { font-weight:bold;}
.top_cat a { color:#000; }



/* 会員紹介
----------------------------------------------- */
.naka{
    width: 100%;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

#syokai{
    border: 1px solid ;
    border-collapse: collapse;
    width: 100%;
}

#syokai th{
    border: 1px solid #ddd;
    padding: 7px;
    background: #25A12B;
    color: #fff;
}

#syokai td{
    border: 1px solid #ddd;
    padding: 5px 0px 0px 17px;
}


#syokai  tr:nth-child(2n){
    background:#E0FFD9;
}

#syokai tr td:nth-of-type(1) {
    width: 25%;
}

#syokai tr td:nth-of-type(2) {
    width: 35%;
}


.bnr{
     width: 100%;  
     max-width: 1000px;
     margin-left: auto;
     margin-right: auto;
     text-align: center;
}

.bnr img{
    display:inline-block;
    padding: 0px;
    box-shadow:0px 2px 1px #b2b2b2 ;
    -moz-box-shadow:0px 2px 1px #b2b2b2 ;
    -webkit-box-shadow:0px 2px 1px #b2b2b2 ;
}


/* リンク
==================================================== */
a {
	color: #333; 
}

a:hover { color: #333; }

a.header-link {
	color: #fff; 
}

a.header-link:hover {
	color: #fff; 
}

.cont a {
	color: #2b467a;
}
a:hover img { opacity:0.8; }

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,1);
}

nav a, footer a { color: #fff; }
a.nav-item {
	color: #fff;
	display:inline-block;
	margin: .5rem 1em;
	line-height:1em;
	padding:.5em 0;
}
.nav-line {
	margin:0;
	border-top: 1px dotted #fff;
}
nav a:hover, .nav-item a:hover, footer a:hover {
    color: #1f862b;
    text-decoration:none;
}

.leftline5px {
	border-left:5px solid #fff;
	padding-left:8px;
	color:#fff;
	display: inline-block;
	margin:8px 0;
	line-height:1em;
}

/* スクロールバー
==================================================== */
body {
  /* JavaScriptでスクロールバーの幅を取得するために必要 */
  overflow-y: scroll;
}
.scrollable_wrap {
  max-width: 400px;
  overflow: hidden;
}
.scrollable {
  margin-right: -17px; /* オーバーレイスクロールバーを消す */
  padding-right: 17px; /* オーバーレイスクロールバーを消す */
  height: auto;
  max-height:400px;
  overflow: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
.scrollable.is-scrollbar {
  padding-right: 0;
}

/* ナビバー
==================================================== */
.navi_line {
	opacity: 0;
	display:inline-block;
	width:1%;
	animation: stretch_to_right 0.7s ease 0.2s forwards;
	transform-origin: top left;
}



@media (min-width:768px) {
	.navbar-expand-md .navbar-nav .dropdown-menu {

position: absolute;
		width: 100% !important;
	}
}


/* お知らせ
==================================================== */

	/* ==========================
   お知らせ一覧 共通
   ========================== */
	
	.news-info_wrapper {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	
	.news-row_wrapper {
		padding: 24px 0;
		border-bottom: 1px solid #e5e7eb;
	}
	
	.news-row_wrapper:last-child {
		border-bottom: none;
	}
	
	/* 日付＋カテゴリ */
	.news-date_wrapper {
		display: flex;
		align-items: center;
		gap: 12px;
		margin-bottom: 10px;
	}
	
	/* 日付 */
	.news-date {
		font-size: 0.85rem;
		color: #6c757d;
		white-space: nowrap;
	}
	
	/* ==========================
   カテゴリ（ボタン風）
   ========================== */
	
	.news-classification div {
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
	}

	.news-classification a, .cat_list a {
		text-decoration: none;
	}
	
	/* セミナー・視察 */
	.news-classification .seminar, .selected-categories .seminar, .cat_list .seminar {
		background-color: #70dff6;
		color: #fff;
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
		width: 120px;
		text-align:center;
	}
	
	/* 行事・イベント */
	.news-classification .event, .selected-categories .event, .cat_list .event {
		background-color: #fd7474;
		color: #fff;
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
		width: 120px;
		text-align:center;
	}
	

	/* 補助金 */
	.news-classification .hojokin , .selected-categories .hojokin, .cat_list .hojokin {
		background-color: #f5b570;
		color: #fff;
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
		width: 120px;
		text-align:center;
	}

	/* 出店・販路 */
	.news-classification .hanro, .selected-categories .hanro, .cat_list .hanro {
		background-color: #c874fd;
		color: #fff;
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
		width: 120px;
		text-align:center;
	}
	
	/* お知らせ */
	.news-classification .other, .selected-categories .other, .cat_list .other {
		background-color: #a8e468;
		color: #fff;
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
		width: 120px;
		text-align:center;
	}

	/* すべて表示 */
	.news-classification .all, .selected-categories .all, .cat_list .all {
		background-color: #41b85d;
		color: #fff;
		display: inline-block;
		padding: 4px 12px;
		font-size: 0.75rem;
		border-radius: 9999px;
		font-weight: 500;
		line-height: 1.4;
		width: 120px;
		text-align:center;
	}
	
	/* ==========================
   内容
   ========================== */
	
	.news-content p {
		margin: 0;
		font-size: 0.95rem;
		line-height: 1.8;
		color: #212529;
	}
	
	/* ==========================
   SP対応
   ========================== */
	
	@media (max-width: 575px) {
		.news-date_wrapper {
			flex-wrap: wrap;
			gap: 8px;
		}
		
		.news-row_wrapper {
			padding: 18px 0;
		}
	}
	
	
	/* ==========================
   ページネーション
   ========================== */
	
	.news-pagination {
		margin-top: 40px;
		display: flex;
		justify-content: center;
	}
	
	.news-pagination ul {
		display: flex;
		gap: 6px;
		padding: 0;
		margin: 0;
		list-style: none;
	}
	
	.news-pagination li {
		display: inline-block;
	}
	
	/* 通常リンク */
	.news-pagination a,
	.news-pagination span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 36px;
		height: 36px;
		padding: 0 12px;
		border-radius: 6px;
		border: 1px solid #dee2e6;
		font-size: 0.875rem;
		text-decoration: none;
		color: #20862c;
		background-color: #fff;
		transition: all 0.2s ease;
	}
	
	/* hover */
	.news-pagination a:hover {
		background-color: #20862c;
		color: #fff;
	}
	
	/* 現在ページ */
	.news-pagination .current {
		background-color: #20862c;
		color: #fff;
		border-color: #20862c;
		font-weight: 600;
	}
	
	/* 無効（前後なし） */
	.news-pagination .dots {
		border: none;
		color: #20862c;
	}
	
	/* SP調整 */
	@media (max-width: 575px) {
		.news-pagination a,
		.news-pagination span {
			min-width: 32px;
			height: 32px;
			font-size: 0.8rem;
		}
	}


.news-classification a.active {
  outline: 2px solid rgba(0,0,0,.15);
  box-shadow: 0 0 0 2px rgba(255,255,255,.6) inset;
}



/* タイトル行（カテゴリ + タイトルを横並び） */
.news-content {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap; /* スマホで自然に改行 */
}

/* タイトル */
.news-title {
  font-size: 1rem;
  font-weight: 400;
  color: #212529;
  text-decoration: none;
}

.news-title:hover {
  text-decoration: underline;
}

/* カテゴリが複数ある場合の間隔 */
.news-classification a {
  margin-right: 6px;
}


#top-news {
  scroll-margin-top: 652px; /* ヘッダー分の高さ */
}


.grecaptcha-badge {display: none;}