@charset "utf-8";
/* CSS Document */

/* CSS Infomation =========================
File name: style.css
Latest Update:2020.07.15
Description:bootstrapカスタマイズ
===========================================*/


/*=========================================

共通設定

========================================= */

body{
	font-family:"游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	border-top:5px solid #0568b7;
}
.container{
	padding-left:0;
	padding-right:0;
}

/*パンくずリスト*/
ol.breadcrumb{
	background:none;
	font-size:0.8rem;
	color:#0568b7;
}
ol.breadcrumb a{
	color:#0568b7;
	text-decoration:underline;
}


/*ページトップへ戻る*/
p.pagetop {
    display:none;
    position:fixed;
	background:#0568b7;
	padding:0.25rem 1rem;
	opacity:0.8;
	display:block;
}

/*ie11対応*/
@media all and (-ms-high-contrast: none) {
p.pagetop {
	padding:0.5rem 1rem 0 1rem;
}
}

p.pagetop a {
    display:block;
	color:#fff;
    font-size:2rem;
    text-decoration:none;
}

p.pagetop a:hover {
	opacity:0.7;
}


/*ie11対応*/
@media all and (-ms-high-contrast: none) {
.badge{
padding:0.5em 0.4em 0.25em 0.4em;
}
}

/*=========================================

article

========================================= */

div.article{
	background:#f9f9f9;
}

/*main*/
div.main{
	background:#fff;
	border:1px solid #ccc;
	padding:2rem;
}

div.main h1{
	font-size:1.25rem;
	border-left:5px solid #0568b7;
	padding:0.5rem 1rem;
	font-weight:bold;
	margin-bottom:2rem;
}



/*h1トップのニュース*/
div.top_news h1{
	font-size:1rem;
	color:#fff;
}

div.top_news h1 span{
	background: #0568b7;
	padding: 0.25rem 1rem;
}

/*h2通常バージョン*/
h2{
	font-size:1rem;
	color:#0568b7;
	font-weight:bold;
}

/*h2下線バージョン*/
h2.h2_border{
	border-bottom:1px solid #0568b7;
	padding-bottom:0.5rem;
}

/*h2newバージョン*/
h2.h2_news{
	color:#333;
	background:#efefef;
	padding:0.5rem;
	border-left:10px solid #0568b7;
}
h3{
	font-size:1rem;
	font-weight:bold;
	border-left:18px solid #0568b7;
	padding-left:10px;
}
/*badge設定*/
span.badge{
	float:right;
}
span.badge-danger{
	background:#dc573a;
}
span.badge-primary{
	background:#0568b7;
}

/*section設定*/
section{
	margin-bottom:4rem;
}

/*=========================================

個別ページ：ホーム

========================================= */
/*ニュース部分*/
div.top_news{
	margin:2rem 0;
}
span.date{
	font-size:0.85rem;
	padding-left: 0.5rem;
	border-left:15px solid #0568b7;
}

table.table_news thead tr{
	border-bottom: 1px solid #999;
}
tr.top4{
	border-bottom: 1px dashed #999;
}
tr.last{
	border-bottom: 1px solid #999;
}
table.table_news tbody td{
	font-size: 0.85rem;
}
td.newslist_link{
	text-align: right;
	font-size: 0.9rem;
}
td.newslist_link a{
	color:#000;
	text-decoration: none;
}
td.newslist_link span{
	color:#0568b7;
}
td.newslist_link a:hover{
	opacity: 0.8;
}
span.label{
	color:#fff;
	padding:0.25rem 0.5rem;
	margin-right:0.5rem;
	font-size:0.75rem;
}
span.label1{
	background:#2ea0a1;
}
span.label2{
	background:#0568b7;
}
span.label3{
	background:#dc573a;
}

/*=========================================

個別ページ：組合の概要

========================================= */
/*テーブル：概要・組合の共同事業活動について*/

table.outline{
	width:100%;
}

/*テーブル：役員名簿*/

table.name_list{
	width:100%;
}
table.name_list th,
table.name_list td{
	white-space:nowrap;
}

table.name_list th{
	width:25%;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	padding-right:10%;
}

table.name_list td.name{
	width:20%;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	padding-right:10%;
}
table.name_list td.company{
	width:35%;

}

/*=========================================

個別ページ：組合の歩み

========================================= */
/*テーブル：組合の歩み*/
table.history{
	width:100%;
}

table.history th{
	color:#0568b7;
}

/*トグル：歴代組合役員一覧*/

div.card{
	margin-bottom:0.5rem;
}
div.card-header{
	background:#0568b7;
	padding:0;
}
.toggle_btn{
	color:#fff;
	text-decoration:none;
	font-weight:bold;
}
.toggle_btn:hover{
	color:#fff;
	text-decoration:none;
	opacity:0.8;
}
.toggle_btn:focus{
	text-decoration:none;
}
div.officer_list [aria-expanded="false"]{
	position:relative;
}
div.officer_list [aria-expanded="false"]:after {
  content: url("../images/plus.png");
  position:absolute;
  right:1rem;
}

div.officer_list [aria-expanded="true"]:after {
  content: url("../images/minus.png");
  position:absolute;
  right:1rem;
}

/*テーブル：歴代組合役員一覧*/
table.officer{
	width:100%;
}
table.officer th,
table.officer td{
	white-space:nowrap;
}
table.officer th{
	border:1px solid #ccc;
}

table.officer th.position{
	width:15%;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	background:#d0e6f7;
	color:#000;
	font-weight:normal;

}
table.officer th.year{
	width:17%;
	background:#d0e6f7;
	color:#000;
	text-align:center;
	font-weight:normal;
}

table.officer td{
	width:17%;
	text-align:center;
}

/*テーブル：工場集団化時の設備投資*/

table.investment{
	width:100%;
}
table.investment th{
	text-align:center;
}

table.investment th,
table.investment td{
	white-space: nowrap;
}

table.investment thead th{
	background:#0568b7;
	color:#fff;
}

table.investment tr.sum{
	background:#e9f2fb;
}

table.investment td.investment_t{
	text-align:center;
}

table.investment td.investment_d{
	text-align:right;
}

/*=========================================

個別ページ：組合各社の紹介

========================================= */

/*テーブル：組合各社の紹介*/
table.member{
	width:100%;
	white-space:nowrap;
}

table.member th{
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	text-justify: inter-character;
}

table.member thead th{
	background:#0568b7;
	color:#fff;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
}

table.member th a{
	color:#0568b7;
}

table.member th a:hover{
	text-decoration:none;
}
figure img{
width:100%;
}

/* 奇数行のスタイル */
table.member tr:nth-child(odd){
  background:#fff;
}

/* 偶数行のスタイル */
table.member tr:nth-child(even){
  background:#e9f2fb;
}

/* 列の幅 */
th.company{
	width:25%;
}
th.name,
td.name{
	width:18%;
}

td.name{
	text-align:center;
}

th.address,
td.address{
	width:25%;
}
th.tel,
td.tel,
th.fax,
td.fax{
	width:16%;
}


/*=========================================

個別ページ：組合各社　詳細ページ

========================================= */
div.company_logo{
	margin-bottom: 2rem;
}
div.main_pic{
	text-align: center;
	margin-bottom: 2rem;
}
table.member_outline{
	border-top:1px solid #999;
	border-bottom:1px solid #999;
}
table.member_outline tr{
	border-bottom:1px dashed #999;
}
table.member_outline th{
	color:#0568b7;
}

p.pic{
	text-align: center;
}
p.pic img{
	width:100%;
	height:auto;
}
p.txt{
	font-size:0.85rem;
}

/*=========================================

個別ページ：活動報告

========================================= */
h2.news :after{
	clear:left;
}

/*=========================================

個別ページ：青年部

========================================= */
div.young_slogan{
	font-size: 1rem;
	margin-bottom:2rem;
	border:1px solid #0066cc;
	background:#e9f2fb;
	padding:1rem;
}

/*アーカイブボタン*/
div.young_archive{
	margin-bottom:2rem;
}
.btn-ya{
	background: #0568b7;
	color:#fff;
	border-right:2px solid #000;
	border-bottom:2px solid #000;
}
.btn-ya:hover{
	opacity: 0.8;
	color:#fff;
}

/*各種ファイルダウンロードボタン*/
.btn-ydl{
	background: #da4c37;
	color:#fff;
	border-right:2px solid #000;
	border-bottom:2px solid #000;
}
.btn-ydl:hover{
	opacity: 0.8;
	color:#fff;
}



/*=========================================

個別ページ：アクセス

========================================= */
div.map{
	text-align:center;
}

/*地図ダウンロードボタン*/
.btn-mapdl{
	background: #da4c37;
	color:#fff;
	border-right:2px solid #000;
	border-bottom:2px solid #000;
}
.btn-mapdl:hover{
	opacity: 0.8;
	color:#fff;
}

.btn-mapdl span{
	font-size:0.8rem;
}



/*=========================================

個別ページ：お問い合わせ

========================================= */
table.contact{
	width: 100%;
	margin-bottom: 3rem;
}
table.contact th{
	background:#e9f2fb;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
}
.btn_form{
	background: #0568b7;
	color:#fff;
	font-weight: bold;
	font-size:1.1rem;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	position:relative;
}
.btn_form2{
	background: #999;
	color:#fff;
	font-weight: bold;
	font-size:1.1rem;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	position:relative;
}

.btn_form3{
	background: #da4c37;
	color:#fff;
	font-weight: bold;
	font-size:1.1rem;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	position:relative;
}


.btn_form:after,
.btn_form2:after,
.btn_form3:after {
  content: url("../images/arrow.png");
  position:absolute;
  right:1rem;
}

.btn_form:hover,
.btn_form2:hover,
.btn_form3:hover{
	opacity: 0.8;
	color:#fff;
}
.form_btn_block{
	margin-bottom:1rem;
}

.error_txt{
	color:#F00;
}
ul.error li{
	color:#F00;
}



@media (min-width: 992px)  {

/* 画面サイズが992px(Large)以上の場合読み込む*/


/*=========================================

ヘッダー

========================================= */

/*sp用ロゴを非表示*/
.navbar-brand{
	display:none;
}

/*お問い合わせ・電話ボタン*/
.btn-tel{
	background:#0568b7;
	border-radius:0;
	color:#fff;
	font-weight:bold;
}

.btn-tel:hover{
	color:#fff;
	cursor: default;
}

.btn-form{
	background:#da4c37;
	border-radius:0;
	color:#fff;
	font-weight:bold;
}

.btn-form:hover{
	color:#fff;
	opacity:0.8;
}


/*=========================================

グローバルメニュー

========================================= */

.navbar{
	background:#e5e5e5;
	padding:0;
}
.nav-item{
	color:#333;
	background:#e5e5e5;

}
.nav-item:hover{
	background:#0568b7;
	color:#fff;
}
.active{
	background:#0568b7;
	color:#fff;
}

.active:hover{
	background:#3786c5;
	color:#fff;
}

.nav-item{
	font-weight:bold;
	border-left:1px solid:#fff;
	padding:0.75rem 0;
}
.nav_border{
	border-right:1px solid #fff;
}

/*=========================================

article

========================================= */

div.article{
	padding-bottom:3rem;
}

/*main*/
div.main{
	width:80%;
	margin:0 10%;
}


/*=========================================

フッター

========================================= */

.footer_menu_sp{
	display:none;
}

div.footer_menu_pc{
	background:url(../images/footer_back.jpg);
	color:#0568b7;
	text-align:center;
	font-weight:bold;
	padding:3rem 0;
	border-bottom:1px solid #333;
}
div.footer_menu_pc a{
	color:#0568b7;
}
div.footer_menu_pc a:hover{
	text-decoration:none;
	opacity:0.7;
}
div.footer_menu_pc span{
	font-size:1rem;
}
div.footer_btn{
	margin-bottom:2rem;
}
div.footer_btn div{
	padding-top:2rem;
	padding-bottom:2rem;
}
div.partition{
	border-right:2px solid #fff;
}

/*フッター問い合わせ*/
div.footer_inqury{
	text-align:center;
	font-size:0.8rem;
	color:#0568b7;
}

.icon{
	font-size:2.25rem;
}

/*=========================================

個別ページ：ホーム

========================================= */
/*ニュース部分*/
div.top_news{
	width: 94%;
	margin-left:3%;
}
table.table_news th{
	width:20%;
}
table.table_news td{
	width:80%;
}
/*=========================================

個別ページ：組合各社　詳細ページ

========================================= */
div.main_pic,
div.main_pic2{
	clear:left;
	text-align:center;
	margin-bottom:2rem;
}
div.main_pic img{
	width:50%;
	height:auto;
}
div.main_pic2 img{
	width:30%;
	height:auto;
}

.br{
	display:none;
}
/*=========================================

個別ページ：活動報告

========================================= */
.btn-young{
	background:#0568b7;
	border-radius:0;
	color:#fff;
	font-weight:bold;
}

.btn-young:hover{
	color:#fff;
	opacity:0.8;
}


}




@media (min-width: 992px) and (max-width:1199px) {

/* 画面サイズが992px(Large)以上1199px(exLarge)以下の場合読み込む*/

/*ヘッダー　お問い合わせ・電話ボタン*/
.btn-tel{
	font-size:0.8rem;
}

.btn-form{
	font-size:0.8rem;
}

}

@media (max-width: 991px)  {
/* 画面サイズが991px(Large)以下の場合読み込む*/

/*=========================================

ヘッダー

========================================= */


/*pc版ロゴを非表示*/

div.pc_header{
	display:none;

}

/*=========================================

グローバルメニュー

========================================= */

.navbar-toggler {
  border-color: #ccc;
  background-color:#0568b7;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(255,255,255)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.navbar{
	background:#f4f4f4;
}

.navbar-nav{
	font-weight:bold;
}

.nav-item{
	color:#333;
	background:#f4f4f4;
}
.nav_border{
	border-bottom:1px dotted #ccc;
}

.nav-item:hover{
	background:#0568b7;
	color:#fff;
}
/*=========================================

article

========================================= */
div.article{
	padding-bottom:8rem;
}
/*main*/
div.main{
	width:90%;
	margin:0 5%;
}


/*=========================================

フッター

========================================= */

/*PC版フッターメニュー非表示*/
.footer_menu_pc_wrap{
	display:none;
}
/*SP版フッターメニュー設定*/
.footer_menu_sp{
	background:url(../images/footer_back.jpg);
	text-align:center;
	padding:0.5rem 0;
}
/*お問い合わせ・電話ボタン*/
.btn-tel{
	background:#0568b7;
	color:#fff;
	font-weight:bold;
}

.btn-tel:hover{
	color:#fff;
}

.btn-form{
	background:#da4c37;
	color:#fff;
	font-weight:bold;
}

.btn-form:hover{
	color:#fff;
	opacity:0.8;
}


/*=========================================

個別ページ：アクセス

========================================= */
p.map_img{
	overflow-x:scroll;
}

/*=========================================

個別ページ：活動報告

========================================= */

.btn-young{
	background:#0568b7;
	color:#fff;
	font-weight:bold;
}

.btn-young:hover{
	color:#fff;
	opacity:0.8;
}



}




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

/* 画面サイズが768px(Medium)以上991px(Large)以下の場合読み込む*/

/*=========================================

ヘッダー

========================================= */


/*sp用ロゴ*/
.navbar-brand{
	width:50%;
}


}

@media (min-width: 769px)  {
/* 画面サイズが769px(medium)以上の場合読み込む*/

/*=========================================

共通設定

========================================= */
/*ページトップへ戻る*/
p.pagetop {
    bottom:50px;
    right:40px;
}


/*=========================================

個別ページ：お問い合わせ

========================================= */
.form_btn_block{
	width: 60%;
	margin-left: 20%;
}



}



@media (max-width: 768px)  {
/* 画面サイズが768px(medium)以下の場合読み込む*/
/*=========================================

共通設定

========================================= */
/*ページトップへ戻る*/
p.pagetop {
    bottom:130px;
    right:20px;
}



/*=========================================

ヘッダー

========================================= */


/*sp用ロゴ*/
.navbar-brand{
	width:65%;
}

}

@media (min-width: 576px) and (max-width:991px) {
/* 画面サイズが576px(Medium)以上991px(Large)以下の場合読み込む*/
/*=========================================

個別ページ：ホーム

========================================= */
/*ニュース部分*/
div.top_news{
	width: 100%;
}
table.table_news th{
	width:30%;
}
table.table_news td{
	width:70%;
}


}
@media (min-width: 576px)  {
/* 画面サイズが576px(exsmall)以上の場合読み込む*/
/*=========================================

article

========================================= */

/*main*/
div.main{
	padding:2rem;
}


/*=========================================

個別ページ：組合の概要

========================================= */
/*テーブル：概要・組合の共同事業活動について*/

table.outline th{
	width:25%;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	padding-right:5%;
}

table.outline td{
	width:70%;
}

/*=========================================

個別ページ：組合の歩み

========================================= */
/*テーブル：組合の歩み*/
table.history th{
	width:25%;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	padding-right:5%;
}

table.history td{
	width:70%;
}

/*テーブル：工場集団化時の設備投資*/

table.investment{
	width:100%;
}
table.investment th{
	text-align:center;
}

table.investment thead th{
	background:#0568b7;
	color:#fff;
}

table.investment tr.sum{
	background:#e9f2fb;
}

table.investment td.investment_t{
	text-align:center;
}

table.investment td.investment_d{
	text-align:right;
}

/*=========================================

個別ページ：組合各社　詳細ページ

========================================= */
table.member_outline th{
	width:25%;
	text-align:justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	text-justify: inter-character;
	padding-right:5%;

}
td.subtitle{
	width:20%;
}
td.subdata{
	width:50%;
}

/*=========================================

個別ページ：お問い合わせ

========================================= */
table.contact th{
	width:30%;
}
table.contact td{
	width:70%;
}


}


@media (max-width: 575px)  {
/* 画面サイズが575px(exsmall)以下の場合読み込む*/
/*=========================================

article

========================================= */

/*main*/
div.main{
	padding:1rem;
}



/*=========================================

個別ページ：ホーム

========================================= */
/*ニュース部分*/
div.top_news{
	width: 100%;
}
table.table_news th{
	width:100%;
	display: block;
}
table.table_news td{
	width:100%;
	display: block;
}


/*=========================================

個別ページ：組合の概要

========================================= */
/*テーブル：概要・組合の共同事業活動について*/

table.outline th,
table.outline td{
	width:100%;
	display:block;
}


/*=========================================

個別ページ：組合の歩み

========================================= */
/*テーブル：組合の歩み*/
table.history{
	width:100%;
}

table.history th{
	width:100%;
	display:block;
	color:#0568b7;
}

table.history td{
	width:100%;
	display:block;
}

/*テーブル：工場集団化時の設備投資*/

table.investment{
	width:100%;
}
table.investment th{
	text-align:center;
}

table.investment thead th{
	background:#0568b7;
	color:#fff;
}

table.investment tr.sum{
	background:#e9f2fb;
}

table.investment td.investment_t{
	text-align:center;
}

table.investment td.investment_d{
	text-align:right;
}
/*=========================================

個別ページ：組合各社　詳細ページ

========================================= */
table.member_outline th{
	width:100%;
	display:block;
}
table.member_outline td{
	width:100%;
	display:block;
}

/*=========================================

個別ページ：お問い合わせ

========================================= */
table.contact th{
	width:100%;
	display: block;;
}
table.contact td{
	width:100%;
	display: block;;
}



}