@charset "Shift_JIS";


/* ■■共通テーブル設定■■ */
@media screen and (max-width: 640px) {
table.tbl_90-a{
  width: 90%;
  height: auto;
}
table.tbl_100-a{
  width: 100%;
  height: auto;
}
.block{
  display: block;
}
.nowrap{
  white-space: nowrap;
}

}





/* ■■トップページ■■ */
@media screen and (max-width: 640px) {
.tops_01{
  line-height: 1.4;
  width: 100%;
  height: auto;
  padding: 8px;
}
.tops_02{
  line-height: 1.1;
  width: 100%;
  height: auto;
  padding: 8px;
}
.tops_03{
  line-height: 1.2;
  width: 100%;
  height: auto;
  color: black;
  padding: 8px;
}
.tops_04{
  height: auto;
  width: 100%;
  padding: 8px;
}
}


/* ■■トピックス■■ */
@media screen and (max-width: 640px) {
table.topict1{
  width: 90%;
  display: block;
}
table.topict2{
  width: 100%;
  display: block;
}
.style283{
  display: block;
}
}


/* ■■歴史■■ */
@media screen and (max-width: 640px) {
table.hist td{
  width: 0;
  white-space: nowrap;
}
}


/* ■■役員体制■■ */
@media screen and (max-width: 640px) {
table.yakuin{
  width: 90%;
  white-space: nowrap;
}
table.yakuin td{
  width: 100%;
}
}


/* ■■運動方針■■ */
@media screen and (max-width: 640px) {
table.houshin{
  width: 90%;
}
table.houshin td{
  width: 100%;
  padding: 10px;
}
}


/* ■■綱領■■ */
@media screen and (max-width: 640px) {
table.kouryo{
  width: 90%;
}
}


/* ■■活動内容■■   残す！*/
@media screen and (max-width: 640px) {
table.katsudo{
  width: 90%;
}
table.katsudo td{
  width:100%;
  height: 40px;
  display: block;
}
}


/* ■■調査■■ */
@media screen and (max-width: 640px) {
table.chosa1{
  width: 90%;
}
table.chosa2{
  width: 100%;
}
table.chosa1 td{
  width:100%;
  height: auto;
}
}


/* ■■福利■■ */
@media screen and (max-width: 640px) {
table.fukuri{
  width: 90%;
}
table.fukuri td{
  width:100%;
  height: auto;
  display: block;
}
}


/* ■■ユニアス　ビラ用リスト■■ */
table.fu01{
  border-collapse:collapse;
  margin: 0px;
  width: 600px;
}
table.fu01 tr:nth-child(odd){
  background-color: white;
  font-family: "monospace";
  font-weight: normal;
}
table.fu01 tr:nth-child(even){
  background-color: #CCDDFF;
  font-family: "monospace";
  font-weight: normal;
}
table.fu01 th{
  border-spacing: 0px;
  padding: 0px;
  font-weight: normal;
  text-align: left;
  width: 140px;
}
table.fu01 td{
  border-spacing: 0px;
  padding: 0px;
  text-align: left;
}
@media screen and (max-width: 640px) {
table.fu01{
  border-collapse:collapse;
  margin: 5px;
  width: 90%;
}
table.fu01 tr:nth-child(odd){
  background-color: white;
  font-family: "monospace";
  font-weight: normal;
}
table.fu01 tr:nth-child(even){
  background-color: #CCDDFF;
  font-family: "monospace";
  font-weight: normal;
}
table.fu01 th{
  border-spacing: 0px;
  padding: 0px;
  font-weight: normal;
  text-align: left;
  display: block;
  width: 100%;
}
table.fu01 td{
  border-spacing: 0px;
  padding: 0px;
  text-align: left;
  border-bottom:none;
  display: block;
  width: 100%;
}
}


/* ■■Rフォーユー　ビラ用リスト■■ */
table.r4u01{
  border-collapse:collapse;
  margin: 0px;
  width: 600px;
}
table.r4u01 tr:nth-child(odd){
  background-color: white;
  font-family: "monospace";
  font-weight: normal;
}
table.r4u01 tr:nth-child(even){
  background-color: #98d98e;
  font-family: "monospace";
  font-weight: normal;
}
table.r4u01 th{
  border-spacing: 0px;
  padding: 0px;
  font-weight: normal;
  text-align: left;
  width: 140px;
}
table.r4u01 td{
  border-spacing: 0px;
  padding: 0px;
  text-align: left;
}
@media screen and (max-width: 640px) {
table.r4u01{
  border-collapse:collapse;
  margin: 5px;
  width: 90%;
}
table.r4u01 tr:nth-child(odd){
  background-color: white;
  font-family: "monospace";
  font-weight: normal;
}
table.r4u01 tr:nth-child(even){
  background-color: #98d98e;
  font-family: "monospace";
  font-weight: normal;
}
table.r4u01 th{
  border-spacing: 0px;
  padding: 0px;
  font-weight: normal;
  text-align: left;
  display: block;
  width: 100%;
}
table.r4u01 td{
  border-spacing: 0px;
  padding: 0px;
  text-align: left;
  border-bottom:none;
  display: block;
  width: 100%;
}
}


/* ■■リンク集用リスト■■ */
table.fu02{
  border-collapse:collapse;
  margin: 5px;
  width: 600px;
}
table.fu02 tr{
}
table.fu02 th{
  background-color: #8888FF;
  color: white;
  text-align: left;
  vertical-align:middle;
  font-weight:bold;
}
table.fu02 td{
  color: black;
  text-align: left;
  vertical-align:middle;
}
@media screen and (max-width: 640px) {
table.fu02{
  border-collapse:collapse;
  margin: 0px;
  width: 90%;
}
table.fu02 tr{
}
table.fu02 th{
  border-spacing: 0px;
  padding: 0px;
  background-color: #8888FF;
  color: white;
  text-align: left;
  vertical-align: bottom;
  font-weight: bold;
  display: block;
  width: 100%;
  height: 25px;
}
table.fu02 td:nth-child(odd){
  border-spacing: 0px;
  padding: 0px;
  color: black;
  text-align: left;
  vertical-align: bottom;
  display: block;
  width: 100%;
  height: 22px;
}
table.fu02 td:nth-child(even){
  border-spacing: 0px;
  padding: 0px;
  color: black;
  text-align: left;
  vertical-align: top;
  display: block;
  width: 100%;
  height: 40px;
}
}


/* ■■労協比較表■■ */
.rokyo{
  text-align: left;
  vertical-align: top;
}

.tr-40{
  width: 40%;
}


.txt-mark1{
  background-color: yellow;
}

.txt-mark2 {
  color: #C93D33;
  text-decoration: line-through;
}




/* ■■モバイルの改行位置指定：<wbr>を挿入■■ */
@media screen and (max-width: 640px) {
.mob-kinsoku{
  word-break: keep-all;
  overflow-wrap: break-word;
}
}


/* ■■モバイルのインデント(１文字)：全体■■ */
@media screen and (max-width: 640px) {
.mob-indent1{
  padding-left: 1em;
}
}


/* ■■モバイルのインデント(１文字)：2行目以降■■ */
@media screen and (max-width: 640px) {
.mob-indent2{
  padding-left: 1em;
  text-indent: -1em;
}
}


/* ■■モバイルのインデント(１文字)：先頭のみ■■ */
@media screen and (max-width: 640px) {
.mob-indent3{
  text-indent: -1em;
}
}


/* ■■モバイルの画像最大値指定■■ */
@media screen and (max-width: 640px) {
img {
  width: 90%;
  object-fit: scale-down;
}
}


/* ■■モバイルの画像1文字分の幅■■ */
@media screen and (max-width: 640px) {
.1em {
  width: 1em;
}
}


/* ■■モバイルの画像二枚並列■■ 
@media screen and (max-width: 640px) {
.pic_frame {
  display: inline-block;
  text-align: center;
  width: 48%;
}
}*/


/* ■■フレーム■■ */
.frame-base {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 100%;
  }
  .frame-left {
    float: left;
    width: 235px;
  }
  .frame-right {
    display: flex;
    width: 100%;
  }
@media screen and (max-width: 640px) {
  .frame-base {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
  }
  .frame-base .frame-left {
  display:none;
  }
  .frame-base .frame-right {
    position:absolute;
    top:0;
    left:0px;
    width:100%;
    height:100%;
    overflow: auto;
  }
}


/* ■■モバイルテーブル横スクロール■■ */
@media screen and (max-width: 640px) {
.mob-scroll {
  margin-inline: auto;
  margin-top: 0px;
  overflow-x: auto; /* tableタグのはみ出た要素を隠す */
  white-space: nowrap; /* テキストの折り返しなし */
  width: 90%;
}
/*スクロールバー全体の高さ*/
.mob-scroll::-webkit-scrollbar {
  height: 4px;
}
/*スクロールバー全体の背景*/
.mob-scroll::-webkit-scrollbar-track {
  background: #ccddff;
}
/*スクロールバーの動く部分*/
.mob-scroll::-webkit-scrollbar-thumb {
  background: #5c92fd;
  border: none;
}
/*スクロールバーの動く部分のホバー（マウスオーバー）*/
.mob-scroll::-webkit-scrollbar-thumb:hover {
  background: #999;
}
}


/* ■■モバイル非表示■■ */
@media screen and (max-width: 640px) {
.mob-off {
  display: none;
}
}


/* ■■PC非表示■■ */
@media screen and (min-width: 641px) {
.pc-off {
  display: none;
}
}


/* ■■モバイルテーブルデータ最小幅、改行なし■■ */
@media screen and (max-width: 640px) {
.mob-min-nowrap {
  white-space: nowrap;
  width: auto;
}
}


/* ■■トップへ移動■■ */
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #ababab;
  opacity: 0.6;
  border-radius: 50%;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -5px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}


/* ■■ハンバーガーメニュー■■ */
/* リセットCSS */
/* リセット停止→→
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: bottom;
  background: transparent;
  list-style: none;
}
←←リセット停止*/
ul{
  padding-left:0;
}

li{
  list-style:none;
}
/*　↑↑リセットの変わりにリスト変更　*/

body {
  overflow-x: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}
 
.list_a {
  display: block;
  color: inherit;
  text-decoration: none;
  font: inherit;
}

/* ここまでリセットCSS */

body {
  font-family: "Arial", sans-serif;
  color: #555;
  font-feature-settings: "palt";
}

html {
  scroll-behavior: smooth;
}

header {
  position: fixed;
  height: 60px;
  width: 100%;
  padding: 0 20px;
/*  background: #fff;*/
  background: transparent;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  font-size: 26px;
}

.hamburger {
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
}

.hamburger .bar {
  width: 30px;
  height: 3px;
  background: #333;
  border-radius: 2px;
  display: block;
  position: absolute;
  transition: all 0.3s;
}

.hamburger .bar-top {
  transform: translate(0, -10px);
}

.hamburger .bar-bottom {
  transform: translate(0, 10px);
}

.checkbox:checked ~ .hamburger .bar-middle {
  opacity: 0;
}

.checkbox:checked ~ .hamburger .bar-top {
  transform: translate(0, 0) rotate(45deg);
}

.checkbox:checked ~ .hamburger .bar-bottom {
  transform: translate(0, 0) rotate(-45deg);
}

.checkbox {
  display: none;
}

.nav-menu {
  position: fixed;
  width: 280px;
  height: 100%;
  background: #000;
  opacity: 0.8;
  color: #fff;
  top: 0;
  left: -100%;
  transition: all 0.5s;
}

.nav-menu ul {
  margin-top: 70px;
}

.nav-menu li {
  margin-bottom: 15px;
}

.nav-menu a {
  text-align: center;
  font-size: 20px;
}

.checkbox:checked ~ .nav-menu {
  left: 0;
}

main {
  height: 1000px;
  background: #CCFAFF;
}

@media screen and (min-width: 641px) {
  .nav-menu,.hamburger{
  display:none;
}
}